# 1.使用!!操作符转换布尔值
对于变量可以使用!!variable 做检测,只要变量的值为:0、null、" "、undefined 或者 NaN 都将返回的是 false,反之返回的是 true。
# 2.使用运算符将字符串转换成数字
// 注意+是拼接
let test = "1" + 0; //'10'
let test = "1" - 0; //1
1
2
3
2
3
# 3.并条件符
使用 || 运算符
在 ES6 中有默认参数这一特性。为了在老版本的浏览器中模拟这一特性,可以使用||操作符,并且将将默认值当做第二个参数传入。如果第一个参数返回的值为 false,那么第二个值将会认为是一个默认值。如下面这个示例:
function User(name, age) {
this.name = name || "Oliver Queen";
this.age = age || 27;
}
var user1 = new User();
console.log(user1.name); // Oliver Queen
console.log(user1.age); // 27
var user2 = new User("Barry Allen", 25);
console.log(user2.name); // Barry Allen
console.log(user2.age); // 25
1
2
3
4
5
6
7
8
9
10
11
2
3
4
5
6
7
8
9
10
11
# 4. 少用三目运算符
三目运算符性能高,代码量少。 但不应该滥用三目运算符,我们应该在简单逻辑分支使用,在复杂逻辑分支避免使用。
// 简单逻辑可以使用三目运算符
var global = typeof window !== "undefined" ? window : this;
// 复杂逻辑不适合使用
var ok = isString ? (isTooLang ? 2 : isTooShort ? 1 : 0) : -1;
1
2
3
4
5
2
3
4
5
# 5. 活用位操作符
编程语言计算乘除的性能都不高,但是某些情况使用位操作符可以提升乘除等运算的性能。
# 6.短路条件语句 “&&”
if (istrue) {
callback();
}
// 以上代码等同于 istrue && callback()
1
2
3
4
2
3
4
# 7.用操作符 “||” 来设置默认值
let a = a || "default value";
1
# 8.比“||”操作符更优的“??”
// 与逻辑或操作符(||)不同,逻辑或操作符会在左侧操作数为假值时返回右侧操作数。
// 也就是说,如果使用 || 来为某些变量设置默认值,可能会遇到意料之外的行为。比如为假值(例如,'' 或 0)时。
let a = 0 ?? "default value"; //输出a为 0
let a = 0 || "default value"; //输出a为 'default value'
1
2
3
4
2
3
4
关于可选链操作符详见 👉👉👉 :https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/%E5%8F%AF%E9%80%89%E9%93%BE (opens new window)
# 9.可选链操作符 “?.”
// 可选链操作符( ?. )允许读取位于连接对象链深处的属性的值,而不必明确验证链中的每个引用是否有效。
// 在引用为空(nullish ) (null 或者 undefined) 的情况下不会引起错误,该表达式短路返回值是 undefined。
let a = { name: "秦爱德" };
console.log(a.type?.job);
1
2
3
4
2
3
4
关于可选链操作符详见 👉👉👉https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/Nullish_coalescing_operator (opens new window)
# 10.双位操作符
Math.floor(5.9) === 5; //true
简写后;
~~5.9 === 5; //true
// 可以使用双位操作符来替代 Math.floor( )。双否定位操作符的优势在于它执行相同的操作运行速度更快。
1
2
3
4
2
3
4