ES6实用场景
# ES6实用场景
# 一、解构赋值的场景
const result = {
code: '200',
msg: '请求成功',
data: {
balance: 10,
balance2: 20,
},
};
const { balance, balance2: freezeBalance } = result.data || {};
const totalBalance = balance + freezeBalance; // 30
1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
注意解构的对象不能为undefined、null，所以要给被结构对象一个默认值，否则会报错
# 二、扩展运算符的实际使用场景
# 1. 合并数组
const arr1 = [1, 2, 3, 4, 5, 6];
const arr2 = [7, 8, 9, 10];
const merge = [...arr1, ...arr2]; // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
1
2
3
2
3
# 三、链判断运算符的使用场景
const result = {
code: '200',
msg: '请求成功',
// data: {
// balance: 10,
// balance2: 20,
// user: {
// isInit: 1,
// },
// },
};
if ((result?.data?.user?.isInit || 0) === 1) {
console.log('是新用户');
} else {
console.log('非新用户');
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
# 四、Null判断运算符 ??
只有当值为undefined和null时返回右侧值
# 1. 判断输入框未输入值的情况，undefined、null、''
if ((value ?? '') !== '') {
// do something
}
1
2
3
2
3
test
上次更新: 12/9/2021, 11:22:46 AM