箭头函数中的this

已于 2022-03-22 14:20:08 修改
阅读量214 收藏
点赞数
分类专栏： 面试题 文章标签： 前端
于 2022-03-22 14:10:24 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_49655243/article/details/123659392
版权
本文探讨箭头函数在JavaScript中的使用，重点讲解箭头函数的this绑定规则。箭头函数的this不是在调用时决定，而是继承自其父执行上下文，因此它没有自己的this，并且不能作为构造函数使用。
摘要由CSDN通过智能技术生成

箭头函数的this是在函数定义的时候绑定，this是继承自父执行上下文中的this
箭头函数的this是固定的，没有自己的this
箭头函数不能当作构造函数 ，不能new一个新对象
因为箭头函数没有自己的this，导致内部的this就是外部代码块的this

var x = 11;
var obj = {
   
  x: 22,
  say: () => {
   
    console.log(
最低0.47元/天 解锁文章
renefox
关注
专栏目录
ES6箭头函数和普通函数中this的区别
落羽成舟-博客
03-28 395
定义上的区别 引用自：ES6中箭头函数VS普通函数的this指向 普通函数中的this 总是代表着它的直接调用者，如obj.fn，fn里的最外层this就是指向obj 默认情况下，没有直接调用者，this指向window 严格模式下（设置了’use strict’），this为undefined 当使用call，apply，bind（ES5新增）绑定的，this指向绑定对象 箭头函数中的this 默认指向定义它时，所处上下文的对象的this指向。 即使是call，apply，bind等方法也不能改
箭头函数及其this的指向
qq_53841687的博客
07-13 3844
目录一、箭头函数1、 基础语法 2、箭头函数简写 二、箭头函数的 this1、全局函数下的 this2、对象方法里面的 this3、构造函数的this4、 call()、apply()、bind()调用时的 thisES6中引入了箭头函数。箭头函数允许我们编写更短的函数。 语法：() =>{} // ():函数 =>:必须的语法，指向代码块 {}:代码块 2、箭头函数简写 代码块只有一句话，省略 { } 和 return只有一个参数时，小括号 ( ) 可省略 普通函数 this 跟调用者有关 箭头
箭头函数没有自己的 this，arguments，super或new.target?
前端学习笔记
08-23 1676
箭头函数没有 自己的 this，arguments，super或new.target前言验证结论 前言 最近在看es6-promise代码时，发现了一个很有意思的现象(reject(1,2,3)并不对应catch里面方法的参数)，为了验证这一问题，我使用了以下代码,结果却发现了一个新的问题： new Promise((resolve,reject)=>{ reject(1,2,3) }).then((res)=>{ }).catch((val,val2,val3)=>{ //
箭头函数为什么没有this指向
最新发布
m0_56693499的博客
01-25 625
普通函数即可以被用来创建实例(1)，又可以被调用执行一段指令序列(2)，我们看到一个普通函数也不确定这个函数到底是用来来创建实例还是用来执行一段指令，所以箭头函数设计的初衷就是为了解决函数的二义性（创建实例，执行序列)，为了解决这一问题，ES6引入了Class和箭头函数的概念，Class只能用过new关键字来创建实例，而普通函数只能执行一段指令序列，故箭头函数设计的初衷就是不应被创建实例的，因此它内部不存在this指向。js中一开始函数的设计是有缺陷的，因为一个普通函数可以有两种作用，
this指向问题（箭头函数没有this）
weixin_30243533的博客
08-30 397
全局环境下，指向windows console.log(this.document === document); // true 函数上下文调用 function f1(){ return this; } f1() === window; // true 对象中的this 对象内部方法的this指向调用这些方法的对 象，函数的定义位置不影响其this指向， 1. this指向只...
关于ES6箭头函数中的this问题
11-26
在JavaScript的ES6标准中，箭头函数引入了一个新的特性，即`this`的处理方式与传统的函数有所不同。本文将详细解析箭头函数中的`this`问题，帮助开发者更好地理解和运用这一新特性。 通常，`this`在JavaScript中的...
深入理解Javascript箭头函数中的this
10-20
JavaScript中的箭头函数是ES6引入的一个重要特性，它的出现主要解决了传统函数中`this`指针的问题。在JavaScript中，`this`的值取决于函数的调用方式，而不是定义时的位置，这经常导致开发者在处理`this`时遇到困扰...
JavaScript箭头函数中的this详解
12-10
前言 箭头函数极大地简化了this的取值规则。 普通函数与箭头函数 普通函数指的是用function定义的函数： ...箭头函数没有自己的this值，箭头函数中所使用的this来自于函数作用域链。 这句话很简单，不
JavaScript杂谈(一)——箭头函数没有this
hhhcbw的博客，欢迎各位来访
02-20 1944
每个函数在定义被 ECMAScript 解析器解析时，都会创建两个特殊的变量：this 和 arguments,换句话说，每个函数都有属于自己的 this 对象； <script> window.a = 'windous' window.b = 'bbbbwindous' window.name = 'lisi' //1.块级作用域下不会被创建this；this只有全局对象window和常规函数才会创建 { let a
关于箭头函数中的this的指向
热门推荐
xu4321083的博客
03-30 4万+
普通函数中的this:1. this总是代表它的直接调用者(js的this是执行上下文), 例如 obj.func ,那么func中的this就是obj2.在默认情况(非严格模式下,未使用 'use strict'),没找到直接调用者,则this指的是 window (约定俗成)3.在严格模式下,没有直接调用者的函数中的this是 undefined4.使用call,apply,bind(ES5新...
箭头函数与普通函数区别-箭头函数的this详解
qq_41490913的博客
07-11 183
箭头函数与普通函数区别-箭头函数的this详解
浅谈箭头函数和普通函数this的差异
m0_49793175的博客
05-26 136
先上代码，给鼠标移动绑定了个事件函数，用的是箭头函数，但是在执行的时候崩溃了，没有执行成功，鼠标事件并没有出现预期的效果，我打印当前this的值，居然是window。 为此我特别查了下箭头函数与普通函数到底有啥区别，查了MDN文档，是这么说的，箭头函数时es2015引入的，它不提供自身的 this 绑定，也就是说这个函数本身里是没有this的，它里面的this 的值保持为闭合词法上下文的值，这话的意思是说，它里面的this是当前最近的非箭头函数的this，那么此案例中，距离最近的非箭头函数就是liCl..
ES6的箭头函数this和普通函数的this区别
xiaoqingpang的博客
12-26 5763
普通函数中，内层函数不能从外层函数中继承this的值，在内层函数中，this会是window或者undefined，临时变量self用来将外部的this值导入到内部函数中（另外的方式是在内部函数执行.bind(this)） ES6中的箭头函数会直接调用的this是继承父级的this。 ``swift function fun(){ var self = this; s
深入理解ES6箭头函数里的this，看这篇就够了
刚刚好
02-25 4484
一，了解前须知 1，箭头函数：出现的作用除了让函数的书写变得很简洁，可读性很好外；最大的优点是解决了this执行环境所造成的一些问题。比如：解决了匿名函数this指向的问题（匿名函数的执行环境具有全局性），包括setTimeout和setInterval中使用this所造成的问题。 2，我们常见的window属性和方法有alter，document，parseInt，setTimeout，setI...
箭头函数和普通函数的区别是什么？
weixin_44562686的博客
07-01 724
普通函数this： this总是代表它的直接调用者。 在默认情况下，没找到直接调用者，this指的是window。 在严格模式下，没有直接调用者的函数中的this是undefined。 使用call,apply,bind绑定，this指的是绑定的对象。 箭头函数this： 在使用=>定义函数的时候，this的指向是 定义时所在的对象，而不是使用时所在的对象； 不能够用作构造函数，这就是说，不能够使用new命令，否则就会抛出一个错误； 不能够使用 arguments 对象； 不能使用 yield 命令；
普通函数与箭头函数的this指向的区别
Amelian的博客
12-12 511
直接上一个简单的下配demo来说明问题 1.使用普通函数 需求：实现点击id为box的盒子，让其变色 方式1—使用普通哈函数 可以发现当你没有在外层保留this的指向时，此时setTimeout定时器中的箭头函数的指向时指向window的，那么此时this.style.background====>window.style.background,因此找不到windowd.style，所以报上面的错误 当我在外层保留this的指向时，然后我在定时器内函数使用外层保留的this即self，此时打印出
箭头函数与普通函数的this指向，箭头函数的特点和好处
全端菜鸟小姐
11-21 1009
建议参考书籍《你不知道的JavaScript》上卷 P82 第2章：this全面解析。 GitHub：https://github.com/susuGirl 箭头函数特点 this的指向问题，函数体内的this对象，就是定义是所在的对象，而不是使用时所在的对象。箭头函数里面没有自己的this，而是引用外层的this，所以也不能用call、apply、bind方法去改变this指向 ...
请描述ES6的箭头函数中this与普通函数中this的区分。
06-12
在ES6的箭头函数中，this的指向与普通函数中的this有所不同。在普通函数中，this的指向是在函数被调用时动态确定的，它取决于函数的调用方式。而在箭头函数中，this的指向是在定义函数时确定的，它取决于函数定义时...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值