JS中的this指向?

作者: yaolei72 | 来源:发表于2017-12-08 19:39 被阅读19次

    1.背景介绍

    在javaScript中,this是动态绑定的,它可以是全局对象、当前对象或者任意对象,这完全取决于函数的调用方式。这就导致了this具备了多重含义,可以使得this可以更灵活地使用。但是,带来了灵活性的同时也会给我们初学者带来不少困惑。

    2.知识剖析

    报错。

    在javaScript中,不一定只有对象方法的上下文中才有this, 全局函数调用和其他的几种不同的上下文中也有this指代。 它可以是全局对象、当前对象或者任意对象,这完全取决于函数的调用方式。JavaScript 中函数的调用有以下几种方式:作为对象方法调用,作为函数调用,作为构造函数调用,和使用 apply 或 call 调用。

    1.作为对象方法调用:this指向该对象本身

    2.作为函数调用:this指向全局对象

    3.作为构造函数调用:this 绑定到新创建的对象上

    4.使用 apply 或 call 调用:当使用apply和call时,表示把一个函数表达式放入call或apply括号后面的第一个参数的环境中,this则指向这个参数;两者不同的地方在于apply第二个参数必须是个数组。

    3、常见问题

    现象:两次打印的this不一样

    现象:加了严格模式,this仍然指向了window

    setTimeout()其实全名为window.setTimeout(),是window下面的一个方法,不管是否是严格模式,指向的都是window。

    4、解决方案

    1.将this赋给一个变量,然后通过闭包来访问这个变量来打印出我们想要的值。

    2.使用bind()将执行环境放到obj这个对象中去,可以用this代替。

    3.使用ES6中的箭头函数。

    5、编码实战

    2,4,8,8 return后是对象时this指向该对象 指向新对象 指向新对象

    6.扩展思考

    问题:如何理解this?

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

    2.当函数作为单独函数调用时,this指向全局对象(严格模式时,为undefined)

    3.构造函数中的this指向新创建的对象

    4.嵌套函数中的this不会继承上层函数的this,可以用前面讲过的三种方法来使this指向宿主对象。

    7.参考文献

    参考一:深入浅出 JavaScript 中的 this

    参考二:JavaScript 中的 this !

    参考三:JavaScript中的this用法与指向

    参考四:如何理解 JavaScript 中的 this 关键字?

    8、更多讨论

    问题1:this默认场景?

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

    2.当函数作为单独函数调用时,this指向全局对象(严格模式时,为undefined)

    3.构造函数中的this指向新创建的对象

    4.嵌套函数中的this不会继承上层函数的this,可以用前面讲过的三种方法来使this指向宿主对象。

    问题2:常见的this场景?

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

    2.当函数作为单独函数调用时,this指向全局对象(严格模式时,为undefined)

    3.构造函数中的this指向新创建的对象

    4.嵌套函数中的this不会继承上层函数的this,可以用前面讲过的三种方法来使this指向宿主对象。

    问题3:geiTimeout函数?

    getTimeout函数全名window.getTimeout,是window下面的一个方法,所以不管是不是严格模式,this都指向window。

    相关文章

      网友评论

        本文标题:JS中的this指向?

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