标签：elf 定义 部分 调用 pre ima ons his on()
1. 纯函数
2. 对象方法调用
3. 使用new调用构造函数
4. 内部函数
5. 使用call / apply
6.事件绑定
1. 纯函数
var name = ‘this is window‘; //定义window的name属性
function getName(){
console.log(this); //控制台输出: Window //this指向的是全局对象--window对象
console.log(this.name); //控制台输出: this is window /
}
getName();
运行结果分析：纯函数中的this均指向了全局对象，即window。
2. 对象方法调用
var name = ‘this is window‘; //定义window的name属性,看this.name是否会调用到
var testObj = {
name:‘this is testObj‘,
getName:function(){
console.log(this); //控制台输出:testObj //this指向的是testObj对象
console.log(this.name); //控制台输出: this is testObj
}
}
testObj.getName();
运行结果分析：被调用方法中this均指向了调用该方法的对象。
3. 使用new调用构造函数
function getObj(){
console.log(this); //控制台输出: getObj{} //this指向的新创建的getObj对象
}
new getObj();
运行结果分析：new 构造函数中的this指向新生成的对象。
4. 内部函数
var name = "this is window"; //定义window的name属性,看this.name是否会调用到
var testObj = {
name : "this is testObj",
getName:function(){
//var self = this; //临时保存this对象
var handle = function(){
console.log(this); //控制台输出: Window //this指向的是全局对象--window对象
console.log(this.name); //控制台输出: this is window
//console.log(self); //这样可以获取到的this即指向testObj对象
}
handle();
}
}
testObj.getName();
运行结果分析：内部函数中的this仍然指向的是全局对象，即window。这里普遍被认为是JavaScript语言的设计错误，因为没有人想让内部函数中的this指向全局对象。一般的处理方式是将this作为变量保存下来，一般约定为that或者self，如上述代码所示。
5. 使用call / apply
var name = ‘this is window‘; //定义window的name属性,看this.name是否会调用到
var testObj1 = {
name : ‘this is testObj1‘,
getName:function(){
console.log(this); //控制台输出: testObj2 //this指向的是testObj2对象
console.log(this.name); //控制台输出: this is testObj2
}
}
var testObj2 = {
name: ‘this is testObj2‘
}
testObj1.getName.apply(testObj2);
testObj1.getName.call(testObj2);
Note：apply和call类似，只是两者的第2个参数不同：
[1] call( thisArg [，arg1，arg2，… ] ); // 第2个参数使用参数列表：arg1，arg2，...
[2] apply(thisArg [，argArray] ); //第2个参数使用 参数数组：argArray
运行结果分析：使用call / apply 的函数里面的this指向绑定的对象。
6. 事件绑定
事件方法中的this应该是最容易让人产生疑惑的地方，大部分的出错都源于此。
//页面Element上进行绑定
<script type="text/javascript">
function btClick(){
console.log(this); //控制台输出: Window //this指向的是全局对象--window对象
}
</script>
<body>
<button id="btn" onclick="btClick();" >点击</button>
</body>
//js中绑定方式（1）
<body>
<button id="btn">点击</button>
</body>
<script type="text/javascript">
function btClick(){
console.log(this); //控制台输出:<button id="btn">点击</button> //this指向的是Element按钮对象
}
document.getElementById("btn").onclick = btClick;
document.getElementById("btn").onclick(); //默认点击
</script>
//js中绑定方式（2）
<body>
<button id="btn">点击</button>
</body>
<script type="text/javascript">
document.getElementById("btn").onclick = function(){
console.log(this); //控制台输出:<button id="btn">点击</button> //this指向的是Element按钮对象
}
document.getElementById("btn").onclick();
</script>
//js中绑定方式（3）
<body>
<button id="btn">点击</button>
</body>
<script type="text/javascript">
function btClick(){
console.log(this);
}
document.getElementById("btn").addEventListener(‘click‘,btClick); //控制台输出:<button id="btn">点击</button> //this指向的是Element按钮对象把函数(方法)用在事件处理的时候。
document.getElementById("btn").attachEvent(‘onclick‘,btClick); //IE使用,控制台输出: Window //this指向的是全局对象--window对象
</script>
运行结果分析：以上2种常用事件绑定方法，在页面Element上的进行事件绑定（onclick="btClick();"），this指向的是全局对象；而在js中进行绑定，除了attachEvent绑定的事件方法（this指向的是全局对象）外，this指向的是绑定事件的Elment元素。
参考资料：
http://www.qdfuns.com/notes/16738/aa32a299479386c9c1fc254ef0dc6fcb.html
标签：elf 定义 部分 调用 pre ima ons his on()
原文地址：http://www.cnblogs.com/zdnz/p/6323551.html
