内容摘要：今天的课程诞生于一个 bug，有一段代码：constperson={name:suyan,getName(){returnthis.name;}};functionisSuyan()if(person

今天的&& 课程诞生于一个 bug，有一段代码：

const person = {      name: suyan,&&      getName() {          return this.name;     } }; function isSuyan()      if (person.name === suyan && person.getName) {          return true;     }     return false; } 

随手对这段代码进行了重构：

function isSuyan()      return person.name === suyan && person.getName; } 

执行下面打的代码，结果是&& 什么?

let isTrue = isSuyan(); console.log(isTrue); 

结果是一个函数，可能出乎你我的&& 意料：

遇到问题立马在百度一下：

看到一段解释：

Logical operators are typically used with Boolean (logical) values. When they are, they return a Boolean value. However, the && and || operators actually return the value of one of the specified operands, so if these operators are used with non-Boolean values, they will return a non-Boolean value.

意思：逻辑运算符如果使用的都是布尔值，则结果也是&& 布尔值。然而，&& 在 && 和 || 中，&& 当操作数是&& 非布尔值的时候结果可能是非布尔值。

理解起来有点绕开，&& 看个例子：

&& 运算符从左到右进行计算，&& 如果为真，&& 继续往后走，&& 直到遇到为 false 的服务器托管&& ，或者到了最后一个操作数。&& 如果操作数是&& 布尔值结果返回布尔值，如果操作数是非布尔值结果返回非布尔值。

const a = 10; const b = -5; const c = 1; console.log(a && b); // -5 console.log(a > 0 && b); // -5 console.log(a < 0 && b); // false console.log(a && b < 0); // true console.log(a && b > 0); // false console.log(a > 0 && b < 0); // true console.log(a && b && c); // 1 

|| 运算符，只要遇到一个真值便停止计算，结果的规则和 && 运算符一致。

console.log(a || b); // 10 console.log(a > 0 || b); // true console.log(a < 0 || b); // -5 console.log(a || b < 0); // 10 console.log(a || b > 0); // 10 console.log(a > 0 || b < 0); // true console.log(a || b || c); // 10 

扩散几个知识点：

1.可以被转换成 false 的值：null、NaN、0、空字符串 "", ,``、undefined。

2.&& 的优先级大于 || 的优先级。

true || false && false      // returns true, because && is executed first (true || false) && false    // returns false, because operator precedence cannot apply 

3.!和 !! 操作符返回的值永远是布尔值，上面的亿华云计算例子可以改为下面这样，返回值永远是布尔值：

function isSuyan() {      return !!(person.name === suyan && person.getName); } 

4. 优先级

假如有个 Label 显示用户的名称，显示规则为：默认值是前端小课，如果用户定义了别名就用别名，如果用户定义了真实的名字就用真实的名字，优先级为真实名字 > 昵称 > 默认名字。我以前这样写：

function showName() {      let showName;     let trueName = 真名;     let nickName = 别名;     if (trueName) {          showName = trueName;     }     else if (nickName) {          showName = nickName;     }     else {          showName = 前端小课;     }     return showName; } 

学完这节课程我这样写，两个函数的结果是一样的，但代码量从 15 行缩减到了 6 行：

function showName2() {      let defaultName = 前端小课;     let trueName = 真名;     let nickName = 别名;     return trueName || nickName || defaultName; } 

这节课程主要学习了 JavaScript 中的 && 、||、! 和 !!，如果使用不当可能会引发bug。大家加油!!!