JavaScript中的双管道(||)抛出错误而不是评估为假

Question

我读到JavaScript中的双管道检查变量是否是假的,这undefined是JavaScript中的虚假值,例如

这意味着如果值为falsey(例如0,"",null,undefined(另请参见JavaScript中的所有falsey值)),则将其视为false; 否则它被视为真实.

所以我尝试了这一点,发现undefined确实没有被评估为假,而是抛出一个错误:

let elemContent = document.getElementById('content');

let a = null;
let b = 2;

elemContent.innerHTML += a || 'ok'; // "ok"
elemContent.innerHTML += b || 'ok'; // "2"
elemContent.innerHTML += whatever || 'ok'; // "ERROR: whatever is not defined"

http://jsfiddle.net/ueqo6yko

是否是undefinedJavaScript中的虚假价值,或者如何理解这一矛盾？

Answer 1

因为在你的代码中,whatever不仅是,undefined而且还没有声明

要避免此错误,您可以执行以下操作:

let elemContent = document.getElementById('content');

let a = null;
let b = 2;

elemContent.innerHTML += a || 'ok'; // "ok"
elemContent.innerHTML += b || 'ok'; // "2"
elemContent.innerHTML += (typeof whatever !== 'undefined' && whatever) || 'ok3'; // "ok3"

Answer 2

undefined 确实是假的,但在声明之前使用变量是JavaScript中的一个错误.

添加一个let whatever = undefined地方以查看您期望的行为.

Answer 3

undefined和错误not defined是不同的.undefined是声明变量的值,当带有not defined均值的错误时,表示您的变量未声明.

一个例子undefined:

let elemContent = document.getElementById('content');

let a = null;
let b = 2;
let whatever;

console.log(whatever)

elemContent.innerHTML += a || 'ok'; // "ok"
elemContent.innerHTML += b || 'ok'; // "2"
elemContent.innerHTML += whatever || 'ok'; // "whatever is undefined"

<div id="content"></div>

一个有not defined错误的例子:

let elemContent = document.getElementById('content');

let a = null;
let b = 2;

elemContent.innerHTML += a || 'ok'; // "ok"
elemContent.innerHTML += b || 'ok'; // "2"
elemContent.innerHTML += whatever || 'ok'; // "ERROR: whatever is not defined"

<div id="content"></div>

这里有一个例子,你如何检查,声明变量并且它有一个值(不是undefined):

let test = "test";

if (typeof test !== undefined) {
  console.log("'test' is declared");
  if(test) {
    console.log("'test' has a value (not 'null', 'false', 'undefined'...)");
  }
}