关于具名的IIFE内部对函数自身再赋值问题?

海洋饼干
  • 1.5k
+function foo(){
    foo=10;//我的问题代码
    console.log(foo);//方法自己
}();
console.log(typeof foo);//undefined 观察是否全局污染

函数foo内部对foo再赋值的这个10去哪了,同名函数foo是如何阻止全局污染的

回复
阅读 3.4k
3 个回答
林水溶
  • 1.1k
✓ 已被采纳

题主能问这个,可以的.不过这题能通过自己实践解决掉...

首先题主对于IIFE的写法没问题,IIFE的写法好多,常见的就是@ewind说的这个和:

(function(){}())

还有不常见的:

!function(){ /* code */ }();
~function(){ /* code */ }();
-function(){ /* code */ }();
+function(){ /* code */ }();

然后再说代码:
在函数里给当前函数名赋值时:foo = 10; 无效.(赞同@ewind,这里会忽略,应该有更合理的说法.)JS解析器会忽略掉它.
我在Chrome控制台执行的结果是:

function foo(){
    foo=10;//我的问题代码
    console.log(foo);//方法自己
}
undefined  // 上面typeof foo的结果

这就证明了上面我说的忽略
然后因为IIFE模拟了块作用域,外部环境访问不了内部的变量.所以就是undefined.


@ewind说因为foo是匿名函数然后怎样怎样.
明显概念搞混了.foo函数并不是匿名函数.

function [name]([param] [, param] [..., param]) { statements }

name
函数名,可以省略。当省略函数名的时候,该函数就成为了匿名函数。

MDN

(function foo(){
foo=10;//我的问题代码

console.log(foo);//方法自己

}();这样才是正确的;
function前面不能加+;会导致js解析错误

ewind
  • 1.9k

首先,贴出的代码是不完整的。完整版应该是这样

(function foo(){
  foo = 10
  console.log(foo) // [Function: foo]
})();
console.log(typeof foo) // undefined

这确实看起来比较反直觉,因为没有采用 var 声明的 foo 并没有污染全局作用域。

但如果函数内声明的变量名不是 foo,就很符合直觉了,如下:

var bar = 1;

(function foo(){
  bar = 10
})();

console.log(typeof foo) // undefined
console.log(bar) // 10

所以为什么函数内声明的变量和函数名同名时,会发生问题呢?可以看这个示例:

(function foo(){
  console.log(foo) // [Function: foo]
  console.log(arguments.callee) // [Function: foo]
  console.log(foo === arguments.callee) // true
})();

在立即执行的函数带有 foo 这一函数名后,调用时的 arguments.callee 其实就是对 foo 的引用了。比较二者可以发现此时 foo 就是函数对象。此时赋值操作并不能生效,遇到未加 var 声明的 foo 变量时,解释器查找到的也是这个函数对象,从而不会在全局作用域下产生污染。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
宣传栏