this机制

---

javaScript这个迷人又令人困惑的混血儿，借鉴了多种编程语言的机制，这其中就包括就包括this机制。

this是什么？

在javascript里面，this是一个特殊的对象，它不像其他编程语言那样，是存储在实例中的值，直接指向此实例。而是作为一个单独的指针，自动定义于每一个函数域中，指向不同的位置，这也是为什么我们会将它搞混的原因。
js中的this代表的是当前行为的主体，js中上下文代表的是当前行为执行的环境。

为什么使用this

this为代码复用提供了可能，让代码变得更加简洁和复用。

this的5条规则

this到底绑定或者引用那个对象环境决定于函数被调用的地方。而函数的调用有着不同的方式，在不同的方式中调用决定this引用的是那个对象。

->我们一般只研究函数执行的时候里面的this

->this是谁和当前的函数在哪执行和在哪定义没有半毛钱的关系

1)看函数执行的时候,函数名之前是否有".",有的话"."前面是谁this就是谁,没有的话this就是window

oDiv.onclick=function(){

//匿名函数中的this->oDiv

fn();//fn函数中的this->window

};

[].slice(0);//->slice中的this是[]

[].__proto__.slice(0);//->slice中的this是Array.prototype

-->我们自己在数组原型中编写的方法,一般情况下我们函数中的this就是当前我们要操作的这个元素

Array.prototype.distinct=function(){

//this->我们当前要操作的这个数组

};

[1,2,2,3,1,2,3,2,1].distinct();

2)自执行函数中的this永远是window

(function(){ //this->window })();

~function(){ //this->window }();

window.setTimeout(function(){

//this->window

},10);

ary.sort(function(a,b){

//第一个匿名函数(参数)在执行的时候里面的 this->window

});

ary.forEach(function(){

//第一个匿名函数(参数)在执行的时候里面的 this->window

//但是如果context传递了值(第二个参数传递值了)那么这个方法中的this就是context

},context);

str.replace(reg,function(){

//this->window

});

3)给元素的某一个事件绑定方法,当事件触发的时候,方法中的this是当前元素本身

//[DOM零级事件绑定]

oDiv.onclick=function(){

//this->oDiv

};

//[DOM二级事件绑定]

oDiv.addEventListener("click",function(){

//this->oDiv

},false);

//在IE6~8下使用attachEvent

oDiv.attachEvent("click",function(){

//this->window

});

4)在构造函数模式中,我们的this.xxx=xxx中的this是当前的类的一个实例

function Fn(){

this.x=100;//this->f x是给当前实例f增加的私有的属性

}

Fn.prototype.getX=function(){

console.log(this.x);

};

var f=new Fn;

f.getX();//getX中的this->f

f.__proto__.getX();//getX中的this->Fn.prototype

5)call和apply强制改变this的指向->以上所有的this情况在遇到call/apply的时候都不好使,都已强制改变的为主

obj.fn.call(1);//this->1

一般情况下,我们执行call方法第一个传递的参数值是谁,那么fn中的this就是谁

[在非严格模式下]

第一个参数没有传递值、传递的是null、传递的是undefined fn中的this都是window

[严格模式下]

第一个参数传递的是谁this就是谁,传递null/undefined,fn中的this都是对应的null/undefined,不传递值默认也是undefined

小结

1. 默认绑定全局变量

2. 隐式调用

    function fn(){
    a=1;
    console.log(this.a)
}
var obj = {
    a=2,
    fn:fn
};
obj.fn();     //2

//只看倒数第一个小数点·前的对象；
//即最后一个调用该函数的对象就是传到该函数的上下文；
function fn(){
    console.log(this.a)
    }
var obj2 = {
 a:42,
 fn:fn
 }
 var obj1 = {
    a:2,
    obj2:obj2
    }
obj1.obj2.fn()      //42;

失去隐式绑定

function fn(){
   cnsole.log(this.a)
}
obj1 = {
 a:2,
 fn:fn
};
var bar =obj1.fn;
var a = "全局变量"

bar()   //全局变量

3. 显式绑定

即通过call/apply/bind给函数传入this

4. new实例绑定

你以为 你以为的 就是你以为的