1.解構陣列
2.拆解字元到單一變數上
3.解構物件
4.解構陣列並賦予預設值
5.解構物件並賦予預設值
6.縮寫(物件合併)
7.縮寫物件內的關鍵字 function
1.解構陣列
let characters = ['A', 'B', 'C', 'D', 'E'];
// 使用 陣列解構 的方式將陣列內的元素
// "深層複製"到前面列舉變數內
// 中間如果有需要跳過的變數,可用兩個逗號隔開
let [_first, _second, _third, , _five] = characters;
console.log(_first, _second, _third, _five);
//改變原陣列內的元素,不影響變數內的值
characters[0] = 'A1';
console.log(_first, _second, _third, _five);
2.拆解字元到單一變數上
// 請拆解以下字元到單一變數上
let str = '基紐特攻隊';
let [a, b, c, d, e] = str;
console.log(a, b, c, d, e);
3.解構物件
// 請取出物件內的兩個值到單一變數上
let family = {
ming: '小明',
jay: '杰倫',
};
// 將family這個物件內的屬性ming鏡射到新的變數ming
let {
ming,
jay
} = family;
console.log(ming, jay);
// 將family這個物件內的屬性ming鏡射到新的變數ming,
// 再重新命名為NewMing
let {
ming: NewMing,
jay: NewJay
} = family;
// 這時候變數ming已經不能用!
// 已經被賦予到NewMing裡面了
console.log(NewMing, NewJay);
4.解構陣列並賦予預設值
// 變數ming的預設值是小明
// 變數jay的預設值是杰倫
let [ming = '小明', jay = '杰倫'] = ['阿明']
// 第一個會被右邊的阿明賦值,
// 第二個會用預設
console.log('ming:', ming, ' jay:', jay);
//Result:ming: 阿明 jay: 杰倫
5.解構物件並賦予預設值
let {
family: ming = '小明'
} = {}
console.log('ming:', ming);
// Result:ming: 小明
6.ES6 縮寫用在 物件合併的時候
// 請將以下兩個合併至一個物件上
const Frieza = '弗利沙'
const GinyuTeam = {
Ginyu: '基紐',
Jeice: '吉斯',
burter: '巴特'
}
// 沒有縮寫
const NewObject = {
Frieza: Frieza,
GinyuTeam: GinyuTeam
};
// 縮寫:如果名稱一樣,可以直接縮寫
const NewObject2 = {
Frieza,
GinyuTeam
}
console.log('NewObject:', NewObject);
console.log('NewObject2:', NewObject2);
7.縮寫物件內的關鍵字 function
const newTeam = {
// ES6 可以縮寫 不用寫function
showPosture() {
console.log('Message')
}
}
newTeam.showPosture();