首先點明,
es6的新特性之擴充套件運算子(spread)就是三個點(...),和es6的可變引數形式一樣。
擴充套件運算子是很強大的乙個運算子,它能簡化很多在es5中會比較繁雜的操作。
對於這個運算子,概念性的東西不多,所以這裡我就簡明扼要的給出一些它的常用場景:
1:可變引數。
(雖然可變引數嚴格說不是擴充套件運算子(spread),而是剩餘運算子(rest),但是鑑於它也是三個點:...,我就寫在了一起以便記憶)
//例一:
function add(...values)
return sum;
}add(2, 5, 3) // 10
//例二:
// arguments變數的寫法
function sortnumbers()
// rest引數的寫法
const sortnumbers = function(...numbers)
arguments物件不是陣列,而是乙個類似陣列的物件。
所以為了使用陣列的方法,必須使用array.prototype.slice.call先將其轉為陣列。
rest 引數就不存在這個問題,它就是乙個真正的陣列,陣列特有的方法都可以使用。
//既然說到了可變引數,就再舉個例子吧:
//例三:
function push(array, ...items) );
}var a = ;
push(a, 1, 2, 3)
//注意,可變引數只能出現在最後乙個引數位置
2.展開陣列:
3.複製陣列://例一:
// es5 的寫法
function f(x, y, z)
var args = [0, 1, 2];
// es6的寫法
function f(x, y, z)
let args = [0, 1, 2];
f(...args);
//例二:
// es5 的寫法
// es6 的寫法
math.max(...[14, 3, 77])
// 等同於
math.max(14, 3, 77);
陣列是復合的資料型別,直接複製的話,只是複製了指向底層資料結構的指標,而不是轉殖乙個全新的陣列。
const a1 = [1, 2];
const a2 = a1;
a2[0] = 2;
a1 // [2, 2]
//es5只能用變通的方法來複製陣列
const a1 = [1,2];
const a2 = a1.concat();
//擴充套件運算子提供了複製陣列的簡便方法
//其實也用到了其展開陣列的功能。
const a1 = [1,2];
//法一:
const a2 = [...a1];
const [...a2] =a1;
4.合併陣列: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' ]
5.與解構賦值結合:
擴充套件運算子可以與解構賦值結合起來,用於生成陣列。
const [first, ...rest] = [1, 2, 3, 4, 5];
first // 1
rest // [2, 3, 4, 5]
const [first, ...rest] = ;
first // undefined
rest //
const [first, ...rest] = ["foo"];
first // "foo"
rest //
/*如果將擴充套件運算子用於陣列賦值,只能放在引數的最後一位,否則會報錯。
*/
6.將字串轉化為真正的陣列:
其實,任何實現了iterator介面的物件都可用擴充套件運算子轉化為真正的陣列。
比如:arguments物件。
//例:
[...'hello']
// [ "h", "e", "l", "l", "o" ]
擴充套件運算子
三個點,主要是用來將陣列幻化為用逗號分隔的引數序列。合併陣列 與解構賦值結合 如果將擴充套件運算子用於陣列賦值,只能放在引數的最後一位,否則會報錯。將字串轉為真正的陣列 可以將類似陣列的物件轉為真正的陣列 map和set結構,generator函式 擴充套件運算子內部呼叫的是資料解構的iterato...
擴充套件運算子
使用擴充套件運算子 拷貝陣列。const a,b 1,2,3 a 1 b 2,3 bad const len items.length const itemscopy let i for i 0 i len i good const itemscopy items 1 結構賦值 物件的解構賦值用於從...
擴充套件運算子
擴充套件運算子可以用在函式引數,陣列和物件上 函式裡面成為rest引數 function add values return sum add 2,5,3 10這樣就不需要用arguments引數了。a 1,2,3,4,5 5 1,2,3,4,5 function aaa a undefined aa...