es6 -- 默認參數Default，不定參數Rest，擴展運算符Spread詳解

Betta 發布于2019-08-23 15:20 / 2258人閱讀

摘要：將數組中的每個元素展開為函數參數擴展運算符取代方法的一個實際的例子，應用方法，簡化求出一個數組最大元素的寫法。

歡迎訪問我的個人博客：http://www.xiaolongwu.cn

前言

記錄一下在實際開發中，很有用的三個es6的新方法

用法詳解

默認參數

function f(x, y=13) {
  // 如果沒有傳入y或傳入了undefined，y的默認值為13
  return x + y;
}
f(5) // 18

不定參數Rest

不定參數rest，讓我們不再需要arguments，從而避免很多麻煩

function f(x, ...r) {
  // y是一個數組
  console.log(r);  //["h", true]
  return x * r.length;
}
f(4, "h", true) // 8

擴展運算符

1、展開運算符，展開函數的參數。

function f(x, y, z) {
  return x + y + z;
}
// 將數組中的每個元素展開為函數參數
f(...[3,5,7]) //  15

2、擴展運算符取代apply方法的一個實際的例子，應用Math.max方法，簡化求出一個數組最大元素的寫法。

// ES5 的寫法
Math.max.apply(null, [14, 3, 77])
 
// ES6 的寫法
Math.max(...[14, 3, 77])
 
// 等同于
Math.max(14, 3, 77);

3、通過push函數，將一個數組添加到另一個數組的尾部

// ES5的 寫法
var arr1 = [0, 1, 2];
var arr2 = [3, 4, 5];
Array.prototype.push.apply(arr1, arr2);
 
// ES6 的寫法
var arr1 = [0, 1, 2];
var arr2 = [3, 4, 5];
arr1.push(...arr2);

4、擴展運算符將字符串轉為真正的數組

[..."leon"]

// [ "l", "e", "o", "n"]

5、合并數組更加簡單

// ES5
[11, 2].concat([4,5])

// ES6
[11, 2, ...[4,5]]
 
 
 //多個的寫法
var arr1 = ["a", "b"];
var arr2 = ["c"];
var arr3 = ["d", "e"];
 
// ES5的合并數組
arr1.concat(arr2, arr3);
// [ "a", "b", "c", "d", "e" ]
 
// ES6的合并數組
[...arr1, ...arr2, ...arr3]
// [ "a", "b", "c", "d", "e" ]

我的github資源地址：es6 -- 默認參數Default，不定參數Rest，擴展運算符Spread詳解

我的CSDN博客地址：https://blog.csdn.net/wxl1555

如果您對我的博客內容有疑惑或質疑的地方，請在下方評論區留言，或郵件給我，共同學習進步。

郵箱：wuxiaolong802@163.com

云服務器 GPU云服務器不定參數 default參數 java不定參數類型 java檢查不定參數

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/101882.html

ES6 ...操作符

摘要：在語法中，操作符有兩種意義剩余語法，參數和展開語法，展開數組對象，作為函數數組對象的擴展運算符。使用和參數進行操作其余參數傳給原始函數展開語法運算則可以看作是參數的逆運算。在ES6語法中，...操作符有兩種意義：rest(剩余語法，rest參數) 和 spread(展開語法，展開數組/對象)，作為函數、數組、對象的擴展運算符。從某種意義上說，剩余語法與展開語法是相反的：剩余語法將多...

MorePainMoreGain 2019-08-23 12:12 評論0 收藏0
es6的解構賦值、擴展運算符、rest參數使用

摘要：模板字符串甚至還能嵌套解構賦值允許按照一定模式，從數組和對象中提取值，對變量進行賦值，這被稱為解構。運算符使用場景應該稍少一些，主要是處理不定數量參數，可以避免對象的使用。 es6中較為常用的書寫風格為了書寫的方便，es6中提出了很多比較友好的書寫方式，其中最為常見的屬于以下幾個：字符串模板 `abcdef${test}` 解構賦值 let [a, b, c] = [1,...

xuweijian 2019-08-21 16:47 評論0 收藏0
ES6—擴展運算符和rest運算符（6）

摘要：擴展運算符簡介擴展運算符是三個點，可以將一個數組轉為用逗號分隔的參數序列。在實際項目中靈活應用擴展運算符運算符，能寫出更精簡易讀性高的代碼。 1、擴展運算符簡介擴展運算符（ spread ）是三個點（...），可以將一個數組轉為用逗號分隔的參數序列。說的通俗易懂點，有點像化骨綿掌，把一個大元素給打散成一個個單獨的小元素。 showImg(https://segmentfault.c...

Amio 2019-08-23 17:21 評論0 收藏0
ES6 變量聲明與賦值：值傳遞、淺拷貝與深拷貝詳解

摘要：變量聲明與賦值值傳遞淺拷貝與深拷貝詳解歸納于筆者的現代開發語法基礎與實踐技巧系列文章。變量聲明在中，基本的變量聲明可以用方式允許省略，直接對未聲明的變量賦值。按值傳遞中函數的形參是被調用時所傳實參的副本。 ES6 變量聲明與賦值：值傳遞、淺拷貝與深拷貝詳解歸納于筆者的現代 JavaScript 開發：語法基礎與實踐技巧系列文章。本文首先介紹 ES6 中常用的三種變量聲明方式，然后討論了...

snowLu 2019-08-21 11:55 評論0 收藏0
學習ES6 變量的解構賦值

摘要：變量的解構賦值數組的解構賦值允許寫成下面這樣本質上，這種寫法屬于模式匹配，只要等號兩邊的模式相同，左邊的變量就會被賦予對應的值。對象的解構賦值對象的解構與數組有一個重要的不同。由于和無法轉為對象，所以對他們進行解構賦值，都會報錯。變量的解構賦值數組的解構賦值 let a = 1; let b = 2; let c = 3; ES6允許寫成下面這樣 let [a,b,c] = [1,...

sugarmo 2019-08-20 18:10 評論0 收藏0