解构destruct

解构destruct

概念：从一个大的对象或数组中仅提取出个别成员单独使用

• 数组解构
• 对象解构
• 参数解构

1. 数组解构

(1)从数组中提取个别元素值单独使用

var [变量1,变量2,...] = 数组

变量1=数组[0]
变量2=数组[1]

举例：

var arr=[2021,3,4];
var [y,m,d]=arr;
console.log(`${y}年${m}月${d}日`);

(2)不声明第三个变量，交换两个变量的值

var a = 1,b = 2;
[a,b] = [b,a]
console.log(a,b);

结果：2 1 

2. 对象解构
   从一个大的对象中提取出个别属性值单独使用

var {属性名1：值1，属性名2：值2，...} = 对象

如果解构时变量名和属性名相同！则只写一个名字即可！一个名字两用
var {属性名1，属性名2，...} = 对象

举例：

var user={
	uname:"",韩
	className:"7年级8班",
	login(){
		console.log("ok");
	}
}
var {uname,className,login} = user; 
console.log(`${uname}来自${className}`);
login();

3. 参数解构
   若多个实参值都不确定有没有，而且要求每个实参值必须传给对应的形参变量

function 函数名({
	属性名1:形参1,
	属性名2:形参2,
	 ... : ...
}){... : ...}

//调用函数时，所有实参值也必须放在一个和形参列表相同结构的对象中
函数名({属性名1:实参1,属性名2:实参2, ... : ... });

//结果: 形参1=实参值1, 形参2=实参值2, ...

举例：

function order({
	year="2021",
	month="3",
	day="5"
}){
	console.log(`${year}年${month}月${day}日`);
}

order({
	year:"",
	month:"",
	day:""
});

注意：当调用函数的结构和形参的结构不同时，解构失败，自动使用默认值