【JS】this 指向介绍(箭头函数)

这篇博客详细介绍了JavaScript中的this指向问题,包括全局环境、函数直接调用、对象内部方法、原型链、构造函数、call和apply、bind方法、DOM事件处理函数、setTimeout和setInterval以及箭头函数中的this行为。强调了this的指向取决于调用方式和上下文,并提供了多个示例进行说明。
摘要由CSDN通过智能技术生成

目录

全局环境下

函数直接调用

对象中的this对象内部方法的this指向调用这些方法的对象,

 原型链中this

构造函数中this

call & apply

bind 方法

DOM 事件处理函数中的 this & 内联事件中的 this

setTimeout & setInterval

箭头函数中的 this


在普通函数中, this 指向调用其所在函数的对象,而且是离谁近就是指向谁(此对于常规对象,原型链, getter & setter等都适用);构造函数下,this与被创建的新对象绑定;DOM事件,this指向触发事件的元素;内联事件分两种情况,bind绑定, call & apply 方法等。

全局环境下

在全局环境下,this 始终指向全局对象(window), 无论是否严格模式

console.log(this.document === document); // true

// 在浏览器中,全局对象为 window 对象:
console.log(this === window); // true

this.a = 37;
console.log(window.a); // 37

函数直接调用

普通函数内部的this分两种情况,严格模式和非严格模式。

非严格模式下,this 默认指向全局对象window

function f1(){
  return this;
}

f1() === window; // true

而严格模式下, this为undefined

function f2(){
  "use strict"; // 这里是严格模式
  return this;
}

f2() === undefined; // true

1、对象中的this对象内部方法的this指向调用这些方法的对象,

  1. 函数的定义位置不影响其this指向,this指向只和调用函数的对象有关。
  2. 多层嵌套的对象,内部方法的this指向离被调用函数最近的对象(window也是对象,其内部对象调用方法的this指向内部对象, 而非window)。
//1
var o = {
  prop: 37,
  f: 
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

阿昊在

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值