javascript解构赋值详解

const data = {
	name: "fyw",
	age: 18,
	sex: "男",
};

// 对于对象的解构
let name, age, sex;
name = data.name;
age = data.age;
sex = data.sex;

// 上面的写法等于
let { name: name1, age: age1, sex: sex1 } = data;

// 如果不写:就表示name:name
// name: name1 表示 let name1=data.name  前面为原来对象里面的name,后面name1为定义的变量

// 对于数组的结构
// 数组本质上也是个对象只不过他的key是他的index

const arr = [1, 2, 3, 4];
// 可以用对象的方式进行解构
// 但是数组不能作为一个合法的变量名,所以可以给他重新命名
let { 0: a, 1: b, 2: c, 3: d } = arr;
console.log(a, b, c, d); //1 2 3 4
// 数组可以使用更简单的方式进行解构
// 数组必须要按顺序进行结构,因为他就是用他的index进行结构的(上面的例子)
let [a, b, c, d] = arr;
console.log(a, b, c, d); //1 2 3 4
// 如果需要某一个index的数据可以
let [, , , d] = arr;
console.log(d); // 4

// 例题
// 解构出第二条评论的用户名和评论内容
const article = {
	title: "文章标题",
	content: "文章内容",
	comments: [
		{
			content: "评论1",
			user: {
				id: 1,
				name: "用户1",
			},
		},
		{
			content: "评论2",
			user: {
				id: 2,
				name: "用户2",
			},
		},
	],
};

const {
	comments: [
		,
		{
			content,
			user: { name },
		},
	],
} = article;

console.log(content, name);