JS杂拾-03-运算式与运算子

tags: ithome

内文摘要

• Expressions 运算式
• Operators 运算子

参考资料1：MDN — the Mozilla Developer Network
参考资料2：从ES6开始的JavaScript学习生活
参考资料3：Fooish 程序技术

Expressions 运算式

Operators 运算子

算术运算子 (Arithmetic Operator)

指派运算子 (Assignment Operator)

位元运算子 (Bitwise Operator)

比较运算子 (Comparsion Operator)

逻辑运算子 (Logical Operator)

1. 三种逻辑运算符：

   • Logical AND &&： 符号左右都是true才会得到true；其中任一方false，则得到false。
   • Logical OR ||：符号左右任一方为true，得到true；两方都false，才会得到false。
   • Logical NOT!：原本是true，经!转换会变成false
   • !!(xxx) 可以当Boolean(xxx)用

   !!'false' == !!'true'   // true  经过!!转换，两个值都是Boolean，且字串总是ture
   !!'false' === !!'true'   // true 即便使用严格比较===也是true，理由同上
   

2. 哪些资料类型经ToBoolean会转换成falsy?

   • Undefined
   • Null
   • 0, -0, NaN
   • "" or ''

   Boolean("false"); // true
   Boolean("0");     // true
   Boolean(-0);      // false
   Boolean("''''");  // true
   Boolean('');      // false    
   

   • 去掉falsy值的小方法：

   const arr = [1, 2, 3, null, 'a', 0]
   arr.filter(Boolean)     // [1, 2, 3, 'a'] null跟0都是falsy，因此被清掉了
   arr                     // arr = [1, 2, 3, null, 'a', 0]阵列只是复制，没有被改变 (immutable)
   

3. 短路求值(Short-circuit)

   • (&&)、(||)也称为短路求值(Short-circuit)运算符
   • (||)运算时，如果第1个运算子为"falsy"时，回传第2个运算子。否则，回传第1个运算子。
   • (&&)运算时，如果第1个运算子为"falsy"时，回传第1个运算子。否则，直接回传第2个运算子。刚好跟(||)相反

     console.log('foo' || 'bar') // 'foo'
     console.log(false || 'bar') // 'bar'
     console.log(false && 'bar') // false
     console.log( 0 || '' || 5 || 'bar') //5
     console.log(false || null || '' || 0 || NaN || 'Hello'       || undefined) //'Hello'
     

   • 常用的"指定预设值"，范例:

     let a = value || 5    // 5是预设值
     

字串运算子 (String Operator)

特殊运算子 (Special Operator)

void运算子： 接收任意运算式或值

三元运算子，又称条件运算子