javascript 有关this的理解

首先先看一段代码：

<script type = "text/javascript">
    function JSClass(){
        this.m_Text = 'division element';
        this.m_Element = document.createElement('div');
        this.m_Element.innerHTML = this.m_Text;
            
        this.m_Element.addEventListener('click', this.ToString);
    }
   
    JSClass.prototype.Render = function(){
         document.body.appendChild(this.m_Element);
    }     

    JSClass.prototype.ToString = function(){
        alert(this.m_Text);
    };
  

    var jc = new JSClass();
    jc.Render(); 
    jc.ToString();
</script>

运行结果：在页面上创建出div，文本为division element，然后alert出division element，当我点击div时将输出"undefined"

自己的理解：“在页面上创建出div，文本为division element，然后alert出division element”是因为此时this指的是JSClass的实例，而当我们点击div时，此时this指向的div本身，没有

m_Text属性。

因此在编写代码过程中，可以使用一个变量来指向它，就不会因为环境的变化，发生变化了，自己理解，呵呵

下面是看别人的博客总结：（感觉特别好）

 this的值取决于function被调用方式：

1、如果一个function是一个对象的属性，该function被调用的时候，this的值是这个对象，如果function抵用的表达式包含句点或是[]，this的值是他们前面的对象，如myObj.func 和myObj["func"] 中，func 被调用时的 this 是myObj。 

var person = {};
      person.name = "shenmajs";
      person.sayName = function(){
      alert(this.name);
};
person.sayName();
//弹出shenmajs，是person调用了sayName,this指向person

2、如果一个 function 不是作为一个对象的属性，那么该 function 被调用的时候，this 的值是全局对象。当一个 function 中包含内部 function 的时候，如果不理解 this 的正确含义，很容易造成错误。这是由于内部 function 的 this 值与它外部的 function 的 this 值是不一样的。解决办法是将外部 function 的 this 值保存在一个变量中，在内部 function 中使用它来查找变量。

var name = "window";
function alertName(){
    alert(this.name);
}
alertName();
//弹出window，直接调用alertName方法，相当于全局对象调用了此方法，全局变量name当作了全局对象的属性

3、如果在一个 function 之前使用 new 的话，会创建一个新的对象，该 funtion 也会被调用，而 this 的值是新创建的那个对象。如function User(name) {this.name = name}; var user1 = new User("Alex"); 中，通过调用new User("Alex") ，会创建一个新的对象，以user1 来引用，User 这个 function 也会被调用，会在user1 这个对象中设置名为name 的属性，其值是Alex 。

function Person (name){
    this.name = name;    //构造的过程中，this指向新的那个实例
    this.sayhello = function (){
        alert(this.name);
    }
}
var person = new Person("shenmajs"); 
person.sayhello(); //弹出shenmajs ，因为sayhello方法是由person调用的

function alertName(){
    alert(this.name);
}
var name = "window";
var person = {}; 
person.name = "shenmajs"; 
person.sayName = alertName; //sayName 与 alertName 都是指向那个方法实例的指针变量而已
person.sayName(); //弹出shenmajs，是person调用了alertName,this指向person
alertName(); //弹出window，直接调用alertName方法，相当于全局对象调用了此方法，全局变量name当作了全局对象的属性

function Person (name,age){
    this.age = age;
    this.name = name;
    this.sayHello = function(){
        alert("hi," +this.name );
    }; 
}

var person = new Person("shenmajs",25);
person.sayHello();//hi,shenmajs
var func = person.sayHello;// func 指向 function(){ alert("hi," +this.name );  它只是一个函数指针，与person.sayHello 指向一个函数

var name = "window";
func(); //hi,window,func直接调用 this指向全局对象

var name = "window";

var arraytest = [function(){alert(this[2]);},function(){alert(this.name);},"shenmajs"];//函数也是一种类型，匿名函数在这里当做数组的一个元素
arraytest.name = "arraytest";

var arrayfunc = [];
function func(){
　　alert(this[1]);
}
arrayfunc[0] = func;
arrayfunc[1] = 99;

var functest1 = func;
var functest2 = arraytest[1];

arraytest[0]();
//弹出shenmajs ，this指向arraytest，this[2] 等价于 arraytest[2]。我一开始也不理解为什么会指向arraytest，只能死记了。

arraytest[1]();
//弹出arraytest，同样，this指向 arraytest，this.name 相当于arraytest.name . 我给arraytest加了一个name属性。这也是js动态语言的特性

arrayfunc[0]();
//弹出99 ，数组中的第一个元素指向了函数，这样调用时this指向了 arrayfunc数组，同上面的道理 this[1] 相当于 arrayfunc[1]

functest1();
//弹出 undefined ，相当于直接调用 func，this指向全局对象 window[1]未定义，因此弹出undefined

functest2(); 
//弹出window ，functest2 = arraytest[1],变量functest2指向函数，这里调用 即相当于直接调用，this指向全局变量。

 

 

length = 9;
var foo = {
  bar: function() {
    return this.length;
  },
  length: 0
};
(function f(a, b) {

  f.length = 1;   
//f.length 表示函数形参个数，就是函数定义的括号里有几个参数，此属性不可写，因此 f.length 永远是2  .
// http://ecma-international.org/ecma-262/5.1/#sec-15.3.3.2

  alert(arguments[0]());
//argumengts表示实参，即函数时间传递进来的参数，f立即执行时，传进来三个参数 (..f..)(foo.bar,2,"str")
//弹出3,this指向arguments，arguments.length 等于 3

  alert(a());
//弹出9, a指向 foo.bar所指向的函数，a()直接调用，this相当于window全局对象，this.length 等于 9

  alert(f.length);  
// 弹出2 ,此属性不可写

  alert((foo.bar)());
//弹出0，foo调用函数bar，this指向 foo。 需要说明的是 foo.bar() 和 (foo.bar)()的效果一样。

})(foo.bar,2,"str");