解构赋值
解构赋值
【解构赋值】正常我们是这样定义一个数组，然后这样输出：
let arr = [1, 3, 5];
console.log(arr[0],arr[1],arr[2]);
// 1 3 5
但利用解构赋值也可以这样写：
let [a, b, c] = [1, 3, 5];
console.log(a,b,c);
// 1 3 5
前后解构如果不一致会输出这样的结果：
let [a, b, c] = [1, [3, 5]];
console.log(a,b,c);
// 1 [ 3, 5 ] undefined
修改一下即可：
let [a, [b, c]] = [1, [3, 5]];
console.log(a,b,c);
// 1 3 5
除了数组，还可以解构对象：
let person = {
name: 'ethan',
age: 24,
job: 'java'
}let {name, age, job} = person;
console.log(name, age, job);
// ethan 24 java
当我们获取到一个 json 数据，就可以使用这种方法来解构。也可以为其中的变量起别名：
let person = {
name: 'ethan',
age: 24,
job: 'java'
}let {name, age, job: profession} = person;
console.log(name, age, profession);
为了防止没有数据的时候输出
undefined，可以为变量设置默认值：let [a='暂无数据', b='暂无数据', c='暂无数据'] = [1, , 5];
console.log(a,b,c);
// 1 '暂无数据' 5let [a='暂无数据', b='暂无数据', c='暂无数据'] = [1, undefined, 5];
console.log(a,b,c);
// 1 '暂无数据' 5
但如果传过来的是
null，就不会转成默认值：let [a='暂无数据', b='暂无数据', c='暂无数据'] = [1, null, 5];
console.log(a,b,c);
// 1 null 5
还可以用来交换两个数，十分方便
let a = 5;
let b = 10;
[a, b] = [b, a];
console.log(a);
// 10
console.log(b);
// 5
还有工作中
import时也会经常用到import {xxx, xxx, xxx} from './xxx'
推荐阅读
- Spring源码解析_属性赋值
- 红楼别解
- 简介深浅拷贝
- 记一次根据实体类的属性名来给属性名赋值，根据属性名得到属性名的值，其中使用的是JsonProperty属性名
- #|JQuery计数器+延时+从隐藏域取值赋值+页面加载自动运行
- 关于Excel数组赋值出错的问题|关于Excel数组赋值出错的问题, 800A03EC 错误
- memcpy多字节字节赋值问题
- stm32|stm32 奇怪的位赋值问题 出错了
- 给变量赋值，程序会跳到|给变量赋值，程序会跳到 HardFault_Handler的问题
- JavaScript解构赋值详解