浅谈ES6箭头函数this指向

简介: 前言如果在面试中被问到ES6的相关知识,那么箭头函数是肯定会被问到的。很多小伙伴可能对箭头函数只停留在表面,比如面试官会问“箭头函数和正常函数的区别?”、”箭头函数的this指向哪里“。可能很多小伙伴会回答指向执行上下文,这是很多书面解答,也是很多小伙伴死记硬背的,今天我以代码实例给大家演示以下箭头函数的this指向。

1.正常函数this指向


正常函数的this指向可以用一句话简单概括:

this在运行时确定,即指向函数调用对象,除非利用call、apply等方法改变this指向。


虽然上面那句话不是那么完善,但是也足以大概知道正常函数调用时的this指向哪里了,下面我们再来看一段代码来理解,代码如下:

<script>
  var objA = {
    name: "张三",
    age: 24,
    objAFun: function () {
      console.log("姓名", this.name)
    }
  }
  var objB = {
    name: "李四",
    age: 25,
    objBFun: function () {
      console.log("姓名", this.name)
    }
  }
  objA.objAFun(); // 姓名 张三
  objB.objBFun(); // 姓名 李四
  objA.objAFun.call(objB); // 姓名 李四
</script>


页面输出结果:19.png


可以看到上面一共调用了三次函数,前面两次函数都是正常调用,this也是指向的调用者对象,第一个是objA调用的,所以this指向了objA,第二个同理。但是第三个我们通过call()方法改变了this的指向,所以输出了李四。


2.箭头函数this指向


箭头函数的this指向也可以用一句话简单的概括:

箭头函数的this指向于函数作用域所在的对象

<script>
  var name = "我是windown对象";
  var objA = {
    name: "张三",
    age: 24,
    objAFun: () => {
      console.log("姓名", this.name)
    }
  }
  var objB = {
    name: "李四",
    age: 25,
    objBFun: () => {
      console.log("姓名", this.name)
    }
  }
  objA.objAFun(); // 姓名 张三
  objB.objBFun(); // 姓名 李四
  objA.objAFun.call(objB); // 姓名 李四
</script>


页面输出结果:

20.png


由上面可以看出,无论怎么调用箭头函数,输出的结果都是最外层的name,刚好印证了刚刚那句话:

箭头函数的this指向于函数作用域所在的对象



3.使用箭头函数注意事项


  • 不可以当作构造函数
  • 不可以使用arguments对象,该对象在函数体内不存在
相关文章
|
5天前
|
存储 人工智能 安全
AI 越智能,数据越危险?
阿里云提供AI全栈安全能力,为客户构建全链路数据保护体系,让企业敢用、能用、放心用
|
8天前
|
域名解析 人工智能
【实操攻略】手把手教学,免费领取.CN域名
即日起至2025年12月31日,购买万小智AI建站或云·企业官网,每单可免费领1个.CN域名首年!跟我了解领取攻略吧~
|
7天前
|
数据采集 人工智能 自然语言处理
3分钟采集134篇AI文章!深度解析如何通过云无影AgentBay实现25倍并发 + LlamaIndex智能推荐
结合阿里云无影 AgentBay 云端并发采集与 LlamaIndex 智能分析,3分钟高效抓取134篇 AI Agent 文章,实现 AI 推荐、智能问答与知识沉淀,打造从数据获取到价值提炼的完整闭环。
448 93
|
1天前
|
开发者
「玩透ESA」ESA启用和加速-ER在加速场景中的应用
本文介绍三种配置方法:通过“A鉴权”模板创建函数并设置触发器路由;在ESA上配置回源302跟随;以及自定义响应头。每步均配有详细截图指引,帮助开发者快速完成相关功能设置,提升服务安全性与灵活性。
286 2
|
7天前
|
SQL 人工智能 自然语言处理
Geo优化SOP标准化:于磊老师的“人性化Geo”体系如何助力企业获客提效46%
随着生成式AI的普及,Geo优化(Generative Engine Optimization)已成为企业获客的新战场。然而,缺乏标准化流程(Geo优化sop)导致优化效果参差不齐。本文将深入探讨Geo专家于磊老师提出的“人性化Geo”优化体系,并展示Geo优化sop标准化如何帮助企业实现获客效率提升46%的惊人效果,为企业在AI时代构建稳定的流量护城河。
407 156
Geo优化SOP标准化:于磊老师的“人性化Geo”体系如何助力企业获客提效46%
|
7天前
|
数据采集 缓存 数据可视化
Android 无侵入式数据采集:从手动埋点到字节码插桩的演进之路
本文深入探讨Android无侵入式埋点技术,通过AOP与字节码插桩(如ASM)实现数据采集自动化,彻底解耦业务代码与埋点逻辑。涵盖页面浏览、点击事件自动追踪及注解驱动的半自动化方案,提升数据质量与研发效率,助力团队迈向高效、稳定的智能化埋点体系。(238字)
314 158