this

作者: memelook | 来源:发表于2017-12-11 22:31 被阅读6次

    this的指向

    1.作为对象的方法调用

    当函数作为对象的方法被调用时,this指向该对象

    var obj = {
        a: 1,
        getA: function(){
            console.log(this === obj);
            console.log(this.a);
        }
    };
    
    obj.getA();
    

    2.作为普通函数调用

    当函数不作为对象的属性被调用时,也就是普通的函数方式,此时this总是指向全局对象-window

    name = 'globalName';
    
    var getName = function(){
        return this.name;
    };
    console.log(getName()); //globalName
    
    
    
    var myObject = {
        name: 'seven',
        getName: function(){
            return this.name;
        }
    };
    
    var getName = myObject.getName;
    console.log(getName()); //globalName
    console.log(myObject.getName()); //seven
    

    有时候局部callback方法被作为普通函数调用时,cb内部的this是指向window的,但想要指向外部对象的时候怎么办呢?

    name = 'globalName';
    
    var person = function(){
        this.name = 'tom';
        var _this = this;
        var callback1 = function(){
            console.log(this.name);
        }
        var callback2 = function(){
            console.log(_this.name);
        }
        callback1();              //globalName 
        callback2();                //tom
        callback1.call(this); //tom
    }
    
    var p = new person();
    

    在ES6下,使用strict模式,这个时候this就不会指向window,而是undefined

    function func(){
        "use strict"
        alert(this); //undefined
    }
    

    3.构造器调用

    当用new运算符调用函数时,该函数总会返回一个对象,通常情况下,构造器里的this旧治乡返回的这个对象

    var MyClass = function(){
        this.name = 'seven';
    };
    var obj = new MyClass();
    alert(obj.name);  //'seven'
    

    当时如果返回的是一个对象,那么此次结果最终会返回这个对象,而不是this

    var MyClass = function(){
        this.name = 'seven';
        return {
            name: 'anne'
        }
    };
    var obj = new MyClass();
    alert(obj.name);  //'anne'
    

    如果返回不是一个对象,那么不会收到影响,还是返回this

    var MyClass = function(){
        this.name = 'seven';
        return 'anne';
    };
    var obj = new MyClass();
    alert(obj.name);  //'seven'
    

    this的丢失

    var obj = {
        myname: 'seven',
        getName: function(){
            return this.myname;
        }
    }
    
    console.log(obj.getName()); // 'seven'
    
    var getName2 = obj.getName;
    console.log(getName2()) // undefined
    

    1).getName1是通过对象调用,所以this指向对象
    2).getName2是通过函数调用,所以this指向window

    相关文章

      网友评论

          本文标题:this

          本文链接:https://www.haomeiwen.com/subject/mpgwixtx.html