JS定义一个立即执行的可重用函数

.

• 首页
• 博客园
• 联系我

• 前言：本文标题是什么意思？.
• 也许可以这么干.
• 定义后立即执行的函数表达式.
• 难以重用以上定义过的函数.
• return this如何？.
• 可行操作.
• arguments.callee.

• 留言评论
• 返回顶部

前言：本文标题是什么意思？

我定义了一个函数表达式 testFun

var testFun = (function() {
  ... //函数内容
})();

测试结果：虽然 testFun 函数有如愿在页面加载后立即被执行，但再次执行该函数却没有任何效果

testFun(); //在如上定义并立即执行后在其它地方调用该函数，没有效果

目标需求为，在定义一个函数表达式时让这个函数在该JS页面加载完毕后立即执行，而后其它函数需要使用该函数时仍然可以通过函数名 testFun 调用执行。

[注：本文斜体字为示例名称]

也许可以这么干

你也许会说，在定义后直接马上调用执行一次不就行了？就像下面这样：

var testFun = function() {
  ... //函数内容
};
testFun();//马上执行该函数

或者还可以这么干：

window.onload=testFun;//将函数引用赋给onload事件
var testFun = function() {
  ... //函数内容
};

没错，这是能达到目标效果。但是不太好看。毕竟JS支持声明定义后立即执行函数，为什么不能通过该立即执行函数的引用再次调用它呢？

定义后立即执行的函数表达式

首先，怎么让函数定义后立即执行呢？（注意下例代码中的括号）

方法1：

(function testFun()
{
  ... //函数内容
}()); 

方法2：

(function testFun()
{
  ... //函数内容
})(); 

方法3：

var testFun = (function()
{
  ... //函数内容
})(); 

以上方法均能令 testFun 函数在定义后立即被执行。

难以重用以上定义过的函数

如果在同一个JS文件中的其它位置运用以下代码是不会有任何效果的。

testFun(); 

用typeof测试一下当前的 testFun 是什么类型

alert(typeof(testFun)); //undefined

得到的结果居然是undefined，这是怎么回事呢？

如下例：

testFun = ( function() {...} )();
//等价于
function A() {...};
testFun = A();

原因就是， testFun 定义后立即被执行了，执行完却没有返回值，所以 testFun 未定义（undefined）。

return this如何？

第一反应是，加一个return this试试？

testFun = ( function() {
  ...
  return this;
})(); //该函数仍旧定义后立即被执行一次

在同一个JS文件的其它地方重新调用该函数

testFun();//没有效果

依旧没有任何效果，还是用typeof测试一下

alert(typeof(testFun)); //Object

为何return this后该“函数表达式”是一个Object而不是function呢？

这是因为return this的this指向的是window！

可行操作

其实，在定义立即执行函数的函数末尾加上 return arguments.callee; 即可达到理想效果，如以上方法3变更为

var testFun = function()
{
  ... //函数内容
  return arguments.callee;
})(); 

那么，这个arguments.callee是何方神圣呢？

arguments.callee

arguments.callee是一个指向正在执行的函数的指针。

这就不难理解上例中arguments.callee的作用了：指向被定义后被立即执行的函数本身并返回给testFun.

不过需要注意的是，在严格模式下，不能通过脚本访问argument.callee，访问这个属性会导致错误！