This指向当前函数据以执行的环境对象

 

  1. 函数在全局作用域中定义,并且在全局作用域中被调用,this指向全局对象

 

window.value = 1;

function getValue() { alert(this.value); }

getValue(); // 输出1, 此时的this指向window.

 

  1. 函数被保存为对象的一个属性时,调用该方法,this指向该对象

 

var obj = {

value: 1,

getValue: function() {

alert(this.value);

}

};

obj.getValue(); // 输出1, 此时的this指向obj

 

html

<input id=”demo” style=”width:200px; height:50px ;background:#000″ type=”button” value=”demo” />

Javascript:

function showMsg(){

alert(this.style.width);

}

window.onload = function(){

document.getElementById(“demo”).onclick = function(){showMsg()};

}

当div被点击 alert(this.style.width) 脚本报错this.style.width为空或不是对象。因为showMsg中的this指向了匿名函数,而匿名函数不具有style属性。

 

  1. 通过new前缀构造出的实例对象,该实例对象中的方法中,this指向实例对象

 

function show(val) {

this.value = val;

};

show.prototype.getVal = function() {

alert(this.value);

};

var func = new show(1);

func.getVal(); // 输出1

alert(func.value) // 输出1

// 从上面的结果, 可以看出, 此时的this指向了func对象.

 

  1. 被绑定事件的this指向,绑定该事件的对象

通过addEventListener绑定的事件,this指向绑定该事件的对象

通过attachEvent绑定的事件,this指向window,即全局作用域。可通过call或apply更改作用域。

html

<input id=”demo” style=”width:200px; height:50px ;background:#000″ type=”button” value=”demo” />

Javascript:

function showMsg(){

alert(this.style.width);

}

window.onload = function(){

document.getElementById(“demo”).onclick = showMsg;

}

当div被点击 alert(this.style.width) // output 200px

 

通过一些类库绑定事件时,被绑定事件的this也指向绑定了该事件的对象

YUI({combine:  true}).use(‘io’,  ‘until’,  function  (Y)  {

var  Demo  =  {

init  :  function(){

Y.one(“#demo”).on(“click”,this.showMsg)

},

demo_txt  :  “hello,tid!”,

showMsg  :  function(){

alert(this.demo_txt);

}

}

});

Demo.init();

由于”demo”不具有demo_txt属性,因此输出undefined。可通过以下方式改进:

Init : function(){

Var $this = this;

Y.one(“#demo”).on(“click”,function(){$this.showMsg()})

}

 

 

  1. Apply/call人为将函数的作用域指向参数

 

var  fun  =  function(str)  {

this.status  =  str;

}

fun.prototype.getStatus  =  function()  {

alert(this.status);

}

var  obj  =  {

status:  "loading"

};

fun.prototype.getStatus.apply(obj);  //  输出"loading",  此时getStatus方法中的this指向了obj

 

  1. 闭包的this指向

function f1(){

            n=999;

            function f2(){
                  alert(n);
            }

            return f2;

      }

      var result=f1();

      result(); // 999

f2的this本应指向f1,但将f2 return后,f2将指向全局作用域。闭包的好处是,f2可以读取对全局作用域不可见的局部变量。F2指向全局作用域后,在全局作用域中可通过f2访问f1中的变量。

 

附闭包示例:

Js代码 
  var name = "The Window";   
  var object = {   
    name : "My Object",   
    getNameFunc : function(){   
      return function(){   
        return this.name;   
     };   
    }   
};   
alert(object.getNameFunc()());  //The Window

--------------------------------------------------------------------------------------------------------
JavaScript闭包例子

function outerFun()
 {
  var a=0;
  function innerFun()
  {
   a++;
   alert(a);
  }    
 }
innerFun()

上面的代码是错误的.innerFun()的作用域在outerFun()内部,所在outerFun()外部调用它是错误的.

改成如下,也就是闭包:

Js代码

function outerFun()
{
 var a=0;
 function innerFun()
 {
  a++;
  alert(a);
 }
 return innerFun;  //注意这里
}
var obj=outerFun();
obj();  //结果为1
obj();  //结果为2
var obj2=outerFun();
obj2();  //结果为1
obj2();  //结果为2