this指向

来源:互联网 发布:剪羊毛知乎 编辑:程序博客网 时间:2024/05/16 11:14

js中的this指向是一个让人迷惑的问题,有时候即便有经验的开发者也会弄错。

1,默认情况下

    function fn(){        console.log(this);    }    fn();//window

函数直接调用的时候非严格模式下this是指向window的。这是js设计的一个bug,在严格模式下,this默认的情况下是指向undefined的。

2,对象调用

    var obj={        key:function(){            console.log(this);        }    };    obj.key();//obj

当函数是一个对象的属性的时候,通过对象调用。这是函数中的this指向对象。

3,构造函数中this

当我们通过new调用构造函数的时候,构造函数中的this是指向通过构造函数生成的实例的。

    function Person(name){        this.name=name;        console.log(this);    }    var person1=new Person("qi");//person1

4,箭头函数

ES6提供了箭头函数,其中的this指向箭头函数的外层作用域中的this

    var obj={        fn:function(){            console.log(this);            setIntervalue(()=>(console.log(this)),1000);         }    }

从上面可以看出两个打印的结果是一样的。这是因为箭头函数中是没有this的,所以会随着作用域链,向外查找。箭头函数内部的this和外部的this是一样的。

5,ES7提案

在ES7中有一种提案,就是双冒号语法,但是浏览器是不支持的。但babel编译器已经支持。

    foo::bar;//  等同于    bar.bind(foo);

总结:this的情况大致就是上面的几种。

0 0