zoukankan      html  css  js  c++  java
  • 变量的解构赋值

    ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构

    es5是这样的

    var a = 1;

    var b = 2;

    var c = 3;

    es6是可以这样写的

    var [a,b,c] = [1,2,3];

    a = 1;

    b = 2;

    c =3;

    可以看出数组可以根据他们对应的位置解构

    这种写法叫匹配模式,不对 ,模式匹配。等号俩边的模式相等,就可以进行解构

    还比如

    从上面我们可以看出  如果模式不相同,他也是可以解构出来的。

    如果解构失败的话,他的值就是undefined 

    默认值

    解构赋值是允许有默认值得,

    这一点和es6中的函数传值很相识,是可以设置默认值的。

    let [a = true] = [];

    a = true;

    上面的内容,a 默认赋值为true   后面的值为空  ,一样可以获得 a = true  

     这个 当我们设置了默认值的时候,但是解构赋值的时候为null   默认值就不会生效  因为null不严格等于undefined

    对象解构赋值

    对象的解构赋值和变量的有所不同,变量的解构赋值,看的是位置相同,而对象的是看属性名

    let {foo , name} = {foo:25,name:lly}   //foo  = 25 name = lly

    就是解构失败的情况下,值为undefined

    对象解构和数组解构都可以嵌套解构。

     对象解构赋值一样也可以设置默认值

     注意点

    (1)如果要将一个已经声明的变量用于解构赋值,必须非常小心。

    // 错误的写法
    let x;
    {x} = {x: 1};
    // SyntaxError: syntax error
    

    上面代码的写法会报错,因为 JavaScript 引擎会将{x}理解成一个代码块,从而发生语法错误。只有不将大括号写在行首,避免 JavaScript 将其解释为代码块,才能解决这个问题。

    // 正确的写法
    let x;
    ({x} = {x: 1});
    

    上面代码将整个解构赋值语句,放在一个圆括号里面,就可以正确执行。关于圆括号与解构赋值的关系,参见下文。

    字符串的解构

    const [a,b,c,d] = '1234'  //a = 1 ,b =2 ,c = 3 d =  4
     
    函数的解构
     
    function  Fun([a,b]){
      return a+b
    }
    Fun([1,2])
     
    解构赋值的用途、
    (1)交换变量的值

     简便,快捷

    2)从函数返回多个值

    (3)函数参数的定义

    (4)提取 JSON 数据

     

    原文地址  https://es6.ruanyifeng.com/#docs/destructuring

     
  • 相关阅读:
    数据结构与算法
    android vitamio的坑
    Fragment的坑
    scrollview里面嵌套listview的坑
    关于微信小程序的tabbar
    Intent初级学习
    HDU 4562 守护雅典娜
    SGU 542 Gena vs Petya
    [二] EditText and Button
    A Data Structure for Dynamic Trees
  • 原文地址:https://www.cnblogs.com/chenyudi/p/12443759.html
Copyright © 2011-2022 走看看