ES6展開運算子( )

2022-08-12 08:45:22 字數 1806 閱讀 6863

總結還可以,借鑑下

三個點(...)在es6中,有兩個含義:

用在形參中, 表示傳遞給他的引數集合, 類似於arguments, 叫不定引數. 語法格式:  在形參面前加三個點( ... )

用在陣列前面,可以把陣列的值全部打散,展開,叫展開運算子. 語法格式:  在陣列面前加三個點( ... )

function dostuff (x, y, z) 

var args = [0, 1, 2];

// 呼叫函式,傳遞args引數

dostuff(...args);
這段**變得更短,更清晰,並且不需要使用多餘的null!

已經有好多種合併陣列的方法,但是展開運算子帶來了一種全新的方式。

arr1.push(...arr2) // 將arr2 追加到陣列的末尾

arr1.unshift(...arr2) // 將arr2 追加到陣列的開頭

如果你想要整合兩個陣列,並且想把某個陣列放在另乙個陣列的任意特定位置上,你可以這麼做:

var arr1 = ['two', 'three'];

var arr2 = ['one', ...arr1, 'four', 'five'];

// ["one", "two", "three", "four", "five"]

這是一種比其他方式更短的語句!

得到乙份陣列的拷貝是很常見的任務,過去我們使用array.prototype.slice來做,但現在我們可以使用展開運算子:

var arr = [1,2,3];

var arr2 = [...arr]; // 和arr.slice()差不多

arr2.push(4)

記住:陣列中的物件依然是引用值,所以不是任何東西都「拷貝」過去了。

像拷貝陣列一樣,我們常常使用array.prototype.slice來將nodelistarguments這種類陣列物件轉換為真正的陣列。但是現在我們能夠用展開運算子輕易的實現這項任務:

[...document.queryselectorall('div')]
使用此法,你甚至可以像陣列一樣獲取引數。

var myfn = function(...args) 

別忘了你也能用array.from達成相同的目的!

當然了,展開運算子將陣列「展開」成為不同的引數,所以任何可接收任意數量的引數的函式,都能夠使用展開運算子來傳參。

let numbers = [9, 4, 7, 1];

math.min(...numbers); // 1

math物件的一系列的方法,正是展開運算子作為唯一引數傳遞給函式的完美例子。

解構是一項很棒的實踐方法,我在自己的react專案中以及node.js 程式中大量的使用到它。你能夠使用解構和展開運算子將資訊解壓到你想要的變數中去:

let  = ;

console.log(x); // 1

console.log(y); // 2

console.log(z); //

剩餘的屬性被分配到了展開運算子之後的z變數中。

es6 展開運算子

展開運算子不能用在物件當中,只能在可遍歷物件中使用 iterables iterables的實現是依靠 symbol.iterator 函式,目前只有array,set,string內建 symbol.iterator 方法,不過es7草案中已經加入了物件展開運算子。可用展開運算子展開陣列,解構陣列...

es6 展開運算子

好記性不如爛筆頭,在學習的過程中,越來越明白這句話的含義 es6的展開運算子使用三個點來表示 使用展開運算子的前提 物件具有 iterator 遍歷器介面 比如陣列,怎麼判斷乙個物件是否具有iterator 遍歷器介面呢,我們檢視物件是否有symbol symbol.iterator 屬性就可以了 ...

es6展開運算子

展開運算子 在es6中用.來表示展開運算子,它可以將陣列方法或者物件進行展開。先來看乙個例子它是如何使用的。const arr1 1,2,3 const arr2 arr1,10,20,30 這樣,arr2 就變成了 1,2,3,10,20,30 arr1中的值完全轉殖到了arr2中 arr1改變a...