ES6_解构

2020-2-10 👇

时隔一年再来更新

em..个人理解其实就是：

数组 :

         var ['0':first,'2':second]=[5,6]

         所以实际操作的时候就是 var [first,second]=[5,6]

         当然像我写的第一行是错的，只是这么理解，所以数组的结构需要位置对上

         实际数组是特殊的对象，可以像对象那样成花括号{0：first,1:second}=[5,6]

对象：

        同理上面的理解

        var {first:first,second:second}={second:2,first:1}    ps:这么写倒是对的

        直接写成 var {first ,second}={second:2,first:1}

 

em...意思就你得让两个东西匹配上，就得找个相同得特征把。然后赋值给变量把.(var后面跟的，first:fist。第一个first是特征（模式），第二个是你声明的要被赋值的变量)

 

      {first:diyi=1}={first:100}

     意思：通过first，给变量diyi赋值100。但是当first===undefined的时候，diyi被赋上默认值1

 

 

下面的罗里吧嗦

 

 

2019-2-12 👇👇👇

啥是解构

ES5中，赋值的形式：var aaa='ss'; 类似酱紫的。

ES6中，赋值的形式可以通过数组或者是对象：

 

数组：
    [a,b,c,d]=['a','f','s','s']
    如上，可加var 或者 let
    假定在全局作用域中写上 ↑ 的，则相当于：
    var a='a' ; var b='b'  之类的
对象：
    {
        keyA:a,
        keyB:b,
        keyC:c
    }={
        keyA:'a'
        ,keyB:'v'
        ,keyC:'s'
    }
    如上，可加var或者let，
    假定全局中写 ↑ ，相当于：
    var a='a' ; var b='v'  之类的。

假定对应不上，比方说：
    [a,b]=['ss'],那么b的值是undefined。
    设定的变量名可以有默认值。
    [a='ss',bb]=[,['ss,'as']] 什么的
    得到var a='ss',bb=['ss','as']什么的。
对象同理。

---

数组：

        数组见上，反正顺序对上了就是它了。

        对不上的话：

               变量一侧多的话，没对应值的话，这个值的是默认值，或者是undefinded。反之，多余值被无视

        有一种写法：

                [a,b,...c]=['a','s','sd','sds','sdsd','dsdsa']

                相当于：var a='a'; var b='s' ； var c=['sd','sds','sdsd','dsdsa'];

 

对象：

        一种匹配的模式。

例子：
    {
        keyA:varA
        ,keyB:varB
        ,keyC:varC
    }={
        keyA:'valueA'
        ,KeyB:'valueB'
        ,keyC:'valueC'
    }
得出：var varA='valueA' ; 
      var varB='valueB' ; 
      var varC='valueC' ; 

使用的是匹配模式，keyA，之类的是配对标志，左边对象中，配对标志的值才是变量名。

    {keyA,keyB}={keyA:'aa',keyB:'ss'}

    这种写法相当于：{keyA:keyA,keyB:keyB}={keyA:'aa',keyB:'ss'}

    得出：var keyA='aa' ; var keyB='ss' ;

默认值：
    
    ({keyA='ss'}={keyA:'s'})

    注意，{}代表一个块，直接在全局写会报错。所以加一个小括号
    {x}  酱紫都报错啦，想象下方法中直接写{x}，也会报错。
    
    
    

---

在函数（参数）中的使用：

function add（[x,y]）{ } 传值 add( [1,3 ]) 相当于是解构 [x,y]=[1,2] 找对应值

function test (a,b){ //... }

像酱紫的函数，相当于在其方法体内声明了两个变量

所以也可以用解构式的。

可以设定默认值。

[['a','b'],['c','f']].map(function(v,i){})  

可以写成  [['a','b'],['c','f']].map(function([v1,v2],i){
                
                                       return v1+v2;
    
                                })

然后就可以在方法体内用了

解构式的两边都是对象。形参相当于定义，赋值相当于等号右边。

所以。

。。

设置默认值：

function test({keyA:url,keyB:id='#bbb',keyC:cyou='morenCyou',cc}={keyA:'empty',keyB:'#aaa',cc:'morenC'}){
        console.log(url,id,cyou,cc);
    }
    test();// 输出 empty #aaa morenCyou morenC

    test({keyA:'fff'});// 输出 fff #bbb morenCyou undefined

   A 上述形参中，左边设定的默认值是设定变量的默认值。等号右边设定的默认值是传入参数的默认值

        只要在方法调用的过程中有参数传入，参数的默认值失效。

   B  但是设定变量的默认值的话，传入参数时没有传入指定值，就会用变量的默认值。而不会像A那样整个对象（包裹着默认值）失效