当前位置: 首页 > article >正文

this指向问题

解题思路

  1. 普通函数中,this是它的直接调用者,谁调用,this就指向谁。
  2. 箭头函数,this指向跟外部作用域中this指向是同一个。

面试真题

var a = 1;
function func1(){
	var a = 2;
	console.log(this.a + a)
}
function func2(){
	var a = 10;
	func1();
}
func2()

func2指向的是全局,因此this指向的是全局。

var a = 1;
var obj = {
	a: 2,
	func1: function(){
		console.log(this.a);
	},
	func2: () => {
		console.log(this.a);
	},
};
obj.func1();
obj.func2();

1.func1是普通函数,所以谁调用就指向谁,obj.func1相当于就是obj调用func1,所以this指向obj,所以obj.func1()输出的是2。

2.func2是箭头函数,箭头函数的this跟外部作用域的this是一致的。func2外部作用域相当于就是obj的作用域,obj中的this指向就是全局的this,所以此时取到的值就是全局的a,值为1。

const obj = {
	name: "小明",
	say(){
		console.log(`你好!$(this.name)`);
	},
}
const func = obj.say;

obj.say(); // 你好!小明
func(); // 你好!
setTimeout(obj.say, 100); // 你好!
setTimeout(func, 200); // 你好!
setTimeout(function(){
	obj.say(); // 你好!小明
}300);
setTimeout(() => obj.say(), 400); // 你好!小明

解析:

  1. obj.say()直接调用,则是obj调用say,所以this指向obj,则可获取到obj中的name值,故而输出:你好!小明
  2. func ()在全局调用,所以函数中的this指向的是全局,全局没有name值,所以输出:你好!
  3. setTimeout(obj.say, 100)中是把obj.say赋值给setTimeout中的第一个参数,并没有通过obj去调用say函数,所以此时内部的this指向的是全局,故而没有name值,输出结果为:你好!
  4. setTimeout(func, 200)跟3中输出的结果是一样的。都是函数的赋值,并没有真正调用,所以这里的this是setTimeout中的this,setTimeout中的this指向的是全局,故而没有name值,输出结果为:你好!
  5. 在setTimeout内部函数中,调用了obj.say(), 故而此时this指向调用它的对象obj,所以输出:你好!小明
  6. 这里的setTimeout中也是obj.say()直接执行调用了,所以谁调用指向谁,故而这里指向obj,输出结果为:你好!小明

参考资料:【JavaScript面试题】this指向问题


http://www.kler.cn/a/9575.html

相关文章:

  • 软件设计师-信息安全
  • LLMs之PDF:zeroX(一款PDF到Markdown 的视觉模型转换工具)的简介、安装和使用方法、案例应用之详细攻略
  • 什么是 Real-Time Factor (RTF)
  • 项目模块详细说明
  • 手动实现h5移动端点击全屏按钮横屏展示图片,左右滑动切换,处理页面会随着手指滑动问题
  • vite构建的react程序放置图片
  • nginx--基本配置
  • leetcode 917 仅仅反转字母
  • 爱创科技携手“中华老字号”卫岗乳业,携手爱创科技,解码AR营销
  • Linux常见操作命令【二】
  • substr | mysql
  • DNS配置
  • (函数指针) 指向函数的指针
  • cephadm离线部署及curushmap
  • 2023年全国最新保安员精选真题及答案48
  • 打怪升级之FPGA组成原理(LE部分)
  • 关于linux的chnod问题
  • 让代码变得优雅简洁的神器:Java8 Stream流式编程
  • [自注意力神经网络]Segment Anything(SAM)论文阅读
  • 如何避免 MyBatis 查询导致的内存溢出:配置与策略指南
  • Python-代码阅读-图像处理的类 ImageProcess
  • pc端页面嵌入,同源,app无内容,页面空白问题(vite)
  • 微信小程序引入骨架屏
  • pinia的使用以及持久化存储
  • JS中的宏任务与微任务
  • 壁纸保存下