ES6解构赋值

解构赋值

ES6允许按照一定模式从数组和对象中提取，对变量进行赋值，这被称为解构赋值
未赋值的会返回undefined

解构赋值的分类

1.数组的解构赋值

如果解构不成功，变量的值就等于undefined。

// 01 完全解构
			// let [a,b,c]=[1,2,3];
			// [a,b,c]=[c,b,a];
			// console.log(a,b,c);
			
			// let [foo,[[bar],baz]]=[1,[[2],3]];
			// console.log(foo,bar,baz);
			
			// let [,,third]=['foo','bar','baz'];
			// console.log(third);
			
			// let [x,y,...z]=[1,2,3];
			// console.log(x,y,z)
			// 02 不完全解构
			// let [o,n]=[1,2,3];
			// console.log(o,n);
			
			// let [a,[b,c],d]=[1,[2,3,5],4];
			// console.log(a,b,c,d);
			// 03 解构不成功
			// let [foo]=1;
			// let [t]=false;
			// console.log(foo);
			// console.log(t)
			
			// 04 关于默认值
			// let [foo="qqq"]=["皮皮虾"];
			// let [foo="qqq"]=[];
			// console.log(foo);
			
			// let [boy="舒克",girl="贝塔"]=["ketty"];
			// console.log(boy,girl);
			
			// let [x,y='b']=['a',undefined];
			// let [x,y='b']=['a',null];
			// console.log(x,y);
			
			function fn(){
				return "aaa";
			}
			let [x=fn()]=[];
			console.log(x)

2.对象的解构赋值

ript>
			// 对象的解构赋值
			let {foo,bar}={foo:"aaa",bar:"bbb"};
			console.log(foo,bar);
			
			// 别名
			let {x:xx}={x:"aaa",baz:"bbb"};
			console.log(xx);
			
			let obj={first:"hello",last:"world"};
			let {first:f,last:l}=obj;
			console.log(f,l);
			
			let obj2={
				p:[
					'hello',
					{s:'world'}
				]
			}
			let {p,p:[r,{s}]}=obj2;
			console.log(p,r,s);
			
			// 默认值生效的条件是，对象的属性值严格等于undefined
			// null可以看成是真正的值
			let {xxx=3}={xxx:undefined};
			console.log(xxx);
			let {yy=3}={yy:null};
			console.log(yy);
			
			// 如果在解构前提前设置了变量，要将解构表达式用()包起来
			let a;
			({a}={a:1});
			console.log(a);

3.字符串的解构赋值

// 字符串的解构赋值
			const [a,b,c,d,e]='hello';
			console.log(a,b,c,d,e);
			
			let {length:l}="hello es61";
			console.log(l);

4.函数的解构赋值

 function getPos(){//封装函数
            return {
                left:10,
                top:20
            }
        }

        let {left,top:t} = getPos();/*t为别名*/
        //let {left, top:t} = {left:10,top:20}

        console.log(left, t);