我们需要将 ES6 代码包装在 IIFE 中吗?
Do we need to wrap ES6 code in an IIFE?
在 ES5 中,编写这样的代码被认为是一种好的做法:
(function () {
//some magic
})();
但在 ES6 中,使用 let
关键字创建的变量不会附加到 window
对象。
那么,现在是否有必要在 IIFE 中编写我们的代码,或者它还有一些我从未听说过的用途?
如果您使用的是模块,则无需使用 IIFE(这就是 "wrapper" 的调用方式),因为所有变量的范围都限于模块。
不过,还是有一些情况,你想把代码的一部分和另一部分分开,然后你就可以使用IIFE了。
当然如果你使用let
或const
,你可以使用块语句代替IIFE:
{
let something = 1;
const somethingElse = 2;
}
console.log(something); // ReferenceError: something is not defined
参见 Programmers.SE 上的相关问题:How far should encapsulation in JavaScript go?。
现在问题不大了,但我认为这个一般想法仍然有理由。
从理论上讲,某些第三方库可以编写如下代码:
let count = 0;
function getCount() {
return count++;
}
现在,如果您尝试在同一范围内创建自己的 count
变量,您会收到错误消息:
// 3rd-party
let count = 0;
function getCount() {
return count++;
}
// Your code
let count = 1;
但是,您可以通过使用实际块而不是 IIFE 来使代码更清晰。
// Still bad 3rd party
let count = 0;
function getCount() {
return count++;
}
// Your code
{
let count = 10;
console.log(count);
console.log(getCount());
console.log(count);
console.log(getCount());
}
将来,您应该能够将代码封装在模块中,这些模块将有自己的作用域,您不需要将代码包装在 IIFE 或块中。
在 ES5 中,编写这样的代码被认为是一种好的做法:
(function () {
//some magic
})();
但在 ES6 中,使用 let
关键字创建的变量不会附加到 window
对象。
那么,现在是否有必要在 IIFE 中编写我们的代码,或者它还有一些我从未听说过的用途?
如果您使用的是模块,则无需使用 IIFE(这就是 "wrapper" 的调用方式),因为所有变量的范围都限于模块。
不过,还是有一些情况,你想把代码的一部分和另一部分分开,然后你就可以使用IIFE了。
当然如果你使用let
或const
,你可以使用块语句代替IIFE:
{
let something = 1;
const somethingElse = 2;
}
console.log(something); // ReferenceError: something is not defined
参见 Programmers.SE 上的相关问题:How far should encapsulation in JavaScript go?。
现在问题不大了,但我认为这个一般想法仍然有理由。
从理论上讲,某些第三方库可以编写如下代码:
let count = 0;
function getCount() {
return count++;
}
现在,如果您尝试在同一范围内创建自己的 count
变量,您会收到错误消息:
// 3rd-party
let count = 0;
function getCount() {
return count++;
}
// Your code
let count = 1;
但是,您可以通过使用实际块而不是 IIFE 来使代码更清晰。
// Still bad 3rd party
let count = 0;
function getCount() {
return count++;
}
// Your code
{
let count = 10;
console.log(count);
console.log(getCount());
console.log(count);
console.log(getCount());
}
将来,您应该能够将代码封装在模块中,这些模块将有自己的作用域,您不需要将代码包装在 IIFE 或块中。