JavaScript回顾学习：“如何确定this”的3条经验（屡试不爽）

水深无声 2022-05-20 04:07 135阅读 0赞

今天偶然看到一个视频教程，视频中讲授如何确定this的三条方法（讲师经过多年总结出来的经验），让我茅塞顿开，解开了心中一直的痛点，很是受用。下面我特意记录下，以备用和学习。

3条方法如下：

1、元素绑定事件，方法中的this是当前操作的元素

2、方法名前面是否有点，有点，点前面是谁，this就是谁，如果没有，this是window（严格模式下是undefined）

3、构造函数执行，方法中的this是当前类的一个实例

先从一个面试题开始，以下面试题将会输出什么值：

一开始拿到这个题目， 我都晕菜了，以为都是输出的javascript。

上述3个方法中第2条方法验证上述面试题：

（1）obj.prop.getFullName() ： getFullName()方法前面有点，点前面是obj.prop，this就是obj.prop，则this.fullName 等价于obj.prop.fullName，所以obj.prop.fullName 是undefined，结果是undefined

（2）test()：test()方法前面没有点，非严格模式下，this就是window，则this.fullName等价于window.fullName， 所以window.fullName是language，结果是language

再来一道面试题：

还是套用第2种方法，结果是window，在浏览器中验证后果然是window。

分析过程：

（1）wait()方法前面有点，点前面是Tom，this就是Tom，那么this.show等价于Tom.show，var fun = this.show;等价于var fun = Tom.show; fun就是指向Tom.show方法

（2） fun()方法前面没有点，this就是window，那么this.name等价于window.name， 所以window.name值就是window

这3个方法方便又受用，严重收藏！！

视频教程地址： https://www.bilibili.com/video/av24383268/?p=9

JavaScript回顾学习：“如何确定this”的3条经验（屡试不爽）

发表评论取消回复

还没有评论，来说两句吧...

相关阅读

相关 JavaScript回顾学习：数据类型

相关前端开发经验：当初我是如何学习JavaScript

相关 JavaScript学习总结——this对象

相关 javascript this 关键字学习

相关 javascript中的this的学习总结

相关如何确定this指向？

相关 JavaScript回顾学习：“如何确定this”的3条经验（屡试不爽）

相关 JavaScript回顾学习：基本知识

相关 JavaScript回顾学习：常用的惰性函数

相关 JavaScript回顾学习：元素的client\offset\scrollHeight