ES6函數中參數的默認值

　　●給函數的形參設置一個默認值, 當你沒有傳遞實參的時候, 使用默認值

　　●直接使用 賦值符號(=) 給形參賦值即可　

   function fn(a, b = 100) {
      console.log(a, b)
    }

    fn()
    fn(10)
    fn(10, 20)

　　ES6的函數默認值

　　●在ES5之前是沒有函數默認值的。函數的默認值是ES6的新語法

　　●函數的默認值是給函數的形參設置一個默認值, 當你沒有傳遞實參的時候來使用

　　●書寫: 直接在書寫形參的時候, 以賦值符號(=) 給形參設置默認值就可以了

　　●任何函數都可以使用

　　●注意: 如果你給箭頭函數設置參數默認值, 那么不管多少個形參, 都得寫小括號

　　●普通函數　

<script>
    // 給形參 a 設置了默認值為 10
    // 給形參 b 設置了默認值為 20
    function fn(a = 10, b = 20) {
        console.log('fn 普通函數內的打印')
        console.log('a : ', a)
        console.log('b : ', b)
    }
    // // 第一次調用
    // // 給 兩個形參 賦值了, 那么就不使用默認值了
    fn(100, 200)
    // // 第二次調用
    // // 沒有給 b 賦值, 那么 b 就會使用 20 這個默認值
    fn(1000)
    // // 第三次調用
    // // a 和 b 都沒有實參進行賦值, 都會使用 默認值
    fn()
</script>

<script>
    //給a設置了默認值，b 沒有設置默認值
    function fn(a = 10, b) {
        console.log('fn 普通函數內的打印')
        console.log('a : ', a)
        console.log('b : ', b)
    }
    //調用函數都不傳遞實參
    fn()
</script>

　　●箭頭函數　

<script>
    // 箭頭函數也可以設置默認值
    // 給形參 a 設置了默認值為 10
    // 給形參 b 設置了默認值為 20
    const fn = (a = 10, b = 20) => {
        console.log('fn 箭頭函數內的打印')
        console.log('a : ', a)
        console.log('b : ', b)
        console.log('---------------------')
    }
    // // 第一次調用
    // // 給 兩個形參 賦值了, 那么就不使用默認值了
    fn(100, 200)
    // // 第二次調用
    // // 沒有給 b 賦值, 那么 b 就會使用 20 這個默認值
    fn(1000)
    // // 第三次調用
    // // a 和 b 都沒有實參進行賦值, 都會使用 默認值
    fn()
</script>

　　●隨機數案例

<script>
    // 范圍內的隨機數
    // 定義函數, 兩個數字分別默認值設置成 0 和 255
    const randomNum = (a = 255, b = 0) => Math.floor(Math.random() * (Math.abs(a - b) + 1)) + Math.min(a, b)
    console.log(randomNum(20, 30))
</script>

　　ES6解構賦值

　　●ES6允許按照一定的模式，從數組或對象中提取值，給變量進行賦值，稱為解構賦值。

　　●解構賦值分為數組解構和對象解構

　　數組解構

　　●快速的從數組拿到數組中的數據

　　●語法：var [變量1,變量2, 變量3，....] = 數組

　　●會按照數組的索引依次把數組中的數據拿出來，賦值給對應的變量　

<script>
    //定義一個數組
    const arr = [100, 200, 300, 400, 500]
        //需求: 單獨定義五個變量獲取五個數據
    const a = arr[0]
    const b = arr[1]
    const c = arr[2]
    const d = arr[3]
    const e = arr[4]
    console.log(a, b, c, d, e); //100 200 300 400 500
</script>

<script>
    // 解構數組
    const arr = [100, 200, 300, 400, 500]
    //需求: 單獨定義五個變量獲取五個數據
    const [a, b, c, d, e] = arr
    console.log(a, b, c, d, e) // 100 200 300 400 500
</script>

　　●解構多維數組

　　●數組怎么寫, 解構怎么寫，把數據換成變量　

<script>
    // 1-2. 解構多維數組
    const arr = [1, 2, [3, 4, [5, 6, [7, 8, [9]]]]]
    console.log(arr)
    //需求: 定義變量拿到數據 9
    const a = arr[2][2][2][2][0]
    console.log(a) //9
    //解構
    const [a, b, [c, d, [e, f, [g, h, [i]]]]] = arr
    console.log(i) //9
</script>

　　對象解構

　　●快速從對象中拿到對象中的數據

　　●語法：var {鍵名1, 鍵名2, 鍵名3, ... } = 對象

　　●按照鍵名, 依次定義變量從對象中獲取指定成員

　　●之前獲取對象里面的值　

<script>
    // 解構對象
    const obj = {
        name: 'Jack',
        age: 18,
        gender: '男'
    }
    const name = obj.name
    const age = obj.age
    const gender = obj.gender
    console.log(name, age, gender) //Jack 18 男
 </script>

　　●解構獲取對象里面的值　

<script>
        // 解構對象
        const obj = {
            name: 'Jack',
            age: 18,
            gender: '男'
        }

        // 解構
        const {
            name,
            age,
            gender
        } = obj
        console.log(name, age, gender) //Jack 18 男
</script>

　　●解構的時候可以給變量起一個別名

　　●語法：var { 鍵名: 別名, 鍵名2: 別名 } = 對象

　　●注意：當你起了別名以后, 原先的鍵名不能在當做變量名使用了, 需要使用這個別名

<script>
    // 解構對象
    const obj = {
        name: 'Jack',
        age: 18,
        gender: '男'
    }
    //  解構的時候起一個別名
    const {
        name: a
    } = obj //等價于 const a = obj.name
    console.log(name, a); //Jake
    //注意name是一個特殊的屬性，對象里面自帶有改屬性所以不會報錯
    const {
        age: b
    } = obj //等價一const b = obj.age
    //console.log(age, b); //Uncaught ReferenceError: age is not 
    console.log(b); //18
</script>

<script>
    // 解構對象
    const obj = {
        name: 'Jack',
        age: 18,
        gender: '男'
    }
    const {
        name: a,
        gender,
        age: b
    } = obj
    console.log(a, b, gender) //Jack 18 男
</script>