es6-解构赋值

什么是解构赋值

就是左边一种结构，右边一种结构，一一对应赋值

结构有 数组，布尔值，对象，字符串，数值，函数参数解构赋值，常用的是数组，对象这两种。

数组

let a,b,rest;

[a,b,...rest]=[1,2,3,4,5,6,7];

console.log(a,b,rest);

对象

let a,b;

({a,b}={a:1,b:2})

console.log(a,b);

默认值

let a,b,c,rest;

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

console.log(a,b,c);

输出为1,2,3

let a,b,c,rest;

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

console.log(a,b,c);

输出为1,2，undefind

通过解构赋值可以轻松的实现值的交换

let a=1;

let b=2;

[a,b]=[b,a];

console.log(a,b);

输出为2,1

如果没有es6，我们将用变量来中间值

函 数

let a,b;

function f()

{ return [2,3];     }

[a,b]=f();

console.log(a,b);

输出值为2,3

若我们没有使用es6，我们将用一个值来接收函数的返回值，然后索引一个个取出值，比较麻烦。

let a,b,c;

function f()

{ return [1,2,3,4,5];     }

[a,,,b]=f();

console.log(a,b);

输出值为1,4

这样的写法让自己想取哪个值就取哪个值

let a,b,c;

function f()

{ return [1,2,3,4,5];     }

[a,...b]=f();

console.log(a,b);

输出是1 , [2, 3, 4, 5]

a是一个值，b是一个数组，当我们不知道返回的数组有多长时，我们就可以用一个数组来储存，想用时就遍历它。

let o={p:42,q:true};

let {p,q}=o;

console.log(p,q);

输出的是42,true

但我不知道为什么只能定义的新变量要是p,q，和对象o里的一样

let {p=2,q=2}={p:30};

console.log(p,q);

输出结果为30,2

let {p=2,q=2}={q:30};

console.log(p,q);

输出为2,30

名称要对应起来

let met={let met={ title:'wwww',

test:[{title:'wesd',

des:'description' }] }
let {title:s,test:[{title:b}]}=met;

console.log(s,b);

输出为wwww wesd

对象一一对应取值，这是特别常用的一种方法前端获取后端传过来的json时，可以这样获得值。