作家
登录

JavaScript中this的运行机制及爬坑指南

作者: 来源: 2018-03-16 08:43:31 阅读 我要评论

 
  • var savedThis;  
  • function Constr() {  
  •     savedThis = eval('this');  
  •  
  • var inst = new Constr();  
  • console.log(savedThis === inst); // true   
  •  
  • // 办法  
  • var obj = {  
  •     method: function () {  
  •         console.log(eval('this') === obj); // true  
  •     }  
  •  
  • obj.method(); 
  • 有三个你须要知道的与this相干的陷阱。请留意,在各类情况下,严格模式更安然,因为this在通俗函数中为undefined,并且会在出现问题时警告。

    陷阱:忘记new操作符

    如不雅你调用一个构造函数时忘记了new操作符,那么你不测埠将this用在一个通俗的函数。this会没有精确的值。 在非严格模式下,this指向window对象,你将创建全局变量:

    1. function Point(x, y) {  
    2.     this.x = x;  
    3.     this.y = y;  
    4.  
    5. var p = Point(7, 5); // 忘记new!  
    6. console.log(p === undefined); // true   
    7.  
    8. // 创建了全局变量:  
    9. console.log(x); // 7  
    10. console.log(y); // 5  
    11. 荣幸的是,在严格模式下会获得警告(this === undefined):  
    12. function Point(x, y) {  
    13.     'use strict' 
    14.     this.x = x;  
    15.     this.y = y;  
    16.  
    17. var p = Point(7, 5);  
    18. // TypeError: Cannot set property 'x' of undefined 

    陷阱:不精确地提取办法

    如不雅获取办法的值(不是调用它),则可以将该办法转换为函数。 调用该值将导致函数调用,而不是办法调用。 当将办法作为函数或办法调用的参数传递时,可能会产生这种提取。 实际例子包含setTimeout()和事宜注册处理法度榜样。 我将应用函数callItt() 来模仿此用例:

    1. /**类似setTimeout() 和 setImmediate() */  
    2. function callIt(func) {  
    3.     func();  

    如不雅在非严格模式下把一个办法作为函数来调用,那么this将指向全局对象并创建全局变量:

    1. var counter = { 
    2.     

        推荐阅读

        重磅消息:微软 Service Fabric 正式开源

      有奖调研 | 人脸辨认功能在互联网行业认知度情况经由过程应用法度榜样级其余感知和洞察,为微办事带来编排和主动化的优势 微软的 Azure Service Fabric 的官方博客在2017.3.2>>>详细阅读


      本文标题:JavaScript中this的运行机制及爬坑指南

      地址:http://www.17bianji.com/lsqh/40750.html

    关键词: 探索发现

    乐购科技部分新闻及文章转载自互联网,供读者交流和学习,若有涉及作者版权等问题请及时与我们联系,以便更正、删除或按规定办理。感谢所有提供资讯的网站,欢迎各类媒体与乐购科技进行文章共享合作。

    网友点评
    自媒体专栏

    评论

    热度

    精彩导读
    栏目ID=71的表不存在(操作类型=0)