ES6擴充套件運算子

2022-06-12 07:36:18 字數 1903 閱讀 3507

es6,擴充套件運算子

擴充套件運算子(spread)就是我們知道的三個點(...)，它就好像rest引數的逆運算，將乙個陣列轉為用逗號分隔的引數序列。

console.log(...[1,2,3]);


//1 2 3


console.log(1,...[2,3,4],5)


//1 2 3 4 5


console.log([1,...[2,3,4],5])


//[1, 2, 3, 4, 5]


[...document.queryselectorall('div')]


// [, , ]
let arr = [1, 2],


arr1 = [...arr];


console.log(arr1); // [1, 2]


// 陣列含空位


let arr2 = [1, , 3],


arr3 = [...arr2];


console.log(arr3); [1, undefined, 3]
console.log([...[1, 2],...[3, 4]]); // [1, 2, 3, 4]


// 本質也是：**將乙個陣列轉為用逗號分隔的引數序列，然後置於陣列中**
拓展運算子（...）用於取出 引數物件 所有 可遍歷屬性 然後拷貝到當前物件。

基本用法

let person = ;


let someone = ;


console.log(someone);  //
let age = ;


let name = ;


let person = ;


person;  //
注意：自定義的屬性在拓展運算子後面，則拓展運算子物件內部同名的屬性將被覆蓋掉。同理，自定義的屬性在拓展運算度前面，則變成設定新物件預設屬性值。

let person = ;


let someone = ;


let someone1 = ;


console.log(someone);  //


console.log(someone1);  //
拓展運算子後面是空物件、null、undefined，沒有任何效果也不會報錯。

//空物件


let a = , a: 1, b: 2};


console.log(a);  //


// null 、 undefined


let b = ;


console.log(b);  //
不定引數用來表示不確定引數個數，形如，...變數名，由...加上乙個具名引數識別符號組成。具名引數只能放在引數組的最後，並且有且只有乙個不定引數。

基本用法

function f(...values)


f(1,2);      //2


f(1,2,3,4);  //4


function addnumbers(x,y,z)


var numbers = [1,2,3,4];


addnumbers(...numbers); //6


//函式呼叫中，擴充套件運算子（...）將乙個陣列，變為引數序列
擴充套件運算子與政策的函式引數可以結合使用，非常靈活：

function f(x,y,z,v,w)


var args = [0,1,5];


var args1 = [0,1];


f(-1,...args,2,...[3]);//-1, 0, 1, 5, 2


f(-1,...args1,2,...[3]);//-1, 0, 1, 2, 3

ES6 擴充套件運算子

擴充套件運算子用3個點表示,功能是把陣列或者類陣列物件展開成一系列用逗號隔開的值 1，陣列 let arr red green blue console.log arr red,green,blue拷貝陣列 和object.assign一樣都是淺拷貝 let arr red green blue l...

ES6擴充套件運算子

首先，我們要讀仔細下面這句話，就很容易知道擴充套件運算子的使用了，可以在心裡反覆讀三遍 接下來，我們看下究竟怎麼個情況 宣告乙個方法 var foo function a,b,c console.log a console.log b console.log c 宣告乙個陣列 var arr 1,2...

es6擴充套件運算子

1 複製 拷貝 陣列 陣列元素都是基本資料型別 var arr a b c var copy arr console.log copy a b c arr copy false2 函式呼叫 陣列作引數 function add x,y var numbers 4 38 add numbers 423...