javascript this

本文深入探讨JavaScript中this关键字的指向规则,包括普通函数、箭头函数、对象方法及延迟函数中的表现,揭示this绑定机制及其在不同上下文中的行为。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

this是关键字,this指向了当前代码运行时的对象,比如说:

 以下代码是我自己理解,有错请指出,谢谢

 var name = 'Chen'
    var person = { 
        name : 'Kris', 
        age: '27',
        greeting: function() { 
            console.log(this.name + '' + this.age); 
        }
    }
    var person1 = {
      name: 'Kris',
      greeting: ()=> {
        console.log(this) 
        console.log(this.name)
      },
      greeting2: function () {
        console.log(this)
        console.log(this.name)
      }
    }
    function Person () {
      this.name = 'Kris'
      setTimeout(() => {
        console.log(this.name)
      },200)
    }
    function PersonS () {
      this.name = 'Kris'
      setTimeout(function () {
        console.log(this.name)
      },200)
    }

    person.greeting() //Kris 27
    var a = person.greeting
    a() //Chen Undefined
    var a = person
    a.greeting() //kris 27
    console.log('PERSON1 Greeting')
    person1.greeting() //Chen window
    console.log('PERSON1 Greeting2')
    person1.greeting2()  //Kris
    var b = person1.greeting
    console.log('PERSON1 Greetingb')
    b() //Chen window
    var d = person1.greeting2
    console.log('PERSON1 Greeting2b')
    d() //window Chen
    var c = person1
    c.greeting() //Chen window
    var Person1 = new Person() //Kris
    var Person2 = new PersonS() //Chen

从以上的代码可以看出,在没有使用setTimeout延迟函数的时候,this指向调用它那个函数的对象。比如说person.greeting()这个是用person调用的greeting,所以输出Kris,但是如果像接下来的先将person.greeting传值给a,再执行a(),那么这个就是window的调用,所以会输出全局的“Chen”。

再看person1,方法的箭头函数this指向全局window对象,而普通函数则指向调用它的对象

箭头函数的this是在定义函数时绑定的,不是在执行过程中绑定的。简单的说,函数在定义时,this就继承了定义函数的对象。

延迟函数,不使用箭头函数的时候,this指向Window.

如有错误,请指出,我修改。谢谢各位。

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值