2024年前端面试中JavaScript的30个高频面试题之中级知识

基础知识
高级知识

13. 什么是闭包?闭包的用例有哪些?

闭包是一个功能,它允许函数捕获定义该函数的环境(或保留对作用域中变量的访问)即使在该作用域已经关闭后。

我们可以说闭包是函数和词法环境的组合,其中定义了该函数。

换句话说,闭包为函数提供了访问自己的作用域、外部函数的作用域和全局作用域的能力,允许它“记住”并继续访问这些作用域中的变量和参数。

function outerFunction() {let outerVariable = 'I am from the outer function';return innerFunction() {console.log(outerVariable); // 访问外部函数作用域中的outerVariable}}let myFunction = outerFunction();
myFunction(); // 输出:I am from the outer function

每次在函数创建时以及在另一个函数内部定义函数时都会创建闭包。

执行上下文是一个执行JavaScript代码的环境。 对于每个函数调用,都会创建一个单独的执行上下文并推送到执行堆栈中。 一旦函数执行完成,它就会从堆栈中弹出。

每个执行上下文都有一个内存空间,其中存储了其变量和函数,一旦从执行堆栈中弹出函数,JavaScript垃圾收集器就会清除所有这些内容。

在JavaScript中,只有当没有引用某个对象时,该对象才会被垃圾回收。

在上面的示例中,匿名执行上下文仍对其外部环境的内存空间中的变量有引用。 即使outerFunction()已完成(它可以访问 outerVariable 变量并在console.log(outerVariable)中使用它)。

JavaScript中的闭包有几个重要用例:

  1. 数据隐私和封装:闭包可用于创建私有数据和封装有限范围内的功能。 通过在另一个函数内定义函数,内部函数可以访问外部函数的变量,但这些变量对外部函数不可访问。 这允许创建对外不直接可访问的私有数据和方法,从而增强了数据隐私和封装。

  2. 状态维护:闭包通常用于在异步操作和事件处理中维护状态。 例如,在处理异步任务时,闭包可以捕获和保留跨多个异步操作的变量状态,确保在异步任务完成时可以访问到正确的变量。

  3. 柯里化和偏函数应用:闭包有助于函数式编程技术如柯里化和偏函数应用。 通过使用闭包捕获和记住特定参数并返回使用这些捕获参数的新函数,可以实现柯里化和偏函数应用。 这允许创建具有预设参数的特化函数,提供灵活性和可重用性。

  4. 模块模式:闭包在实现JavaScript中的模块模式中至关重要。 通过使用闭包创建私有变量并只公开必要的公共方法,开发人员可以创建模块化和组织良好的代码,防止对内部模块数据的不必要访问和修改。

  5. 回调函数:在使用回调函数时,经常使用闭包。 闭包可用于在异步操作的上下文中捕获和维护变量的状态,以确保在调用回调函数时可以访问到正确的变量。

14. 解释JavaScript中的变量提升概念。

JavaScript中的变量提升是变量和函数声明自动移至其包含作用域顶部的默认行为。 这发生在编译阶段,在实际代码执行之前。 这意味着您可以在代码中声明之前使用变量或调用函数。

使用 var声明变量时,声明会被提升到包含函数或块的顶部,并使用默认值“undefined”初始化

console.log(x); // 输出:undefined
var x = 5; 

使用 letconst 声明的变量也会被提升,但是它们有一个“暂时性死区”,在该区域中不能在声明之前被访问。

console.log(x); // 抛出错误(ReferenceError) 
let x = 5; 

函数声明也会被提升到其包含作用域的顶部。您可以在代码中声明之前调用函数。

sayHello(); // 输出:Hello, world!
function sayHello() {console.log("Hello, world!"); 
}

箭头函数、函数表达式或变量初始化不会被提升。

15. 什么是暂时性死区?

暂时性死区(TDZ)是与使用 letconst 声明变量相关的 JavaScript 概念。

当您使用 letconst 声明一个变量时,它会被提升到其包含作用域的顶部,但是与 var 不同,使用 letconst 声明的变量在 TDZ 中保持未初始化状态。

在作用域内实际声明变量之前尝试访问或使用该变量会导致 ReferenceError。这可防止在变量被适当定义之前使用它。

了解暂时性死区很重要,因为它有助于防止变量在初始化之前使用导致的相关错误。它还通过鼓励在使用之前适当声明变量来推广JavaScript编码的最佳实践。

16. 什么是原型链? 以及 Object.create() 方法?

在 JavaScript 中,每个函数和对象默认都有一个名为 prototype 的属性。

JavaScript中的每个对象都有一个原型。 原型是当前对象继承属性和方法的另一个对象。 您可以将原型视为模板或父对象。

原型链是允许对象从其他对象继承属性和方法的机制

在对象上访问某个属性或方法时,JavaScript会首先在对象本身上查找它。 如果找不到,它会在原型链上向上查找,直到找到该属性或方法。 此过程会一直持续到到达链顶部的 Object.prototype 为止。

17. Call、Apply和Bind方法的区别是什么?

Call: call()方法使用指定的this值调用函数,并以逗号分隔的值的形式传入单独的参数

const person1 = { name: 'John' };
const person2 = { name: 'Jane' };function greet(greeting) {console.log(greeting + ' ' + this.name); 
}greet.call(person1, 'Hello'); // 输出:Hello John
greet.call(person2, 'Hi'); // 输出:Hi Jane  

使用 call() 方法,一个对象可以调用另一个对象所拥有的方法。

const o1 = {name: 'ravi',getName: function(){  console.log(`Hello, ${this.name}`)}
}const o2 = {name: 'JavaScript Centric'  
}o1.getName.call(o2) // Hello, JavaScript Centric

Apply: 使用给定的 this 值调用函数,但是它使用数组的形式接受参数。 当参数的数量未知或者参数已在数组中时,Apply非常有用。

const numbers = [1, 2, 3, 4, 5];   const max = Math.max.apply(null, numbers); 
console.log(max); // 输出:5

Bind: 与调用它不同,bind() 会返回一个新函数,并允许您传入任意数量的参数。bind() 方法接受一个对象作为第一个参数,并创建一个新函数。

const module = {x: 42,getX: function() {return this.x; }  
};  const boundGetX = unboundGetX.bind(module);
console.log(boundGetX()); // 输出:42

18. 什么是lambda或箭头函数?

JavaScript中有两种类型的函数:

  1. 常规函数
  2. 箭头函数(在 ES6 中引入)

常规函数: 我们可以通过两种方式编写常规函数,即函数声明函数表达式

箭头函数或胖箭头函数:也称为 lambda 函数,是在 JavaScript(ES6)中引入的一种更简洁的函数表达式语法。 与传统的函数表达式相比,它们具有较短的语法,在创建匿名函数和使用函数式编程概念方面特别有用

这里没有声明方法,我们只能通过函数表达式来编写。

箭头函数和常规函数之间有一些区别:

  1. 语法
  2. 没有参数 (参数是类数组对象)
  3. 箭头函数没有原型对象
  4. 不能用 new 关键字调用 (不是构造函数)
  5. 没有自己的 this (call、apply 和 bind 不会按预期工作)
  6. 它不能用作生成器函数
  7. 不允许重复命名的参数

19. 什么是柯里化函数?

柯里化是函数式编程中的一种技术,它将接受多个参数的函数转换成一系列每个接收单个参数的函数。 通过组合这些柯里化的函数,可以构建更复杂的函数。

在 JavaScript 中,您可以使用闭包和返回函数来实现柯里化。

// 接收两个参数的常规函数  
function add(x, y) {return x + y;
} 
// 函数的柯里化版本  
function curryAdd(x) {return function(y) {return x + y;};
}const add5 = curryAdd(5); // 偏函数应用,创建新函数  
console.log(add5(3)); // 输出:8

柯里化在函数式编程中很有用,它可以使代码更模块化和可重用。 当您想要使用变参函数或者构建数据转换流水线时,它特别有用。

20. ES6的特性有哪些?

ES6,也称为 ECMAScript 2015,为 JavaScript 引入了许多新特性和增强功能,极大地扩展了该语言的功能。 ES6的一些关键特性包括:

  1. 箭头函数
  2. 块作用域变量
  3. 模块
  4. 模板字面量: 模板字面量允许使用反引号嵌入表达式和多行字符串,这提供了在 JavaScript 中创建复杂字符串的更方便的方法。
  5. 默认参数
  6. Rest和Spread运算符
  7. 解构赋值
  8. Promise
  9. Map、Set、WeakMap、WeakSet: ES6 引入了新的内置数据结构,如 Map 和 Set,可以更高效和专门地处理集合和键值对。
  10. 迭代器和生成器
  11. 增强的对象字面量

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/616901.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

爬虫利器一览

前言 爬虫(英文:spider),可以理解为简单的机器人,如此一个“不为名利而活,只为数据而生,目标单纯,能量充沛,不怕日晒雨淋,不惧寒冬酷暑”的家伙,…

Casper Labs 与 IBM Consulting 合作,AI透明度、审计能力的新方案

​ “全新解决方案,旨在帮助企业更有效地管理训练数据,这些数据由不同的组织通过生成式人工智能系统产生” 企业区块链软件和服务提供商 Casper Labs 与 IBM Consulting 共同宣布,它们将联手推出新的解决方案,以帮助客户在其人工…

VSCode 搭建Java开发环境

笔者使用最多的语言是C,也使用过不少其它语言,像Erlang,Python,Lua,C#等等,目前项目中在使用Go,但是没使用过Java。最近看到C#夺冠,首次荣获 TIOBE 年度编程语言,同时也看…

拯救者y9000p安装linux、windows双系统。

首先需要准备启动盘 我用的是Win32DiskImager来做的。资源使用的是ubuntu-20.04.6-desktop-amd64.iso。别用低版本,失败很多次之后的教训。 磁盘管理-磁盘分区-右键-压缩卷 这边分区出来之后,不要分配。安装时候会自动分配的。 重启之后F2进去BIOS设置…

使用ArduinoMqttClient库连接阿里云,并实现发送接收数据(ESP8266)

文章目录 引言一、MQTT理论部分二、使用MQTT.fx接入物联网设备三、使用ESP8266连接阿里云四、参考例程 引言 阿里云物联网平台的接入方式有很多种,从阿里云提供的开发文档可以看到,支持的接入协议有MQTT、HTTPS、CoAP、JT/808、GB/32960协议等等&#x…

数据库悲观锁 select for update的详解

一 作用 1.1 结论 在mysql中,select ... for update 仅适用于InnoDB,且必须在事务块中才能生效。Innodb引擎默认是行锁。 Select .... from where .... for update 如果在where的查询条件字段使用了【主键|索引】,则此命令上行锁。否…

2024,传统鞋服的“高端梦”该醒了

文 | 螳螂观察 作者 | 图霖 “一千块都不要的波司登,宝贝们还不冲吗?” 入夜,一位身着羽绒服的美女主播在灯火通明的直播间正声嘶力竭地反复呐喊。 一群不知是托还是真实消费者的用户在评论区敲出自己的身高体重,想从主播那得…

【计算机组成原理】IEEE 754 标准定义的浮点数表示格式

IEEE 754 IEEE 754是一种由美国电气和电子工程师协会(IEEE)制定的标准,用于定义浮点数的表示和运算。这个标准定义了浮点数的格式、舍入规则、特殊值的处理以及算术操作的执行方式。 IEEE 754浮点数标准主要定义了两种浮点数格式&#xff1…

基于LVGL编写的windows串口工具: LCOM

LCOM: Serial Port Tools based on LVGL (PC Software) 一直以来我都想用LVGL做一个真正意义上的PC软件,来验证或者表达LVGL出色的特性,现在我用LCOM做到了! LCOM 是一个基于LVGL编写的串口工具,界面简洁,功能出色&a…

Javaweb之SpringBootWeb案例查询部门以及前后端联调的详细解析

2.1 查询部门 2.1.1 原型和需求 查询的部门的信息:部门ID、部门名称、修改时间 通过页面原型以及需求描述,我们可以看到,部门查询,是不需要考虑分页操作的。 2.1.2 接口文档 部门列表查询 基本信息 请求路径:/depts …

Github项目推荐-Insomnia

项目地址 GitHub地址:GitHub - Kong/insomnia 官网:The Collaborative API Development Platform - Insomnia 项目简述 想必大家都知道PostMan吧。Insomnia可以说是PostMan的开源平替。页面ui很不错,功能强大,使用也比较方便。…

Matlab 字符识别OCR实验

Matlab 字符识别实验 图像来源于屏幕截图,要求黑底白字。数据来源是任意二进制文件,内容以16进制打印输出,0-9a-f’字符被16个可打印字符替代,这些替代字符经过挑选,使其相对容易被识别。 第一步进行线分割和字符分割…

C++设计模式-- 2.代理模式

文章目录 代理模式 代理模式 代理模式的定义:为其他对象提供一种代理以控制对这个对象的访问。在某些情况下,一个对象不适合 或不能直接引用另一个对象,而代理对象可以在客户端和目标对象之间起到中介的作用。 代理模式有以下三种角色&…

ES分词器

Analysis:文本分析是把全文本转换一系列单词的过程,也叫分词。Analysis是通过Analyzer(分词器)来实现的。 1.Analyzer组成 注意:在ES中默认使用标准分词器:StandardAnalyzer。特点是:中文是单字分词,英文是…

解锁加密经济领域的新篇章:Token Explorer 助您一臂之力

随着全球加密货币的普及,市场变化对于想要优化回报的投资者来说是一个挑战。碎片化的数据是一个问题,但是像 Footprint Analytics 的 Token Explorer 这样的创新解决方案,可以提供必要的加密经济生态聚类智能,帮助改善投资组合。 …

AOT-GAN-for-Inpainting项目解读|使用AOT-GAN进行图像修复

项目地址: https://github.com/researchmm/AOT-GAN-for-Inpainting 基于pytorch实现 论文地址: https://arxiv.org/abs/2104.01431 开源时间: 2021年 项目简介: AOT-GAN-for-Inpainting是一个开源的图像修复项目,其对 …

打铁需要自身硬,我敢和欧系谬论硬刚源自实力与信心

我揭露欧系数学荒谬的目的是驱逐纯粹数学出中国,以恢复中华数学体系、最终让中华数学领导世界;我从来不隐瞒自己的“野心”,我对此有着绝对的信心。民族情怀是中国数学人的短板 纯粹数学是欧洲人的文化、是欧系数学的主体,它的历…

小白进公司快速熟悉环境和代码的方法

1.企业开发模式 企业开发模式里,我们的项目模块可能非常多此时我们是不能将所有模块都拉取到本地的,主要原因如下: 我们很可能并没有全部工程代码的权限 微服务集群部署非常复杂,本地部署成本太高 微服务模块众多,本…

边缘计算AI智能分析网关V4算力分析及应用场景

一、硬件介绍 智能分析网关V4是TSINGSEE青犀视频推出的一款高性能、低功耗的软硬一体AI边缘计算硬件设备,硬件采用BM1684芯片,集成高性能8核ARM A53,主频高达2.3GHz。硬件内置近40种AI算法模型,支持对接入的视频图像进行人、车、…

适用于 Windows 的 12 个最佳免费磁盘分区管理器软件

分区是与其他部分分开的硬盘驱动器部分。它使您能够将硬盘划分为不同的逻辑部分。分区软件是一种工具,可帮助您执行基本选项,例如创建、调整大小和删除物理磁盘的分区。许多此类程序允许您更改磁盘片的标签以便于识别数据。 适用于 Windows 的 12 个最佳…