学习javascript基础知识系列第二节 - this用法
第二节 - this用法
this是面向对象语言中的一个重要概念，在JAVA,C#等大型语言中，this固定指向运行时的当前对象。但是在javascript中，由于javascript的动态性（解释执行，当然也有简单的预编译过程），this的指向在运行时才确定。这个特性在给我们带来迷惑的同时也带来了编程上的自由和灵活，结合apply(call)方法，可以使JS变得异常强大。
this指向的对象，可以通过以下三点区分：
-
.当函数仅仅作为函数执行的时候，this指向的是全局的。
-
.当函数作为构造函数执行的时候，this指向的是当前创建的对象。
-
.当函数作为对象的方法执行的时候，this指向的是当前的对象。
注意：
为了便于执行和演示，建议使用chrome浏览器，按F12,然后按Esc（或手动选择）打开console，在console进行执行和演示。
由于代码中使用了console.log或dir方法，因此如果在ie中执行，请自行替换为alert或注释掉。
下面通过代码来解释上述三点。
一、当函数作为函数执行的时候
有以下函数：
function A(){
this.a = "isea533";
console.log(this.a);
}
依次在console中输入（请不要输入注释内容）：
//创建函数A()
function A(){
this.a = "isea533";
console.log(this.a);
}
undefined
//输入a，查看全局变量a
a
//返回结果为a 未定义
ReferenceError: a is not defined
//执行函数A() -- 这里是作为函数执行
A()
//console.log输出结果
isea533
undefined
//输入a，查看全局变量
a
//此时a已经有值了，说明函数A()执行的this.a是全局的。
"isea533"
//给全局a赋值1
a = 1;
1
//输入a，查看全局变量此时结果为1
a
1
//再次执行函数A
A();
isea533
undefined
//函数A执行后，a的值发生改变，从1变成isea533
a
"isea533"
上面的执行结果已经可以说明，当作为函数执行的时候，this为全局的。
二、当函数作为构造函数执行的时候
仍然使用上述函数A()
依次在console中输入（请不要输入注释内容）：
function A(){
this.a = "isea533";
console.log(this.a);
}
undefined
//创建对象obj,构造函数执行过程中输出this.a
var obj = new A();
isea533
undefined
//查看对象的属性a
obj.a
"isea533"
//创建对象obj2
var obj2 = new A();
isea533
undefined
//查看obj2的属性a
obj2.a
"isea533"
//改变obj的属性a的值
obj.a = "isea";
"isea"
//查看obj2的属性a的值，没有改变
obj2.a
"isea533"
//查看全局变量a,结果为未定义
a
ReferenceError: a is not defined
三、当函数作为对象的方法执行的时候
其实第三条可以归到第二条中，因为这结果是显而易见的，这里主要是为了说明一些常见的情况，所以特地单独讲解。
有如下html代码：
<input type="text" id="username" value="isea533" onclick="console.log(this.value)"/>
<input type="text" id="age" value="30" />
<script>
function A(){
console.log(this.value);
}
document.getElementById("age").onclick = A;
</script>
在这两种方式中，我们可以看到this在这里就是指向的相应的input对象。
这是由于我们把onclick事件添加到了Dom对象上，所以this会指向当前的Dom对象，而不是全局对象。
我们在看另一种情况：
依次在console中输入（请不要输入注释内容）：
//创建全局变量a
var a = "isea533";
undefined
//创建函数A
function A(){
console.log(this.a);
}
undefined
//创建对象c,c有属性a
var c = {a:"isea"}
undefined
//向c增加方法log = A;
c.log = A;
function A(){
console.log(this.a);
}
//执行c的log方法，输出c的属性a而不是全局的a
c.log();
isea
undefined
//查看全局对象a,值没有发生改变
a
"isea533"
//执行函数A,输出全局对象a的值
A();
isea533
undefined
//新建对象e = A
var e = A;
undefined
//执行e,这里e()和A()是一样仅仅作为函数执行的，e是函数，不是对象
e()
isea533
undefined
//我们使用toString.call验证一下，这里e是Function
toString.call(e)
"[object Function]"
//这里c是Object
toString.call(c)
"[object Object]"
通过上面的例子代码，我想你应该对this有一定的了解了，了解this指向在Js编程过程中非常的有用，了解这一点可以在使用过程中方便许多，也能避免出错。
相关阅读：
