抱歉,你查看的文章已删除

【转】js中this用法

javascript中的this

译:理解并掌握 JavaScript 中 this 的用法

关键

只有一个对象调用了包含this函数时,this才被赋值,并且所赋的值只依赖于调用了包含this函数的对象

使用原则

  1. this永远指向一个对象,并且拥有着个对象的值
  2. 在严格模式下,在全局作用域中和匿名函数中,this指向undefined
  3. this在一个函数内出现的时候,this指向调用这个函数的对象

易错场景

  1. 包含this的方法被当作回调函数 $("button").click(callback); 期待this指向:包含该方法的对象 实际this指向:调用了回调函数的对象 解决办法:bind
  2. this出现在闭包内 ... example: function(){ [1,2,3,4].forEach(function(item){ this.test(item) }) } ... 期待this指向:外层函数的this指向 实际this指向:undefined或者全局对象 解决办法:使用另外一个变量保存this
  3. 把包含this的方法赋给一个变量 var user = { name: 'hhh', sayName: function(){ console.log(this.name); } } var test = user.sayName; test();// 全局变量的this 期待this指向:包含该方法的对象 实际this指向:包含该变量的对象 解决办法:bind
  4. 借用包含this的方法
    var user1 = {
        name: 'hhh',
        sayName: function(){
            console.log(this.name);
        }
    }    
    var user2 = {
        name: 'ggg'
    }
    user2.ggg = user1.sayName();//

期待`this`指向:借用`this`方法的对象

实际`this`指向:包含该`this`方法的对象

解决办法:`apply`

this的使用是一个经常容易出错的地方,但是只要把握一个原则,即

this总是指向调用包含this的方法的对象

版权声明

本文资源来源互联网,仅供学习研究使用,版权归该资源的合法拥有者所有,

本文仅用于学习、研究和交流目的。转载请注明出处、完整链接以及原作者。

原作者若认为本站侵犯了您的版权,请联系我们,我们会立即删除!

原文标题

【转】js中this用法

原文链接

https://segmentfault.com/a/1190000004986355

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 冬天到了,分享两款雪花特效代码

    小小鱼儿小小林
  • JavaScript 数据结构:栈和队列

    上周小编已经介绍了什么是数据结构,没看过的同学,可以点击《JavaScript 数据结构:什么是数据结构》,今天小编会和大家一起学习栈和队列。

    前端达人
  • node.js + postgres 从注入到Getshell

    (最近你们可能会看到我发很多陈年漏洞的分析,其实这些漏洞刚出来我就想写,不过是没时间,拖延拖延,但该做的事迟早要做的,共勉)

    phith0n
  • Flutter组件学习(三)—— 输入框TextFiled

    Google 前两天发布了 Flutter 1.0 正式版本,正式版发布之后,LZ身边越来越多的人都开始入坑了,不得不说 Flutter 框架的魅力还是很吸引人...

    用户2802329
  • JS回调函数中的 this 指向(详细)

    1. obj.fun() fun 中的 this->obj ,自动指向.前的对象

    TimothyJia
  • 数据量庞大的分页穿梭框实现

    但是第二个分页的 demo 没有,在上一家公司匆匆解决后,没有写入自己的 GitHub,有点可惜...

    Krry
  • 寿司开卖:实现寿司制作特效和音响特效

    本节我们将继续上一节完成若干个小功能。首先要完成的是,当客户动画在主页面出现时,它左上角会冒泡,显示它想购买何种寿司,此时玩家可以点击左下角面板中各种元素,组合...

    望月从良

扫码关注云+社区

领取腾讯云代金券