#this!

作者: Amuer蘃 | 来源:发表于2019-11-03 18:49 被阅读0次
    什么是this?

    很多高级编程语言都给新创建的对象分配一个引用自身的指针,比如JAVA、C++中的this指针,python中的self,JavaScript也有this指针,虽然它的指向可能相对复杂些,但是this指向的,永远只可能是对象

    一、在一般函数方法中使用 this 指代全局对象。
    function test(){
       this.x = 1
      console.log(this.x)
    }
    test()  // 1
    
    二、作为对象方法调用,this 指代上级对象,数组同理、
    var obj = {
        name:"obj",
        func1 : function() {
            console.log(this)
        }
    }
    obj.func1()  // this--->obj;
    
    document.getElementById("div").onclick = function(){
       console.log(this)
    }; // this--->div
    
    三、函数作为window内置函数的回调函数调用:this指向window对象(setInterval、setTimeout 等)
    setInterval(function(){
      console.log(this)//window
    }, 300)
    
    四、作为构造函数调用,this 指代 new 实例化的对象
    function test(){
      this.x = 1
    }
    var o = new test()
    alert(o.x)  // 1
    
    五、apply、call、bind改变函数的调用对象,此方法的第一个参数为改变后调用这个函数的对象
    var x = 0;
    function test(){
      console.log(this.x)
    }
    var obj = {}
    obj.x = 1
    obj.m = test
    obj.m.apply() //0,apply()的参数为空时,默认调用全局对象
    obj.m.apply(obj); //1
    
    六、匿名函数的执行环境具有全局性,this对象通常指向window对象
    var obj = {
        name: 'My obj',
        getName: function() {
            return function() {
                console.log(this.name);
            };
        }
    };
    
    obj.getName()(); // 'The Window'
    

    this面试题、

    var x = 3;
    var y = 4;
    var obj = {
        x: 1,
        y: 6,
        getX: function() {
            var x =5;
            return function() {
                return this.x;
            }();
        },
        getY: function() {
            var y =7;
             return this.y;
        }
    }
    console.log(obj.getX())//3
    console.log(obj.getY())//6
    
    var name="the window";
    
     var object={
        name:"My Object", 
        getName:function(){ 
           return this.name;
       } 
     }
    
     object.getName();   //"My Object"
    
    (object.getName)();   //"My Object"
    
    (object.getName=object.getName)();   //"the window",函数赋值会改变内部this的指向,这也是为什么需要在 React 类组件中为事件处理程序绑定this的原因;
    
    var a=10; 
     var obt={ 
       a:20, 
       fn:function(){ 
         var a=30; 
         console.log(this.a)
       } 
     }
     obt.fn();  // 20
    
     obt.fn.call(); // 10
    
     (obt.fn)(); // 20
    
     (obt.fn,obt.fn)(); // 10
    
     new obt.fn(); // undefined
    
    function a(xx){
      this.x = xx;
      return this
    };
    var x = a(5);
    var y = a(6);
    
    console.log(x.x)  // undefined
    console.log(y.x)  // 6
    

    相关文章

      网友评论

          本文标题:#this!

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