javascript中this在不同场景中的指向问题

参考网址: https://www.jianshu.com/p/5f8440535a2a

  • 匿名函数中的this指向全局对象
    var a = 10;
    var foo = {
        a: 20,
        fn: (function(){
            console.log(this); // window
            console.log(this.a); // 10
        })()
    }
  • setInterval和setTimeout定时器中的this指向全局对象
    var a = 10;
    var oTimer1 = setInterval(function(){
        var a = 20;
        console.log(this.a); // 10
        clearInterval(oTimer1);
    },100);
  • eval中的this指向调用上下文中的this
    (function(){
        eval("console.log(this)"); // Window
    })();
    function Foo(){
        this.bar = function(){
            eval("console.log(this)"); // Foo
        }
    }
    var foo = new Foo();
    foo.bar();
  • apply和call中的this指向参数中的对象
    var a = 10;
    var foo = {
        a: 20,
        fn: function(){
            console.log(this.a);
        }
    };
    var bar ={
        a: 30
    }
    foo.fn.apply();//10(若参数为空,默认指向全局对象)
    foo.fn.apply(foo);//20
    foo.fn.apply(bar);//30
  • new绑定,构造函数中的this指向
    function setNum(num){
        this.num= num;
    }
    var newObj = new setNum(10);
    console.log('Hello,', newObj.num);
  • 箭头函数中的this继承的是外层代码块的this
    var obj = {
        hi: function(){
            console.log(this);
            return ()=>{
                console.log(this);
            }
        },
        sayHi: function(){
            return function() {
                console.log(this);
                return ()=>{
                    console.log(this);
                }
            }
        },
        say: ()=>{
            console.log(this);
        }
    }
    let hi = obj.hi();  // 输出 obj 对象
    hi();               // 输出 obj 对象
    let sayHi = obj.sayHi();
    let fun1 = sayHi(); // 输出 window
    fun1();             // 输出 window
    obj.say();          // 输出 window
    

      

posted @ 2019-04-03 10:10  大豆F4  阅读(663)  评论(0编辑  收藏  举报