• 按照一定的模式,从数组和对象中提取值,对变量进行赋值。
    • 数组解构
    • 对象解构
    • 字符串解构
    • 应用

    数组的解构赋值:

    1. let [a, b, c] = [1, 2, 3, 4]
    2. console.log(a, b, c) // 1 2 3
    3. let [a, b] = [1, 2, 3, 4]
    4. console.log(a, b) // 1 2
    5. let [a, b, c=1] = [1, 2]
    6. console.log(a, b, c) // 1 2 1
    7. let [a, b, c] = [1, 2, [3, 4]]
    8. console.log(a, b, c) // 1 2 [ 3, 4 ]
    9. let [a, b, c] = [1, 2]
    10. console.log(a, b, c) // 1 2 undefined
    11. let [a, b, [c]] = [1, 2, [3, 4]]
    12. console.log(a, b, c) // 1 2 3

    对象的解构赋值:

    1. let a = {
    2. name: 'zza',
    3. age: 20
    4. }
    5. let {name, age} = a; // zza 20
    6. // 其别名
    7. let {name: uname, age: uage} = a // zza 20
    8. // 解构复制也是根据key的值进行一一对应的,所以{}中接受的key的顺序不会影响最后的结果

    字符串的解构赋值:

    1. // 字符串的解构赋值
    2. let lover = 'cjj521'
    3. let [a, b, c, d, e, f] = lover
    4. console.log(a, b, c, d, e, f) // c j j 5 2 1

    解构赋值相对于默认值的应用:

    1. // 解构赋值对于默认值的应用:
    2. let {name, age=18} = {
    3. name: 'zza',
    4. // age: 12
    5. }
    6. console.log(name, age)

    证明解构复制是惰性赋值:有参数对应就赋值,没有的话就取指定的默认值

    1. // 证明解构赋值是惰性赋值
    2. function foo() {
    3. console.log(123)
    4. }
    5. let [a = foo()] = [1] // 这里的foo()不会执行
    6. let [b = foo()] = [] // 这里的foo() 会执行,找不到对应的赋值,就赋默认值,默认值是函数,就直接执行函数了

    函数参数的解构赋值:

    1. // 函数参数数组的解构赋值
    2. function foo([a, b, c]) {
    3. console.log(a, b, c)
    4. }
    5. foo([1, 2, 3])

    函数参数为对象的解构复制:

    1. // 函数参数对象的解构赋值
    2. function foo({name, age}) {
    3. console.log(name, age)
    4. }
    5. foo({name: zza, age: 12})

    函数返回值的解构赋值:

    1. // 函数返回值的解构赋值
    2. function foo() {
    3. let obj = {
    4. name: 'zza',
    5. age: 12
    6. }
    7. return obj
    8. }
    9. let {name, age} = foo()
    10. console.log(name, age)

    提取json数据的解构复制:

    1. // 提取json数据的解构赋值
    2. let json = '{"a": "hello", "b": "world"}'
    3. let {a, b} = JSON.parse(json) // 使用方法 JSON.parse(str)将字符串解析为json
    4. console.log(a, b)