ES6中的（ ）運算子詳細學習

es6中引入了乙個擴充套件運算子（…）三個點，初期的理解僅當作了es6引數增強中的剩餘引數去使用，其實這個運算子還可以用在打散陣列，合併陣列等操作。

所有的運算子都是為了簡化操作，所以本文將對比著學習這個運算子。

1.首先減少了arguments（偽陣列）的使用，但使用剩餘引數我們可以得到乙個陣列，從而方便後續操作。

function

fun(a,
...arr)
fun(1,
2,3)

// es5 的寫法 

function
fun(x, y, z)
var args =[0
,1,2
];fun.
(null
, args)
;// es6 的寫法 
function
fun(x, y, z)
var args =[0
,1,2
];fun(
...args)
;

//es5寫法，使用concat

let arr1 =[1
,2];
let arr2 =[5
,6];
let newarr =[20
];newarr = newarr.
concat
(arr1)
.concat
(arr2)
;//es6寫法
let arr1 =[1
,2];
let arr2 =[5
,6];
let newarr =[20
];newarr =[20
,...arr1,
...arr2]
;

let arr1 =[0

,1,2
];let arr2 =[3
,4,5
];//es5寫法
array.prototype.push.
(arr1, arr2)
;//es6寫法
let arr1 =[0
,1,2
];let arr2 =[3
,4,5
]; 
arr1.
push
(...arr2)
;

//es5寫法需要split和join的操作

//...
//es6寫法
[...
'hello'
]// [ "h", "e", "l", "l", "o" ]

let obj =

;let newobj =
console.
log(newobj)
//和obj一樣

let=;

console.
log(x)
;// 1
console.
log(y)
;// 2
console.
log(z)
;//

<
/div>
<
/div>
<
/div>
let box = document.
queryselectorall
("div");
let arr =
[...box]
//這樣就可以使用陣列家的api啦！
<
/script>

6.新補充：可以對陣列進行淺轉殖

let arr  =[1

,2,[
1,2]
,3];
let arr2 =
[...arr]
;arr2.
push(1
);console.
log(arr)
;//[1,2,[1,2],3]
console.
log(arr2)
;//[1,2,[1,2],3,1]

es6中的擴充套件運算子

物件中的擴充套件運算子 用於取出引數物件中的所有可遍歷屬性，拷貝到當前物件之中 1.在函式的傳引數過程,將剩餘的引數放入乙個陣列中。rest引數形式為 變數名 值為乙個陣列，用於獲取函式多餘引數。function f a,arr f 1,2,3,4,4 2,3,4,5 複製 rest引數只能放在最後...

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...