每日一道javascript面试题(七)你真的知道箭头函数吗

简介: 每日一道javascript面试题(七)你真的知道箭头函数吗

前言

  • 我是小嘟,努力每天分享一道javascript相关的题目。
  • 希望对你有所帮助。
  • 觉得有用的话,请点赞支持,你的鼓励是我坚持下去的动力。v

题目

var name = `I love ZYPC`;//反引号,es6里边的
const obj = {
    name:'hello',
    say1:()=>{
        console.log("我是say1",this.name);
    },
    say2:function(){
        console.log("我是say2",this.name);
    }
}
obj.say1();//我是say1 I love ZYPC
obj.say2();//我是say2 hello

运行结果

代码分析


这里的考点就是箭头函数和一般函数的区别。

一般函数的this值是谁调用它,它的this就指向谁(基本是这样,不排除其他特别的方法,详细的轻看你附件链接)。但有时调用的关系很多,一不小心就把this判断错了,所以this指向这个问题一时半会是很难理解透彻的。

而箭头函数的this则很好理解,看定义:箭头函数的thiis指向外层函数作用域或者是全局作用域,它不满足谁调用就指向谁这个准则,它的this是由距离它最近的函数作用域或者是全局作用域决定的。

  • 小嘟在这里再举一个例子
 var name = `I love ZYPC`;
 const obj = {
     name:'hello',
     say1:function(){
          console.log("我是箭头函数的外层函数",this);
          let arrow = ()=>{
              console.log("我是say1函数中的一个箭头函数",this.name);
             }
          arrow();
     },
     say2:function(){
          console.log("我是say2",this.name);
     }
}
obj.say1();
obj.say2();


  • 可以看到,say1中的箭头函数它打印的是obj对象的name,原因就是距离箭头函数最近的外层函数的this指向的是obj对象,如果把这个this改变,会是什么结果呢?
var name = `I love ZYPC`;
const obj = {
    name:'hello',
    say1:function(){
         console.log("我是箭头函数的外层函数",this);
         let arrow = ()=>{
             console.log("我是say1函数中的一个箭头函数",this.name);
         }
         arrow();
    },
    say2:function(){
         console.log("我是say2",this.name);
    }
}
obj.say1();
obj.say2();
obj.say1.call(window)


  • 总结箭头函数的this指向外层函数作用域或者是全局作用域

嘟嘟小课堂

  • typeof typeof null 打印结果是什么呢?


  • 从这个中我们知道,.在js中,每个类型是字符串类型的,如‘number’、‘string’、‘undefined’(它的值是undefined),例如上面的的 typeof null === ‘object’
相关文章
|
10天前
|
JSON JavaScript 前端开发
Javascript基础 86个面试题汇总 (附答案)
该文章汇总了JavaScript的基础面试题及其答案,涵盖了JavaScript的核心概念、特性以及常见的面试问题。
28 3
|
8天前
|
JavaScript 前端开发 安全
JavaScript函数详解
JavaScript函数的详细解析,包括函数的定义和调用方式(如一般格式、匿名函数、构造函数、自调用函数、箭头函数和严格模式)、函数参数(arguments对象、可变参数、默认参数值)、闭包的概念和应用实例。
JavaScript函数详解
|
7天前
|
JavaScript 前端开发
JavaScript函数可以返回两个值
JavaScript函数可以返回两个值
|
7天前
|
自然语言处理 分布式计算 JavaScript
JavaScript函数
JavaScript函数
|
10天前
|
JSON JavaScript 数据格式
手写JS实现深拷贝函数
本文介绍了如何实现一个深拷贝函数`deepClone`,该函数可以处理对象和数组的深拷贝,确保拷贝后的对象与原始对象在内存中互不干扰。通过递归处理对象的键值对和数组的元素,实现了深度复制,同时保留了函数类型的值和基础类型的值。
15 3
|
8天前
|
缓存 JavaScript 前端开发
了解js基础知识中的作用域和闭包以及闭包的一些应用场景,浅析函数柯里化
该文章详细讲解了JavaScript中的作用域、闭包概念及其应用场景,并简要分析了函数柯里化的使用。
了解js基础知识中的作用域和闭包以及闭包的一些应用场景,浅析函数柯里化
|
10天前
|
前端开发 数据可视化 开发者
D3.js 内置的动画函数
D3.js 内置的动画函数
|
11天前
|
JavaScript 前端开发
JavaScript 函数参数
JavaScript 函数参数
23 3
|
11天前
|
存储 JavaScript 前端开发
JavaScript 函数定义
JavaScript 函数定义
17 3
|
10天前
|
JavaScript 前端开发
js防抖函数返回值问题解决方案
本文介绍了如何在JavaScript中创建一个带有返回值的防抖函数,通过结合Promise来实现。这种防抖函数可以在事件触发一定时间后再执行函数,并能处理异步操作的返回值。文章提供了防抖函数的实现代码和如何在实际项目中使用该防抖函数的示例。
16 1
下一篇
无影云桌面