this的指向

在JS中，有三种需要注意的this：寻常的this/事件的this/ajax请求的this。

寻常的this

这种this的判断很简单，this是指向执行函数的对象。下面是事例说明：

var name = "window";

var test1 = function() {
    this.name = "test1";      //此处真相：window.name = "test1"
    console.log(this.name);
}

test1(); //结果为：test1

var test2 = {
    getName : function() {
        console.log(this.name);
    }
}

test2.getName();  //结果为：undefined

var test3 = function() {
    this.name = "test3";
}

test3.prototype.getName = function() {
    console.log(this.name);
}

var test = new test3();      //new的原理就不说了，可以看我以前写的博文"new操作符做了什么"
console.log(test.getName);   //结果为：test3

从上面的事例可以得出两个结论：

1. 寻常情况下，判断this不用多想其他，只需关注执行此函数的对象就行。

   //说白了，"前缀"."方法名"，this-->"前缀"
   test1()                      //写完整是window.test1()，this-->window
   test2.getName()              //this-->test2
   test2.test3.test4.getName()  //this-->test2.test3.test4

2. test2.getName()的结果是undefined，可以得出，this是不存在回溯，当前的this的某个属性没有，那就是没有，存在__proto__属性才可以回溯

事件的this

事件的this是触发这个时间的DOM对象。下面是事例说明：

<div>
    <input type="button" id="button" value="按钮" />
</div>
<script type="text/javascript">
var btn = document.getElementById("button");

btn.onclick = function(e) {  //this-->DOM节点input
    console.log(this);
};
</script>

ajax的this

ajax的this是XMLHttpRequest对象，创建ajax的函数如下：

function createXHR(){
    if (typeof XMLHttpRequest != "undefined"){
        return new XMLHttpRequest();
    } else if (typeof ActiveXObject != "undefined"){
        if (typeof arguments.callee.activeXString != "string"){
            var versions = [ "MSXML2.XMLHttp.6.0", "MSXML2.XMLHttp.3.0", "MSXML2.XMLHttp"], i, len;
            for (i=0,len=versions.length; i < len; i++){
                try {
                    new ActiveXObject(versions[i]);
                    arguments.callee.activeXString = versions[i];
                    break;
                } catch (ex){
                //跳过
                }
            }
        }
        return new ActiveXObject(arguments.callee.activeXString);
    } else {
        throw new Error("No XHR object available.");
    }
}

var XHR = createXHR(); //XHR就是Ajax对象

在根本上，this的指向都是可以通过判定寻常this的方法来判定，只是在使用jQuery等模版语言的时候，容易被蒙蔽了眼睛