1.什么是结构赋值?主要作用在于?
-
在语法上,就是赋值的作用,解构为(左边一种解构。右边一种解构,左右一一对应进入赋值)
-
主要作用在于字符串、函数、交换变量的值、提取 JSON 数据、遍历 Map 结构等等
1.字符串
var [a,b,c,d,e] = "hello";
console.log(a); // h
console.log(b); // e
console.log(c); // l
console.log(d); // l
console.log(e); // o
2.函数
function move({x = 0, y = 0} = {}) {
console.log([x, y]);
}
move({x: 3, y: 8}); // [3, 8]
move({x: 3}); // [3, 0]
move({}); // [0, 0]
move(); // [0, 0]
3.交换变量的值
let x = 1;
let y = 2;
[x, y] = [y, x];
4.提取json数据
let jsonData = {
id: 42,
status: "OK",
data: [867, 5309]
};
let { id, status, data: number } = jsonData;
console.log(id, status, number);
// 42, "OK", [867, 5309]
5.遍历 Map 结构
const map = new Map();
map.set('first', 'hello');
map.set('second', 'world');
for (let [key, value] of map) {
console.log(key + " is " + value);
}
// first is hello
// second is world
解构赋值分解有:
- ES6允许按照一定模式从数组和对象中提取值对变量进行赋值,这被称为解构(Destryc tyruing)
- 基本用法
- 对象的结构赋值
- 数组的结构赋值
- 基本类型的解构赋值 代码如下:
//1.基本用法
// let name='张三',age=18,sex='男';
/* let [name,age,sex]=['李四',20,'女'];
name='hahha';
console.log(name);
console.log(age);
console.log(sex);*/
//2.对象的解构赋值
/*
let {name,age,sex}={name:'张三',age:55,sex:'男'};
console.log(name);
console.log(age);
console.log(sex);
*/
/*let {name,age,friends,pet}={name:'张三',age:55,friends:['qqqq','ssss'],pet:{name:'土豆',age:5}};
console.log(name);
console.log(age);
console.log(friends);
console.log(pet);
*/
/* let {name:str}={name:'张三'};
console.log(name);//空
console.log(str);//张三*/
//03.数组的结构赋值
/* let [arr1,[arr2,arr3,[arr4,arr5]]]=[1,[2,3,[4,5]]];
console.log(arr1,arr2,arr3,arr4,arr5);//1 2 3 4 5
*/
/* let [arr1]=[];
console.log(arr1);*/
/* let [a,b,c]=[1,2,3];
console.log(a);
console.log(b);
console.log(c);*/
//04.基本类型的解构赋值
let[a,b,c,d,e]='我是中国人';
// let[a,b,c,d,e]=12312;//如果改数字12312,这样报错了,因为number类型里面没有一个构造器,不存在。
console.log(a);//我
console.log(b);//是
console.log(c);//中
console.log(d);//国
console.log(e);//人