资讯专栏INFORMATION COLUMN

【转】js中this用法

Render / 1338人阅读

摘要:中的译理解并掌握中的用法关键只有一个对象调用了包含函数时,才被赋值,并且所赋的值只依赖于调用了包含函数的对象使用原则永远指向一个对象,并且拥有着个对象的值在严格模式下,在全局作用域中和匿名函数中,指向当在一个函数内出现的时候,指向调用这个函

javascript中的this

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

关键

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

使用原则

this永远指向一个对象,并且拥有着个对象的值

在严格模式下,在全局作用域中和匿名函数中,this指向undefined

this在一个函数内出现的时候,this指向调用这个函数的对象

易错场景

包含this的方法被当作回调函数

    $("button").click(callback);

期待this指向:包含该方法的对象

实际this指向:调用了回调函数的对象

解决办法:bind

this出现在闭包内

   
       ...
    example: function(){
        [1,2,3,4].forEach(function(item){
           this.test(item)
       })
   }
       ...

期待this指向:外层函数的this指向

实际this指向:undefined或者全局对象

解决办法:使用另外一个变量保存this

把包含this的方法赋给一个变量

   var user = {
       name: "hhh",
       sayName: function(){
           console.log(this.name);
       }
   }
   var test = user.sayName;
   test();//  全局变量的this

期待this指向:包含该方法的对象

实际this指向:包含该变量的对象

解决办法:bind

借用包含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的方法的对象

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/79268.html

相关文章

  • JS学习数组Array方法集合

    摘要:标准用法,作用数组元素颠倒位置,传参无返回值颠倒后的数组。,传参指定一个字符串来分隔数组的每个元素选返回值一个所有数组元素连接的字符串标准用法的值变为的值变为作用并两个或多个数组。 1.Array数组的方法 Mutator方法————突变方法会改变数组自身的值; Accessor方法————访问方法不会改变数组自身的值; Iteration方法————遍历的方法 ; 2.Mu...

    Object 评论0 收藏0
  • VUE使用踩过的坑

    摘要:前言如今可谓是一匹黑马数已居第一位前端开发对于的使用已经越来越多,它的优点就不做介绍了本篇是我对使用过程中以及对一些社区朋友提问我的问题中做的一些总结帮助大家踩坑。随后的重新渲染,元素组件及其所有的子节点将被视为静态内容并跳过。 前言 vue如今可谓是一匹黑马,github star数已居第一位!前端开发对于vue的使用已经越来越多,它的优点就不做介绍了,本篇是我对vue使用过程中以及...

    big_cat 评论0 收藏0
  • jQuery$()函数的7种用法汇总

    摘要:前言对象是一个类数组的对象,含有连续的整形属性以及一系列的方法。它把所有的操作都包装在一个函数中,形成了统一也是惟一的操作入口。从而避免重复创建对象。 前言 jQuery对象是一个类数组的对象,含有连续的整形属性以及一系列的jQuery方法。它把所有的操作都包装在一个jQuery()函数中,形成了统一(也是惟一)的操作入口。其中我们用的非常频繁的一个函数是$()或者说是jQuery()...

    calx 评论0 收藏0
  • 进击的 JavaScript(一) 之 类型

    摘要:实际上,我们通常认为是自有类型的唯一成员。比较运算符的操作数可能是任意类型。结果只有,例得到操作值等价的布尔值真值为,假值为等同于,经常称为强制转换。结果返回布尔值的用法是中唯一一个不等于任何值的包括它自己。 说起 js 类型转换,都是头疼吧,晕晕的,但是不行啊,这东西很重要滴! 基础知识 JavaScript的数据类型分为六种,分别为null, undefined, boolean,...

    Scholer 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<