Es6解构赋值

89 阅读1分钟

解构赋值

数组解构

两边有相同结构,一一对应赋值,解构不成功自动赋值undefined,如[a,b] = [1,2],若左边数组多个变量c,c解构不成功被赋值undefined

参数默认值

  • [a= 10,b =5] = [2,3],若右侧不传值,会使用默认值,传值会把默认值覆盖

  • 右侧的值只有严格等于(===)undefined(直接写undefined或不写),左侧才会使用默认值,'undefined'和null都会覆盖默认值

  • 若默认值是一个表达式,那只有在用到默认值时才会执行表达式(惰性求值)

  • 默认值可以引用解构赋值的其他变量,但该变量必须是一件声明的变量

  • 常用于函数的形参

对象解构

特点

  • 两边结构相同

  • 对象属性无序

  • 变量名必须等于属性名

    • 如解构失败,变量名赋值undefined

      let { foo, bar } = { foo: 'aaa', bar: 'bbb' };  
          // foo = 'aaa'  
          // bar = 'bbb'  
      
      let { baz : foo } = { baz : 'ddd' };  
          // foo = 'ddd'  
      
      let person = { name: 'zhangsan', age: 20, sex: '男'};  
      let {name, age, sex} = person;  
          // name = 'zhangsan'  
          // age = 20  
          // sex = '男'
      

默认值

  • 和数组解构相同,默认值生效的条件时对象的属性值严格等于undefined

应用

交换变量值,如 [a,b] = [b,a]

从数组或变量中取值

函数参数传值及设置默认值

提取json数据