js 关于丢失的this浅究

    var obj = {
        myName:'andy',
        getName:function(){
            return this.myName;
        }
    };
    console.log(obj.getName());//'andy'
    var getName2 = obj.getName;
    console.log(getName2());//undefiend

当调用obj.getName时,getName方法是作为obj对象的属性被调用的,此时this执行obj对象,
所以obj.getName()输出'andy'
当用另外一个变量getName2来引用obj.getName,并且调用getName2时,此时是普通函数调用方式,
this是指向全局window的,所以程序的执行结果是undefined

再看另外一个例子,document.getElementById这个方法名有点长,尝试过用一个短的函数来替代它,
如果prototype.js等一些框架所做过的事情:

    var getId = function(id){
        return document.getElementById(id);
    };
    getId('divs');

思考后,为什么不能采用更简单的方式:

    var getId = document.getElementById;
    getId('divs');

那么,问题来了;
在浏览器运行后,抛出一个异常,这是因为许多引擎的document.getElementById方法的内部实现中需要用到this
这个this本来被期望指向document,当getElementById方法作为document对象的属性被调用时,方法内部的this
确实是指向document的

但当用getId来引用document.getElementById之后,再调用getId,此时就成来普通函数调用,函数内部this
指向来window,而不是原来的document.

但,我们可以尝试利用apply把document当作this传入getId函数,帮助修正this:

    document.getElementById = (function(func){
            return function (){
                return func.apply(document,arguments);
            }
    })(document.getElementById);
    var getId = document.getElementById;
    var div = getId('div1');
    console.log(div.id);