JavaScript 运算符小技巧

一元运算符 void

void 运算符对任何值返回 undefinedundefined 不是保留字,在低版本浏览器或者局部作用域中是可以被当作变量赋值的,在很多压缩工具中都是将undefinedvoid 0 来代替掉了

var a = void 0; // undefined

算术运算符 +

加号一般都是用于计算数值,但是对两种不同类型使用加号会有一些意想不到的效果。

// 这里会触发隐式类型转换,最后得到hello1
var str = 'hello' + 1; // 'hello1'

利用+触发隐式类型转换的规则,我们可以用+将字符串转换为数字。

var count = +'100'; // 100

关系运算符 > 和 <

和 < 常用于比较两个数字大小,但在对字符串进行大小比较的时候,一般会依次比较两者每个字符 ASCII 码。

var bResult = "Blue" < "alpha"; // 输出 true

利用这一特性,我们可以巧妙地来比较一些日期的大小,这样就不需要再将日期拆开分别比较。

var date1 = '2018-09-10',
     date2 = '2018-09-11';
date1 > date2; // false

扩展运算符

在 ES7 中,将扩展运算符引入到了对象中。
扩展运算符可以用来进行浅拷贝。

var a = { name: 'ygy', age: 20 };
var b = { ...a };

扩展运算符也可以用于函数参数,尤其是对于不能使用 arguments 的箭头函数。

const func = (...rest) => {
    console.log(rest[1])
}
func(1, 2, 3)

逻辑运算符 && 和 ||

短路运算符在一定程度上可以代替 if 语句。

// old
if (callback) callback();
// new
callback && callback();

短路运算符也经常用于深层取值。

var obj = {
    info: {
        name: 'zzz'
    }
}
obj.info && obj.info.name; // 'zzz'

|| 常被用于给变量赋默认值。

var b = a || 10; // 如果a是空值,那么b就是10

位运算符

位运算 NOT

利用!可以将变量转换为布尔类型,最好使用!!来进行转换,这样对类型比较友好。

var a = {name: 'zzz'};
var b = !!a; // true

位运算 OR

|可以用来对数值进行向下取整。

var a = 10.1;
var b = 10.1 | 0; // 10

位运算 AND

利用 1 和其他数字进行&操作后得到 1 或 0 来判断这个数字是奇偶。

const num = 4;
const isEvenNum = num & 1 ? false : true;

~~ 实现向下取整

可以使用双位操作符来替代 Math.floor(),和|的用法基本上保持一致

var a = 10.1;
var b = ~~a; // 10
posted @ 2022-10-23 21:40  小风车吱呀转  阅读(27)  评论(0编辑  收藏  举报