參數預設值、次方、解構賦值

※參數預設值

window.onload = () => {
    let num = 2;
    multiply1(num);
    multiply2(num);
    multiply3(num);
}
    
function multiply1(a, b) {
    b = (typeof b !== 'undefined') ?  b : 1;
    alert(a * b);
}
    
function multiply2(a, b = 1) {
    alert(a * b);
}
    
function multiply3(a, b = xxx()) {
    alert(a * b);
}
    
let xxx = () => {
    return 1;
}

※原本是像 multiply1 的寫法，可以在參數上做手腳，就變成了 multiply2 的寫法

※multiply3 是呼叫 method 後得到回傳值，最後也是和 multiply2 一樣
如果想用匿名的方式寫在等於後面，要在最後加上「()」

※如果給 undefined 是 OK 的，但給 null，數字相當於給 0，字串相當於給 null 字串

※次方

console.log(2 ** 3 ** 2); // 512，寫法不好，易造成誤解，用下面的
console.log(2 ** (3 ** 2)); // 512
console.log((2 ** 3) ** 2); // 64
    
// console.log(-2 ** 3); // 負數會報錯，用下面的
console.log(-(2 ** 3)); // -8

※

※解構賦值

※[]

window.onload = () => {
    // 字串
    data = "123";
    let [a, b] = data;
    console.log(a, b); // 1 2
    
    let {length: len} = data;
    console.log(len); // 3
    
    // 陣列，多餘的元素用不到
    let [a,b] = [1,2,3,4];
    console.log(a); // 1
    console.log(b); // 2
    
    // 巢狀
    let x = [1, ["a", "b", "c"], 3, 4];
    let [c, d] = x
    console.log(d); // "a", "b", "c"
    
    let [, [,,f]] = x
    console.log(f); // c
    
    // 呼叫 function
    let [a1, , b1] = fx();
    console.log(a1); // 1
    console.log(b1); // 3
    
    function fx(){
        return [1,2,3,4];
    }
    
    // 剩下的為剩餘參數
    let [c,d,...rest] = [1, 2, 3, 4, 5];
    console.log(c); // 1
    console.log(d); // 2
    console.log(rest); // [3, 4, 5]
    
    // 預設值
    let [e=5, f=7] = [1];
    console.log(e); // 1
    console.log(f); // 7
    
    // 變數內容交換
    let g = 1;
    let h = 3;
    [g, h] = [h, g];
    console.log(g); // 3
    console.log(h); // 1
}

※

※{}

// 一般
let {p, q} = {p: 42, q: true};
console.log(p); // 42
console.log(q); // true 
// p 和 q 必需和 json 裡的 key 一樣
// 因為是使用名稱區分，所以位置調換不會影響結果
// 不能使用如 {,,p}
    
// 取代變數名稱
let {xxx: x, ooo: o} = {xxx:24, ooo:false};
// console.log(xxx); // 報錯，不可再使用原來的 xxx 變數
// console.log(ooo); // 報錯，不可再使用原來的 ooo 變數
console.log(x); // 24
console.log(o); // false
// 由於 xxx 和 ooo 有可能全域就定義過這個變數名稱了，這時會報錯，所以才有這個功能
    
// 巢狀 JSON
let {aaa, bbb: {k2: b}} = {bbb: {k2: 2}, aaa: {k1: 1}};
console.log(aaa); // {k1:1}
console.log(aaa.k1); // 1
console.log(b); // 2
    
// JSON 裡有陣列
let src = {data: {ccc: [1, 2, 3]}};
let {data: {ccc: [, , c]}} = src
console.log(c); // 3
    
// function
function fx({data: {ccc: [, , c]}}) {
    console.log(c); // 3
}
fx(src);
    
// 預設值
let {a = 10, b = 5} = {a: 3};
console.log(a); // 3
console.log(b); // 5
    
// 迴圈
let data = [
    {
        xxx: "x",
        ooo: {
            a: 1,
            b: 2
        },
        zzz:'z'
    },
    {
        xxx: "xx",
        ooo: {
            a: 3,
            b: 4
        },
        zzz:'zz'
    }
];
    
for (let {xxx: s, zzz: d, ooo: {a:n} } of data) {
    console.log('xxx=' + s + ', d=' + d + ", ooo.a=" + n);
}
// xxx=x, d=z, ooo.a=1
// xxx=xx, d=zz, ooo.a=3

※

※()

window.onload = () => {
    ({a, b} = {a:1, b:2}); // 最前面不能加 let var const，{}開頭是一定要有 let var const 的
    console.log(a); // 1
    console.log(b); // 2
    
    ({a, b} = {c:1, d:2});
    console.log(a); // undefined
    console.log(b); // undefined
    // console.log(c); // 報錯
    // console.log(d); // 報錯
    
    ({a, b, ...rest} = {a:1, b:2, c:3, d:4});
    console.log(a, b, rest); // 1 2 {c:3, d:4}
}

※