es6 擴充套件運算子 三個點( )

2021-07-27 17:27:45 字數 2232 閱讀 7650

看了阮大大的文章,發現很多都有運算子【暫且叫運算子】三個點點。

於是查了一下。其實看起來這樣用也很6

乾貨如下

表面意思:

擴充套件運算子(spread)是三個點(…)。它好比 rest 引數的逆運算,將乙個陣列轉為用逗號分隔的引數序列。

該運算子主要用於函式呼叫。

function

push

(array, ...items)

function

add(x, y)

var numbers = [4, 38];

add(...numbers) // 42

上面**中,array.push(…items)和add(…numbers)這兩行,都是函式的呼叫,它們的都使用了擴充套件運算子。該運算子將乙個陣列,變為引數序列。

es5的寫法

function f(x, y, z)

var args = [0, 1, 2];

// es6的寫法

function f(x, y, z)

var args = [0, 1, 2];

f(...args);

// es5的寫法

// es6的寫法

math.max(...[14, 3, 77])

// 等同於

math.max(14, 3, 77);

另乙個例子是通過push函式,將乙個陣列新增到另乙個陣列的尾部。

// es5的寫法

var arr1 = [0, 1, 2];

var arr2 = [3, 4, 5];

// es6的寫法

var arr1 = [0, 1, 2];

var arr2 = [3, 4, 5];

arr1.push(...arr2);

合併陣列

// es5

[1, 2].concat(more)

// es6

[1, 2, ...more]

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' ]

擴充套件運算子還可以將字串轉為真正的陣列。

> [...

'hello']

// [ "h", "e", "l", "l", "o" ] 6到飛起

【有乙個重要的好處,那就是能夠正確識別32位的unicode字元。】

2實現了iterator介面的物件

iterator應該是es7元程式設計的概念,指 symbol iterator。你理解為物件的迭代器就ok了,這裡的物件指廣泛物件,即

object array string 這種,它們都有對應的迭代介面—— for .. for.. in .. for … of

foreach , keys .. 這些

var nodelist = document.queryselectorall('div');

vararray=[

...nodelist]

;

對於那些沒有部署iterator介面的類似陣列的物件,擴充套件運算子就無法將其轉為真正的陣列。

let arraylike = ;

// typeerror: cannot spread non-iterable object.

let arr =

[...arraylike]

;

上面**中,arraylike是乙個類似陣列的物件,但是沒有部署iterator介面,擴充套件運算子就會報錯。這時,可以改為使用array.from方法將arraylike轉為真正的陣列。

es6 擴充套件運算子 三個點( )

擴充套件運算子 spread 是三個點 它好比 rest 引數的逆運算,將乙個陣列轉為用逗號分隔的引數序列。console.log 1,2,3 1 2 3 console.log 1,2,3,4 5 1 2 3 4 5 document.queryselectorall div 該運算子主要用於函式...

ES6 拓展運算子 三個點

es6中引入擴充套件運算子 它用於把乙個陣列轉化為用逗號分隔的引數序列,它常用在不定引數個數時的函式呼叫,陣列合併等情形。因為typescript是es6的超集,所以typescript也支援擴充套件運算子。1 可變引數個數的函式呼叫function push array,items functio...

ES6 拓展運算子 三個點

拓展運算子是什麼?es6中引入擴充套件運算子 它用於把乙個陣列轉化為用逗號分隔的引數序列,它常用在不定引數個數時的函式呼叫,陣列合併等情形。因為typescript是es6的超集,所以typescript也支援擴充套件運算子。用在什麼地方?1 可變引數個數的函式呼叫 function push ar...