- 巧用逻辑或 || 的短路运算
巧用逻辑与或能够将多行条件判断语句用一行JS代码搞定
比如下面的代码，仅仅只判断下哪个变量有值，然后进行赋值的操作，都需要编写好几行代码，这显然不是我们想要的优美的语句。
let a = 10, b = 20, c;
if (a) {
c = a;
}else {
c = b;
}
换成逻辑或 || 的短路运算来解决这个问题
let a = 10, b = 20, c;
c = a || b; // 一个逻辑或运算符能抵几行的 if else 代码
- 点链式语法
本质就是先判断前一个属性是否存在，然后再进行取值操作，如果判断前一个属性不存在则不会继续往下查找属性值
function connect(config) {
// 可以尝试打印连前一个值都不存在的情况下去取值会是什么效果
// 下面代码 => 在点链式语法的前提下在多层次取值也不会报错
// console.log(config?.host?.name);
console.log(config?.host);
console.log(config?.port);
console.log(config?.username);
console.log(config?.password);
}
// 调用
connect({
username: 'root',
password: '123456'
});
输出结果：
> node index.js
> undefined
> undefined
> root
> 123456
点链式原理
// 点链式语法的本质
function mysql (config) {
// ①点链式语法的三元表达式 演示（精简版）
let host = config && config.host ? config.host : undefined;
console.log(host);
// ②点链式语法 代码展开完整版演示（啰嗦）
if (config && config.host) {
return config.host;
}else {
return undefined;
}
}
mysql({})
对比感受下，有了ES6点链式语法的推出，以后你的JS代码还会使用条件判断来解决问题吗？^_^
- 解构赋值
“解构赋值为程序开发提供更快捷高效简洁的代码编写方式，利用结构的相似性进行变量赋值的操作，能够省去由于多层级取值导致的编写大量代码而带来的麻烦。” —— 来自皮蛋瘦肉周为官方作的解释
- 数组解构赋值
// ①数组解构赋值
let arr = [1, 2];
let [a, b] = arr;
// 本质 let a = arr[0]; let b = arr[1];
console.log(a, b); // 1 2
- 对象解构赋值
// ②对象解构赋值
let obj = {name: '刘德华', age: 23};
let {name, age} = obj;
// 本质 let name = obj['name']; let age = obj['age'];
console.log(name, age);
- 数组的解构赋值规律
// ③连续解构赋值
let [[c, d], e] = [[7, 8], 3];
// 本质相当于 let [c, d] = [7, 8]; let e = 3;
数组的解构赋值，就是按顺序索引和维度层级来分配值的。
- 对象的解构赋值规律
let options = {url: 'http://localhost/index.html', config: {method: 'GET'}};
let {url, config: {method}} = options;
console.log(url, method);
// console.log(url, config, method); // 错误演示
解构赋值只能拿到最内层的值，什么意思呢？就是说左边如果一直在往下解构很多层的变量，最终不是全部都有效的，可使用的解构出来的变量是左边没有继续展开的变量。比如上面，能够使用的变量是 url、method，里面的config由于继续展开，被认为是一个层级查找，不算是最终解构出来的对象中的变量。你品，你细品 ~~~
