ECMAScript 6學習筆記(一):展開運算符.md

Javascript 是 ECMAScript 的實現(xiàn)和擴展,ES6標準的制定也為Javascript 加入了許多新特性,本文主要記錄展開運算符。

展開運算符允許一個表達式在某處展開。展開運算符在多個參數(用于函數調用)或多個元素(用于數組字面量)或者多個變量(用于解構賦值)的地方可以使用。

展開運算符不能用在對象當中,因為目前展開運算符只能在可遍歷對象(iterables)可用。iterables實現(xiàn)是依靠[Symbol.iterator]函數,而目前只有 Array,Set,String內置 [Symbol.iterator] 方法,而 Object 尚未內置該方法,因此無法使用展開運算符。不過 ES7 草案當中已經加入了對象展開運算符特性。

函數調用中使用展開運算符

  • 在以前我們會使用 apply 方法來將一個數組展開成多個參數
function test(a, b, c) { }
var args = [0, 1, 2];
test.apply(null, args);

如上,我們把 args 數組當作實參傳遞給了 a, b, c,這邊正是利用了 Function.prototype.apply 的特性。

不過有了 ES6,我們就可以更加簡潔地來傳遞數組參數:

function test(a, b, c) {}
var args = [0, 1, 2];
test(...args);

我們使用...展開運算符就可以把 args 直接傳遞給 test() 函數。

數組字面量中使用展開運算符

  • 在ES6的世界中,我們可以直接加一個數組直接合并到另外一個數組當中:
var arr1 = [ 'a', 'b', 'c' ];
var arr2 = [ ...arr1, 'd', 'e' ];  // [ 'a', 'b', 'c', 'd', 'e' ]
  • 展開運算符符也可以用在push 函數中,可以不用再用 apply() 函數來合并兩個數組:
var arr1 = [ 'a', 'b', 'c' ] 
var arr2 = [ ...arr1, 'd', 'e' ]  // //['a','b','c','d','e']

用于解構賦值

解構賦值也是ES6 中的一個特性,而這個展開運算符可以用于部分情景:

let [arg1, arg2, ...arg3] = [1, 2, 3, 4];
arg1  // 1
arg2  // 2
arg3  // [ '3', '4' ]

展開運算符在解構賦值中的作用跟之前的作用看上去是相反的,將多個數組組合成了一個新數組。
不過要注意,解構賦值中展開運算符只能用在最后:

let [arg1,...arg2,arg3] = [1, 2, 3, 4]; //報錯

ES7草案中的對象展開運算符

ES7 中的對象展開運算符可以讓我們更快捷的操作對象

let { x, y, ...z } = { x: 1, y: 2, a: 3, b: 4};
x // 1
y // 2
z // { a: 3, b: 4 }

如上,我們可以將一個對象當中的對象的一部分取出來成為一個新對象賦值給展開運算符的參數。

同時,我們也可以像數組插入那樣將一個對象插入另外一個對象當中:

let z = { a: 3, b: 4};
let n = { x: 1, y: 2, ...z};
n // {x:1,y:2,a:3,b:4}

另外還要很多用處,比如可以合并兩個對象

let a = { x: 1, y: 2 };
let b = { z: 3 };
let ab = { ...a, ...b };
ab // { x: 1, y:2, z: 3 }

轉載地址:http://www.cnblogs.com/mingjiezhang/p/5903026.html

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內容

  • 三,字符串擴展 3.1 Unicode表示法 ES6 做出了改進,只要將碼點放入大括號,就能正確解讀該字符。有了這...
    eastbaby閱讀 1,671評論 0 8
  • ES6標準的制定為JavaScript加入了許多新特性。本文主要記錄擴展(展開)運算符。 展開運算符(spread...
    周三胖閱讀 743評論 0 1
  • JavaScript是ECMAScript的實現(xiàn)和擴展,ES6標準的制定也為JavaScript加入了許多新特性。...
    hope7th閱讀 5,482評論 0 0
  • 一、let 和 constlet:變量聲明, const:只讀常量聲明(聲明的時候賦值)。 let 與 var 的...
    dadage456閱讀 837評論 0 0
  • 被打擊,總是容易變得低落。 這幾天工作上陸續(xù)被打擊,后來想通了,大家各自的觀點不同而已。 那些挑剔的人們,有他們的...
    牧田麻麻閱讀 245評論 0 0

友情鏈接更多精彩內容