JavaScript中的 this

JavaScript中的 this 表示当前调用函数的对象。就是谁调用了它就表示。请看下面三个例子.

1             this.name="global";
2             function f(){
3                 console.log(this.name);
4             };
5             f();

结果输出 globale 。我们知道在代码顶层定义一个对象，该对象就成为全局对象的一个属性。所以所上面的 f() 就相当于 this.f() 。所以输出 global

我们在接着写

1             var foo = {};
2             foo.name = "foo";
3             foo.fun = f;
4             foo.fun();

此时输出 foo。此时调用函数 f 的是 foo对象所以 this.name="foo" 函数输出 foo。

继续写:

1             var foo2 = {};
2             foo2.name = "foo2";
3             f.apply(foo2);

结果输出 foo2 。apply() 是函数对象的一个方法。该方法的作用是将函数作为一个对象的方法调用。所以此时调用函数 f 的对象是 foo2. 所以 this.name = "foo2"。

我们在看另外一个例子,这个例子中要用到JQuery。

 1 <html>
 2     <head>
 3         <script type="text/javascript" src="jquery-1.7.min.js"></script>
 4         <script type="text/javascript">
 5             $(function(){
 6                 $("#btn").click(function(){
 7                     alert(this.name);
 8                 });
 9             });
10         </script>
11     </head>
12     <body>
13         <input type="button" value="点击我" id="btn" name="按钮" />
14     </body>
15 </html>

点击按钮后弹出 "按钮" 。在这个按钮中使用 JQuery 绑定按钮对象的单击事件。上面一段JQuery代码就相当于

1 document.getElementById("btn").onclick = function(){console.log(this.name)}

点击按钮后出发 onclick事件。调用我们定义的函数。此时是按钮对象调用该函数，所以此时的 this 就是按钮对象。

现在明白 this 的含义了吧。代表当前调用函数的对象。