解构和赋值

时间:2021-6-4 作者:qvyue

1.交换变量的值

    var y = 2;
    [x,y] = [y,x];//成功交换x,y的值。

2.提取函数返回的多个值(实现快速的提取对应的值)

function demo(){
        return {"name":"张三","age":21}
    }
    var {name,age} = demo();
    console.log(name);//结果:张三
    console.log(age);//结果:21

3.定义函数参数(方便提取jsON对象中想要的参数)

 function demo({a,b,c}){
        console.log("姓名:"+ a);
        console.log("身高:"+ b);
        console.log("体重:"+ c);
    }```
    demo({a:"张三",b:"1.72m",c:"50kg",d:"8000"});

4.函数参数的默认值

 function demo({name="张三"}){
        console.log("姓名:"+name);//结果:姓名:张三
    }
    demo({});

1.数组的解构赋值

var [a,b,c] = [1,2,3]; //把数组的值分别赋给下面的变量;
console.log(a);//a的值为1
console.log(b);//b的值为2
console.log(c);//c的值为3

1).结构赋值可以嵌套的

var [ a,b,[ c1,c2 ] ] = [ 1,2,[ 3.1,3.2 ] ];
console.log(c1);//结果:c1的值为3.1
console.log(c2);//结果:c2的值为3.2

2).不完全解构

var [a,b,c] = [1,2];
console.log(a);//结果:a的值为1
console.log(b);//结果:b的值为2

3).赋值不成功,变量的值为undefined

var [a,b,c] = [1,2];
console.log(a);//结果:a的值为1
console.log(b);//结果:b的值为2
console.log(c);//结果:c的值为undefined

4).允许设定默认值

var [a,b,c=3] = [1,2];
console.log(a);//结果:a的值为1
console.log(b);//结果:b的值为2
console.log(c);//结果:c的值为3

5).覆盖默认值3

var [a,b,c=3] =[1,2,4];
console.log(a);//结果:a的值为1
console.log(b);//结果:b的值为2
console.log(c);//结果:c的值为4

注意:当新的值为undefined的时候,是不会覆盖默认值的。

2.对象的解构赋值

 var { a,b,c } = {"a":1,"c":3,"b":2};
console.log(a);//结果:a的值为1
console.log(b);//结果:b的值为2
console.log(c);//结果:c的值为3

var { a } = {"b":2};
console.log(a);//结果:a的值为undefined

var { b:a,} = {"b":2};
console.log(a);//结果:a的值为2

1)对象解构赋值也可以嵌套

var {a:{b}} = {"a":{"b":1}};
console.log(b);//结果:b的值为1

2)可以指定默认值

var {a,b=2} = {"a":1};
console.log(b);//结果:b的值为默认值2

3.字符串的解构赋值

var [a,b,c,d,e,f] = "123456";
console.log(a);//1
console.log(b);//2
console.log(c);//3
console.log(d);//4
console.log(e);//5
console.log(f);//6
声明:本文内容由互联网用户自发贡献自行上传,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任。如果您发现有涉嫌版权的内容,欢迎发送邮件至:qvyue@qq.com 进行举报,并提供相关证据,工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。