【避坑】请谨慎使用 undefined !
1. undefined 的全局修改问题
let undefined ="小前端大梦想";输出结果: Uncaught SyntaxError: Identifier 'undefined' has already been declared
解释: 这步是在外层全局去声明一个变量undefined值为小前端大梦想,由于全局已经有这个变量了所以声明会报错
//众所周知var可以重复声明
var undefined ="小前端大梦想";输出结果: console.log(undefined)
这里打印依旧是值undefined,而不是小前端大梦想
解释: 这样的确可以(修改)而且不报错, 但是由于undefined这个是不可枚举、不可写、不可配置的所以打印输出的值是undefined
总结: 如果平常开发中直接使用undefined没有任何问题,因为不可改嘛; 但是问题不是出在这,而是出在undefined不是关键字上
2. 关键词的问题
let null ="789";输出结果: Uncaught SyntaxError: Unexpected token 'null'
解释: 报错由于 null 是关键字所以不能定义名为 null 的变量。讲通俗点就是null是人家创造 js 语言的时候就用了这个null,你用不了。
而undefined不是关键字因此可以作为变量名去声明;
console.log(undefined)//undefined
function bar(){
let undefined ="小前端大梦想";
return undefined
}
console.log(bar()); //输出结果: 小前端大梦想;
console.log(undefined); //输出结果: undefined由这个输出可以清楚地说明, undefined不是被修改了
而是定义了一个名为 undefined 的变量根据作用域查找规则找到了这个变量而不是正主 undefined 而已.
注意:这里是在函数作用域中而不是全局作用域,因此可以声明这个 undefined 变量
总结: 在上面的函数返回小前端大梦想不是因为undefined被修改了而是你定义了一个变量undefined跟人家名重复了,所以返回的时候就近原则拿的是你定义而不是js语言定义的。
3. vue 等框架/库的操作
根据前面铺垫,那么我只需要拿到最外层的undefined即可,那么拿他也有很多办法。框架和库通常使用void 0去获取undefined。
void 运算符对给定的表达式进行求值,然后返回 \`undefined\`。
function bar(){
let undefined ="小前端大梦想";
return void 0
}
console.log(bar())//undefined;当然除了 void 0 这种写法,你用 window.undefined、globalThis.undefined 也完全没有问题,只是 B 格不够高而已。
解释:
由于 undefined 不是关键字。根据变量查找规则很有可能找错。
为了防止我拿到并返回的是你定义的名为 undefined 的变量而不是 undefined 本身,所以我要去那一个稳定稳妥百分百是 undefined 的值,void0 也好 window.undefined/globalThis.undefined 也好只是为了拿到真实的js语言定义的undefined变量
总结: 可以通过 void 0、window.undefined、globlThis.undefined 获取最外面的 undefined:
undefined不可以修改;undefined不是关键字,因此可以定义变量名为 undefined;- 我们无法保证拿到的
undefined是正主 undefined 还是某个人定义的变量名为 undefined 的变量,所以往往在库中使用void去求一个 undefined(正主);
