js高阶——解构赋值

 数组按照索引赋值

对象按照属性名称赋值。

const{a:x,b:y,c:z} = {a:1,b:2,c:3}
//先找到对应的属性名称，再把属性值赋给属性名称。

解构赋值左边和扩展运算符可以一起使用，附加扩展运算符的变量，必须是最后一个。

如果变量前加上了扩展运算符，那么得到的值一定是数组，即使没有对应关系， 也会得到空数组。

const [a,b,...c] = [1,2,3,4,5]// c[3,4,5]
const [a, , , , e] = [1,2,3,4,5]// a[1] e[5]
const [a,b,c] = [1,2,3,4,5]// c[3]
const [a,b,c] = [1,2] //c = undefined

const[{name:a},b] = [
  {name:'张三',age:18}
  {name:'李四',age:20}
 ];//   张三 ，{name:'李四',age:20}

const{a,b} = {a:1,b:2};
const{a:a,b:b} = {a:1,b:2}
const{a:aa,b:bb} = {a:1,b:2}//实际上是给冒号后边的属性生成的值

const{c,f,...n } = {a:1,b:2,c:3,d:4,e:5}
//对象本来就没有顺序

        与数组的解构赋值类似，没有匹配到的变量不会赋值，默认值为未定义，也可以使用扩展运算符，结果是对象。

        ...在对象的解构赋值里，表示除了，对象的属性不区分位置（索引）。

const{a,..c} = {a:1} //a:1  c{}

let obj = {
  p:[
     'Hello',
     {y:'World'}
    ]
 }
        
let{p,p:[x,{y}]} = obj//p:[],x:Hello,y:World

JSON.stringify  对象加数组

       window.JSON.stringify()//将一个json类型的数据转换成字符串

        JSON.parse();//用于将字符串转化为js可以使用的对象+数组的形式

js的字符串本质上讲是对象，但同时带有遍历器接口，因此，js的字符串类型既可以使用数组的解构赋值，也可以使用对象的解构赋值。

const[a,b,c,d,e] = '12345'; //数组的解构赋值给了字符串索引值。

console.log(a)//1

const[a,...b] = '12345';
console.log(a,b)//1,'2345'

const date = [1,2,3];
const[a,b,c] = arr// a1,b2,c3
const{0:a,1:b,2:c,length:d} = [1,2,3]
console.log(a,b,c,d)//1,2,3,3

const{0:a,1:b,2:c,length:d} = [a,b,c,d]
console.log(a,b,c,d)//报错

const { 0: a, 1: b, 2: c, length: d } = ['a', 'b', 'c', 'd']
console.log(a, b, c, d);//a,b,c,4

const { 0: a, 1: b, 2: c, 3: d } = '123'
console.log(a, b, c, d);

const { 0: a, 1: b, 2: c, 3: d } = 'abcd'
console.log(a, b, c, d);//abcd

let x = 1;
let y = 2;
[x,y] = [y,x]


let arr = [5, 4, 2, 6, 7, 3];

for (let i = arr.length - 2; i >= 0; i--) {
   for (let j = 0; j <= i; j++) {
     if (arr[j] > arr[j + 1]) {
       [arr[j], arr[j + 1]] = [arr[j + 1], arr[j]];
          console.log(arr);
        }
    }
 }

在es6中，函数的参数可以设置默认值：

aa(1, false);
    function aa(a, b = 123) {
      console.log(a, b)
    }

如果有对应的值，则默认值失效，

如果没有传入对应的值，或传入值为undefined，则使用默认值。

函数被调用时的参数获取，也是赋值的过程，一样可以使用解构赋值的规则。