解構

es6允許按照一定模式，從陣列和物件中提取值，對變數進行賦值，這被稱之為解構

//物件的解構

const stu={
    name:'shawn',
    age:'20',
    gender:'男'
}
const {name,age,gender}=stu
console.log(name,age,gender)  //shawn 20 男

//物件作為函式引數解構

const stu={
    name:'shawn',
    age:'20',
    gender:'男'
}
function stuInfo({name,age,gender}){
    return `${name}的年齡是${age}，性別是${gender}`;
  }
console.log(stuInfo(stu));  //shawn的年齡是20，性別是男
 

//陣列的解構

const names = ["Henry","Bucky","Emily"];
 const [name1,name2,name3] = names;
 console.log(name1,name2,name3);//Henry Bucky Emily

//返回陣列個數

const {length} = names;
console.log(length);   //3

擴充套件運算子...

作用是把陣列或類陣列物件展開成一系列用逗號隔開的值

const arr1 = [1,2,3]
const arr2 = [4,5,6]
const arr3=[...arr1,...arr2]
console.log(arr3)   //[1, 2, 3, 4, 5, 6]
 

應用場景

//陣列深拷貝

const arr2 = arr1;
const arr3 = [...arr1];
console.log(arr1===arr2); //true, 說明arr和arr2指向同一個陣列
console.log(arr1===arr3); //false, 說明arr3和arr指向不同陣列

//把一個數組插入另一個數組字面量

const arr = [1,2,3]
const arr1 = [...arr, 4, 5, 6];
console.log(arr1);//[1, 2, 3, 4, 5, 6]

//字串轉陣列

var str = 'love';
var arr = [...str];
console.log(arr);//[ 'l', 'o', 'v', 'e' ]
 

rest引數...

作用與擴充套件運算子恰好相反，把逗號隔開的值序列組合成一個數組

//主要用於不定引數，所以ES6開始可以不再使用arguments物件

bar = function(one, ...unknow) {
    console.log(one);
    console.log(unknow);
}

bar(1, 2, 3, 4,5);
//1
//[ 2, 3, 4 ,5]