javascript中this指向

在简单函数中，this是指向当前对象，可用来获取当前对象某个属性，但随着函数变复杂，this很多情况不指向当前对象，而是指向window。

1、在独立调用函数中，具有全局执行环境，this指向window。

 var name="evan";
 function Name(){
    this.name="evan2";
4     console.log(this.name) //evan2
 }
Name();
console.log(this.name)  //evan2

 

2. 匿名函数中，this都指向window对象

 function ftn(){
       ( function(){
            console.log(this);// window
        })();
    }
  ftn();

 

 function ftn0(){
        var ftn1 = function(){
            console.log(this);// window
        };
        ftn1();
    }
    ftn0();

 

3、被嵌套的独立函数，this指向window

 var a = 0;
 var obj = {
    a : 2,
    foo:function(){
            function test(){
                console.log(this.a);
            }
            test();
    }
 }
 obj.foo();//0

 

 在闭包中，也很容易出现这样,函数时立即调用，this指向window

var a=0;
var obj={
   a:2,
   fn:function foo(){
5        return function(){
6           console.log(this.a)
  }
} }
obj.fn()(); //0

 

 这经常是不想得到的结果，用that=this就可以解决

 var a=0;
 var obj={
   a:2,
   fn:function foo(){
      var that=this;
      return function(){
        console.log(that.a)
      }
   }
 }
 obj.fn()(); //2

 

 闭包可以访问所在父函数的变量，所以先在父函数保存this，传递给闭包函数。

 注意：函数的传递

  var a = 0;
  function foo(){
      console.log(this.a);
  };
  var obj = {
      a : 2,
      foo:foo
  }
 9   var bar = obj.foo; //这行表示把foo函数体传给bar
10   bar();//0

 

  这相当于

var a = 0;
var bar = function foo(){
    console.log(this.a);
}
bar();//0

 

 内置函数

 var a = 0;
 function foo(){
      console.log(this.a);
 };
 var obj = {
      a : 2,
      foo:foo
 }
 setTimeout(obj.foo,100);//0

 

这相当于

 var a = 0;
 setTimeout(function foo(){
      console.log(this.a);
4  },100);//0

 

间接引用

 function foo() {
      console.log( this.a );
 }
 var a = 2;
 var o = { a: 3, foo: foo };
 var p = { a: 4 };
   o.foo(); // 3
 //将o.foo函数赋值给p.foo函数，然后立即执行。相当于仅仅是foo()函数的立即执行
 (p.foo = o.foo)(); // 2

 

 1  function foo() {
     console.log( this.a );
  }
 var a = 2;
 var o = { a: 3, foo: foo };
 var p = { a: 4 };
  o.foo(); // 3
 //将o.foo函数赋值给p.foo函数，之后p.foo函数再执行，是属于p对象的foo函数的执行
 9  p.foo = o.foo;
 p.foo();//4

 

call()   把方法绑定到某个对象中

 var a = 0;
 function foo(){
     console.log(this.a);
 }
 var obj = {
     a:2
7  };
 foo();//0
 foo.call(obj);//2   把foo方法绑定到obj对象。

 

  function ftn(name){
        console.log(name);
        console.log(this);
    }
    ftn("101");
    var obj = {
      name:"xtq"
    };
    ftn.call(obj,"102");
   输出：101
        Window 
        102
        Object {name: "xtq"}

 

var name = "I am window";
var obj = {
    name:"sharpxiajun",
    job:"Software",
    ftn01:function(obj){
        obj.show();
    },
    ftn02:function(ftn){
        ftn();
    },
    ftn03:function(ftn){
        ftn.call(this);
    }
};
function Person(name){
    this.name = name;
    this.show = function(){
        console.log("姓名:" + this.name);
        console.log(this);
    }
}
var p = new Person("Person");
obj.ftn01(p);
obj.ftn02(function(){
   console.log(this.name);
   console.log(this);
});
obj.ftn03(function(){
    console.log(this.name);
    console.log(this);
});

输出：
姓名:Person
Person {name: "Person"}
I am window
Window
sharpxiajun
Object {name: "sharpxiajun", job: "Software"}

 

new出一个对象时，this指向新生成的对象。

 function foo(something) {
     this.a = something;
 }
 var obj1 = {foo: foo};
 var obj2 = {};
 obj1.foo( 2 );
 console.log( obj1.a ); // 2
 obj1.foo.call(obj2,3);
 console.log( obj2.a ); // 3
  //在下列代码中，隐式绑定obj1.foo和new绑定同时出现。最终obj1.a结果是2，而bar.a结果是4，说明this被绑定在bar上
 var bar = new obj1.foo( 4 );
 console.log( obj1.a ); // 2
 console.log( bar.a ); // 4

简单说就是：

• 有对象就指向调用对象  （如对象的方法）
• 没调用对象就指向全局对象 （如setTimeout、对象的方法中的方法）
• 用new构造就指向新对象 
• 通过 apply 或 call 或 bind 来改变 this 的所指。

 

 

这篇文章是用于笔记记录，如有错误，望指正

参考:http://www.cnblogs.com/xiaohuochai/p/5735901.html