判断this指向问题

最新推荐文章于 2024-10-10 10:50:43 发布

有趣的小良

最新推荐文章于 2024-10-10 10:50:43 发布

阅读量65

点赞数

分类专栏： JS基础文章标签： javascript 大前端 vue react

本文链接：https://blog.csdn.net/Wustfish/article/details/129184043

版权

JS基础专栏收录该内容

19 篇文章 0 订阅

订阅专栏

本文讨论了JavaScript中this的关键概念，指出this的指向取决于其调用方式。函数调用时，this通常指向全局对象（在浏览器中是window），而在方法调用中，this指向前对象。箭头函数的this保持不变，始终指向定义时的作用域。构造函数中的this则指向新创建的实例。此外，介绍了bind、call、apply等方法用于改变this的指向。

摘要由CSDN通过智能技术生成

判断this指向

判断this指向问题，如果在面试中出现是很简单但是很多人容易答错的问题，因为很多人回答的不完全
this是浏览器传过来的，不是固定的，可以根据调用者改变；
this指向如果是以函数形式调用this指向的是window。以方法的形式调用，this指向的是方法本身

对于箭头函数：箭头函数的this指向不能改变，指向的是箭头函数作用域所用的对象

对于构造函数：构造函数中的this指向实例，构造函数中的this指向构造函数下创建的实例

改变this指向的方法
bind 
call
apply
new 
return

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

有趣的小良

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

如何判断this指向问题以及普通函数和箭头函数的this区别

qq_41968486的博客

12-21

747

this是前端面试中必考的基础知识点。但其实this不难理解。判断this指向时，记住以下几点：判断函数类型， 1.1 如果是箭头函数，则为第一个包裹箭头函数的普通函数的this指向 1.2 如果不是箭头函数，但是使用了bind,call,apply等改变this的方法，this被重新绑定为bind/call/apply函数的第一个参数如果是普通函数，并且没有绑定this 2.1 如果是new的方式调用，this被绑定到实例上 2.2 如果被调用，谁调用便指向谁 2.3 如果直接执行，this指向w

【面试必考点】这一次带你彻底学会this的指向问题

m0_57524265的博客

07-10

3976

本文重点讲解了各种this的使用场景、如何改变函数中this的指向以及this的练习题这一次和笔者一起全面的学习this这个面试必考点

参与评论您还未登录，请先登录后发表或查看评论

Vue中this指向问题

webDevelopSnail的博客

10-31

1460

一、methods中this 1.通常methods属性中的回调函数的this都会指向vue实例 //第一种写法： var vm = new Vue({ el:'app', data:{ name:'', list:[], }, methods:{ handle :function(){ // this.list.push

javascript中判断This指向的方法

Coder小何

04-21

839

最近在读《你不知道的JavaScript》上卷，看到了关于this的相关文章，发现在日常学习的时候自己对this 的理解真的很匮乏，读完书才发现其实this内部有一套属于自己的绑定规则。前置知识：调用位置在学习this 的绑定规则之前，首先要理解一个概念就是调用位置。从字面上理解的就是指函数被调用的位置，但是如果遇到函数嵌套调用比较深或者某些编程模式隐藏了真正的调用位置就没有办法判断真正的调用位置了。那么这个时候就要靠调用栈来判断判断如下函数： function foo () { cons

全面解析this指向问题！

angula

05-07

8766

this是一种特别复杂得机制，是一个很特别得关键字，被自动定义在所有函数得作用域中，所以我们有必要去了解，并且搞懂它！文章目录调用位置绑定规则一、默认绑定严格模式二、隐式绑定隐式丢失三、显示绑定硬绑定API调用的“上下文”四、new绑定箭头函数中的this指向判断this的优先级调用位置在理解this得绑定过程之前，首先要理解调用位置：调用位置就说函数在代码中被调用得位置（注意：不是声...

JavaScript中this指向问题

m0_72752380的博客

10-28

1122

箭头函数本身没有this，箭头函数中的this与上级作用域中的this相同。函数还可以作为某个对象的方法调用，这时this就指向这个调用函数的对象。bind方法会将函数的this，永久捆绑在指定的对象上，不能改变。在let中声明的箭头函数，存储在脚本作用域中，

教你如何判断this指向谁

m0_45896721的博客

08-16

1429

JavaScript 对于我们刚学习函数的菜鸟来说，this的指向经常让我们头晕目眩。是一个难点。今天小编就把自己学习过程中判断this指向的方法分享给大家。首先我们要记住，this指向当前执行环境的对象。同一个函数中的this的取值跟调用方法有关，调用方法不同this可能就不同。其次，判断技巧就是：如果使用括号调用，查看括号前面是不是函数，如果是，继续查看函数前有没有点，如果有点，this为点前面的变量。如果是使用函数名.call(this，实参列表)或函数名.apply(this，实参数组)进行

如何正确判断this的指向

qq_35430000的博客

07-18

1237

转载自：https://juejin.im/post/5d124a12f265da1b9163a28d 如果用一句话说明 this 的指向，那么即是: 谁调用它，this 就指向谁。但是仅通过这句话，我们很多时候并不能准确判断 this 的指向。因此我们需要借助一些规则去帮助自己： this 的指向可以按照以下顺序判断: 全局环境中的 this 浏览器环境：无论是否在严格模式下，在全局...

如何正确判断this的指向问题

xiaoHelloWord的博客

06-28

856

如果去用一句话去说明this指向问题，那么既是：谁调用它那么this就指向谁。但是仅通过这句话，我们很多时候并不能准确判断this指向。因此我们需要一些规则去帮助自己去判断：浏览器环境：无论是否在严格模式下，在全局执行环境中，this都指向全局对象window; 是否是new绑定：如果是new绑定，并且构造函数中没有返回function或者是object，那么this指向的这个新对象。函数...

彻底理解JavaScript中this指向

猫老板的豆

11-09

1449

如果要判断一个运行中函数的 this 绑定，就需要找到这个函数的直接调用位置。找到之后new 调用：绑定到新创建的对象，注意：显示return函数或对象，返回值不是新创建的对象，而是显式返回的函数或对象。call、apply、bind调用：严格模式下，绑定到指定的第一个参数。非严格模式下，null和undefined，指向全局对象（浏览器中是window），其余值指向被new Object()包装的对象。对象上的函数调用：绑定到那个对象。普通函数调用。

javascript中this指向详解

10-22

为了让读者更加深入地理解JavaScript中的this指向问题，本文将会详细分析this在不同场景下的行为，并通过实际代码示例来说明。首先，JavaScript中的this不同于一些其他面向对象编程语言（如Java或C#）中的this。在...

详解JavaScript中this的指向问题

10-20

JavaScript中的this关键字是用来引用函数执行时的上下文对象，它是JavaScript中的一个核心概念，通常取决于函数的调用方式。...理解this指向问题的关键在于理解函数被调用的方式，以及它与外部作用域的相互关系。

用最简单的方法判断JavaScript中this的指向(推荐)

12-08

JavaScript中的`this`关键字是语言中的一个核心特性，它的指向在不同上下文中会有所变化，导致许多初学者感到困惑。...通过实践和理解这些基本规则，我们可以更好地应对各种复杂的`this`指向问题。

【JAVA开源】基于Vue和SpringBoot的高校学科竞赛平台

杨荧的CSDN博客

10-10

1006

教师功能有个人中心，题目类型管理，竞赛题库管理，竞赛类型管理，竞赛信息管理，报名信息管理，竞赛评分管理，参赛名单管理，晋级名单管理，获奖名单管理，竞赛总结管理，报销清单管理，成绩申诉管理，参赛信息管理，参赛信息管理，往年成绩管理，获奖情况管理。

React中的refs是什么？

最新发布

Front end development engineer

10-10

240

React 的众多优点之一是它抽象了处理真实 DOM 的复杂性。现在，我们无需手动查询元素、绞尽脑汁思考如何为这些元素添加类又或者是添加样式等，也无需为浏览器兼容性而苦恼，只需编写组件并专注于用户体验即可。然而，仍然有一些情况（虽然很少！）我们需要访问实际的 DOM。而当涉及到实际的 DOM 时，最重要的是要理解并学习如何正确使用 ref 以及 ref 周围的一切。

解释器、预处理、main函数

编程语言技巧经验分享

10-07

1240

解释器覆盖范围很广，不管是解释语言的运行时解释翻译器，还是操作系统自带脚本的解释器。

Vue根实例、实例总结

m0_54007573的博客

10-04

689

Vue根实例、实例总结

vue-live2d看板娘集成方案设计使用教程

每个人都是独一无二的，把握好自己的节奏，跟着自己的心走。

10-05

1493

vue-live2d看板娘集成方案设计使用教程

javascript中==和===有什么不同

qq_48763502的博客

10-09

400

这个运算符用于比较两个值是否相等，但会在必要时进行类型转换。当两个值的类型不同，JavaScript 会尝试将它们转换为相同的类型，然后再进行比较。

this指向问题，js中this的理解

05-12

在 JavaScript 中，`this` 关键字用于引用当前代码执行上下文中的对象。它指向当前函数被调用时的上下文对象，具体的取值方式根据调用方式的不同而不同。 - 在函数中，如果函数是作为方法调用，那么 `this` 指向这个方法所属的对象； - 如果函数是独立调用的，那么 `this` 指向全局对象 `window`； - 如果函数是通过 `call`、`apply` 或 `bind` 方法调用的，那么 `this` 指向这些方法的第一个参数所指定的对象； - 如果函数是通过箭头函数定义的，那么 `this` 的值继承自其父执行上下文。例如： ``` const obj = { name: 'Alice', sayHi() { console.log(`Hi, I'm ${this.name}`); } }; obj.sayHi(); // Hi, I'm Alice const hello = obj.sayHi; hello(); // Hi, I'm undefined const obj2 = { name: 'Bob' }; obj.sayHi.call(obj2); // Hi, I'm Bob const func = () => { console.log(this); }; func(); // window ``` 需要注意的是，`this` 在不同的上下文中可能会有不同的值，要根据具体的情况来判断 `this` 的值。