JavaScript 中,考查如下代码:
- (function()
- {
- alert("cftea");
- })();
其实这段代码的意思就是执行这个匿名函数,弹出提示框,内容为“cftea”。
可以把上述代码理解为:
- function foo()
- {
- alert(1);
- }
- foo();
其实相同的功能还有另外两种写法,我们一并列出来如下:
- function foo()
- {
- alert("cftea");
- }
- foo();
- (function()
- {
- alert("cftea");
- })();
- (function()
- {
- alert("cftea");
- }());
- void function()
- {
- alert("cftea");
- }()
用途
说了这么多,这东西到底有什么用呢?它可以立即执行一段代码,并把结果赋给变量;打破我们常规的先写函数,再调用的流程,简化书写。
- ajax.xmlhttp = (...)();
例子:
- function Foo() {
- var a = 123;
- this.a = 456;
- (function() {
- alert(a); // 123
- alert(this.a); // undefined
- })();
- }
- var f = new Foo();
以上代码,先显示 123,再显示 undefined,说明 alert(this.a); 这句中 this 是指本 function 的,而不是其外部 function 的。如果要使用外部的成员,可使用参数的形式传入:
- function Foo() {
- var a = 123;
- this.a = 456;
- (function(a) {
- alert(a); // 456
- })(this.a);
- }
- var f = new Foo();
很好理解,再看看下面的:
- function Foo() {
- var a = 123;
- this.a = 456;
- (function() {
- alert(a); // 123
- alert(this.a); // undefined
- this.b = 789;
- })();
- (function() {
- alert(this.b); // 789
- })();
- }
- var f = new Foo();
- (function() {
- alert(this.b); // 789
- })();
- 同样是先显示 123,然后显示 undefined,然后显示 789,最后又是一个 789。这说明用两个小括号括起来的都是位于一个执行上下文中的,不论这些代码放在哪里。
- 再看看:
- function Foo() {
- (function() {
- this.b = 789;
- })();
- (function() {
- alert(this.b); // 789
- var b = 0;
- alert(b); // 0
- })();
- }
- var f = new Foo();
- (function() {
- alert(this.b); // 789
- alert(b); // 789
- })();
- 令人意外的是,最后一个 alert(b),结果仍然是 789。
- 更深入一步:
- function Foo() {
- (function() {
- this.b = 789;
- })();
- (function() {
- alert(this.b); // 789
- alert(b); // undefined
- var b = 0;
- alert(b); // 0
- })();
- }
- var f = new Foo();
- (function() {
- alert(this.b); // 789
- alert(b); // 789
- })();
var的规则是: 使用var声明变量就是内部变量; 无var声明就是全局变量,不管该function里面嵌套了多少函数。
this的规则是: 函数里的this永远指向自身, 但是函数里面有(function...)(),则双括号里面的this永远指向Window.
// GodDamnTest1
function Foo() {
var a = 123; // 局部变量, 所有子函数的全局变量
this.a = 456; // 对象属性
(function() {
alert(a); // 123, 全局
alert(this.a); // undefined, 普通函数, this指向DOMWindow
})();
}
var f = new Foo();
// GodDamnTest2
function Foo() {
var a = 123;
this.a = 456;
(function(a) { // 局部声明
alert(a); // 456, 被函数局部声明的a覆盖了全局
})(this.a);
}
var f = new Foo();
// GodDamnTest3
function Foo() {
var a = 123;
this.a = 456;
(function() {
alert(a); // 123, 全局
alert(this.a); // undefined, DOMWindow
this.b = 789; // window.b = 789
})();
(function() {
alert(this.b); // 789, window.b
})();
}
var f = new Foo();
(function() {
alert(this.b); // 789, window.b
})();
// GodDamnTest4
function Foo() {
(function() {
this.b = 789; // window.b = 789
})();
(function() {
alert(this.b); // 789, window.b
var b = 0;
alert(b); // 0, 这样的测试也写出来了!
})();
}
var f = new Foo();
(function() {
alert(this.b); // 789, window.b
alert(b); // 789, window.b
})();
令人意外的是,最后一个 alert(b),结果仍然是 789。 // no damn surprise at all!
// GodDamnTest5
function Foo() {
(function() {
this.b = 789; // window.b = 789
})();
(function() {
alert(this.b); // 789, window.b
alert(b); // undefined, 全局
var b = 0;
alert(b); // 0, 还有这种测试!
})();
}
var f = new Foo();
(function() {
alert(this.b); // 789, window.b
alert(b); // 789, window.b
})();
以上出之于:http://xiaolele.iteye.com/blog/682287