zoukankan      html  css  js  c++  java
  • JS中的解构赋值(ES6)

    解构赋值是对赋值运算符的扩展。解构赋值主要分为数组的解构和对象的解构。

    1、数组解构 按照顺序解构,赋值给前面对应下标的变量

    var [a,b,c]=[1,2,3];
    console.log(a,b,c);//1,2,3
    • 交换,交换让数组中两个数据交换数值变得非常方便,比如冒泡排序中的数据交换
            var a=3;
            var b=4;
            [a,b]=[b,a];  
    //冒泡

          [arr[i],[arr[i+1]]]=[arr[i+1],arr[i]];

    • 函数中解构赋值时,变量设置了初始值0,如果给一个赋值,b就是3,如果没有给赋值,b就是初始值0
            var [a,b=0]=[3];
            console.log(a,b);
            function fn([a,b=0]){
                console.log(a,b);
            }
            fn([4,3]);   

    2、对象解构赋值时按照属性名解构,与顺序无关,没有该属性是无法解构赋值的

            var {a,b,c}={b:1,a:2};
            console.log(a,b);    
    • 对象解构必须按照结构解构,如果解构时属性名有重复,可以在属性名后:新名称来解构,后面有:就查不到了
            var {a,b:{a:a1}}={a:5,b:{a:6}};
            console.log(a,a1);    
            let {p:[x,{y}]}={p:["Hello",{y:"World"}],};
            console.log(x,y);
            var obj={
                a:1,
                b:{
                    a:2,
                    b:{
                        a:3,
                        b:{
                            a:4
                        }
                    }
                }
            }
            let {a,b:{a:a1,b:{a:a2,b:{a:a3}}}}=obj;
            console.log(a,a1,a2,a3);

    3、字符串解构,str有length属性

            var str="abcdef";
            let {length}=str;
            console.log(length);

    4、在对象中如果方法中有this这种方法不能被解构(3的方法)

  • 相关阅读:
    JS数组去重
    正则表达式验证邮箱手机号等
    js中的事件委托
    c++刷题(6/100)最长上升子序列
    c++刷题(3/100)数独,栈和队列
    在express中HMR(合并express和webpack-dev-server)
    面试整理(3)js事件委托
    面试整理(2)跨域:jsonp与CORS
    面试整理(1):原生ajax
    styled-components真的好吗?
  • 原文地址:https://www.cnblogs.com/shewill/p/12688206.html
Copyright © 2011-2022 走看看