空变量为什么赋值为null

@拭目以待：首发于空变量为什么赋值为null

日常编码中，经常需要提前声明一些空变量，如:

var _table;
// 当条件满足时，获取 class 为 table 的元素
if(true){
    _table = document.querySelector('.table');
}
// 当条件不满足时，获取标签为 table 且存在属性 grid-manager的元素
else{
    _table = document.querySelector('table[grid-manager]');
}

通过上面的示例声明的变量 _table 是个空值， 在声明但未执行条件判断语句时， 该变量会被解释器自动赋值为 undefined ，如下所示:

var _table;
console.log(_table);  // => undefined
// 与直接显示声明为undefined效果相同。
var _table2 = undefined;
console.log(_table2);  // => undefined
console.log(_table === _table2); // ==> true

但是我们通常在使用一些变量时，需要验证这个变量是否已经声明，这对于程序的健壮性是很必要的。但是在执行中，会存在一些问题，如下所示:

// 实际的应用场景: 验证指定变量是否未声明，如果未声明则进行异常处理。
if(typeof age === 'undefined'){
    console.log('变量age 未声明'); // =>变量age 未声明
}
var _name;
if(typeof _name === 'undefined'){
    alert(_name); // 虽然_name已被声明，但是这里依然被执行
}

出现这种情况，主要是由于操作符 typeof 在检测变量时，声明但未初始化 与 未经声明的变量都会返回undefined。

虽然这个结果从逻辑上存在一定的合理性，但是却会影响我们的正常使用。

所以我们在声明空变量时，需要对变量进行显式声明，即为其赋上空值 null ， 如下所示:

var _name = null;
    if(typeof _name === 'undefined'){
    alert(_name); // 未进入， 因为该值已经声明 且 已初始化
}

@拭目以待

个人站点：www.lovejavascript.com
表格管理插件:gridmanager.lovejavascript.com && github地址
QQ交流群 (452781895)：How To Make Love
微信公众账号：loveJavascript

《野生前端工程师》专辑中所有文章均为@拭目以待 原创，转载请注明出处。