详解JavaScript的布尔判定与短路规则

1、布尔判定

所谓布尔判定，指的是在进行&&或者||时候会先将值转为true（真）或false（假），详细规则如下图所示：

2、短路规则

&&和||在进行布尔判定时存在短路规则，即当满足一定条件时会直接结束判定返回结果，具体如下：

• &&：只要碰到了假值(false)，就会短路，并返回该假值， 只要短路，不会继续执行后面的表达式
• ||：只要碰到了真值(true)，就会短路，并返回该真值， 只要短路，不会继续执行后面的表达式

注意：如果没有发生短路的情况则直接返回最后一个值

简单使用及应用如下：

// 看代码说结果
console.log(2 && 4);
console.log(2 || 4);
// 第一个输出: 4
// 第二个输出: 2
// 问: 两者背后的原理? => 布尔判定与短路运算

// 实际开发中的应用: 实际开发中常常用||来赋默认值
/**
 * 下面代码的原理: 
 *    当前者不为空时判定为true此时返回前者
 *    当前者为空时判定为false此时判定后者为true返回后者
 */
let a = obj.a || 'default';

// 实际开发中常常用&&来判断前者是否存在某些方法, 若存在就调用
/**
 * 下面代码的原理: 
 *    当前者不为空时判定为true此时继续判定后者(就会运算后者)
 *    当前者为空时判定为false此时直接返回(不会运算后者)
 * 这样就达到了有方法就调用, 没有这个方法就不调用的目的
 */
obj.func && obj.func();

在很多经典源码中常常应用到&&和||，比如在vue源码中有：