公司面试题总结（四）

19.请解释什么是事件代理，应用场景

⚫ 事件流的都会经过三个阶段： 捕获阶段 -> 目标阶段 -> 冒泡阶段，而事件委托就是

在冒泡阶段完成

⚫ 事件委托，会把一个或者一组元素的事件委托到它的父层或者更外层元素上，真正绑定

事件的是外层元素，而不是目标元素

⚫ 当事件响应到目标元素上时，会通过事件冒泡机制从而触发它的外层元素的绑定事件

上，然后在外层元素上去执行函数

应用场景

⚫ 一个列表，列表之中有大量的列表项，点击列表项的时候响应一个事件

◼ 给每个列表项一一都绑定一个函数，那对于 内存消耗 是非常大的

◼ 使用事件委托，把点击事件绑定在父级元素 ul 上，执行事件时再去匹配目标元素

⚫ 随时动态的增加或者去除列表项元素，给新增元素绑定事件，给即将删去元素解绑事件

◼ 事件是绑定在父层的，和目标元素的增减没有关系

◼ 执行到目标元素是在真正响应执行事件函数的过程中去匹配

◼ 使用事件委托，在动态绑定事件的情况下是可以减少很多重复工作的

20.谈谈 This 对象的理解，如何改变 this 指向？

⚫ this 是 JavaScript 中的一个特殊对象，它在函数执行时确定，并指向一个特定的对象。

⚫ this 的值取决于函数调用的方式，这对于理解和控制函数的行为至关重要。

以下是几种改变或确定 this 指向的方法：

⚫ 全局上下文或非严格模式下的函数调用

◼ 在全局上下文中（不在任何函数内），this 指向全局对象，在浏览器中是 window，

在 Node.js 环境中是 global。

◼ 在非严格模式下，普通函数调用时，this 默认指向全局对象（但在严格模式下，this

会是 undefined）。

⚫ 方法调用

◼ 当函数作为某个对象的方法被调用时，this 指向该对象。

⚫ 构造函数调用

◼ 使用 new 关键字调用函数（即构造函数）时，this 指向新创建的实例对象。

⚫ 显式绑定 call, apply, bind

◼ call() 和 apply() 方法可以立即调用函数并指定 this 的值。

◼ bind() 方法创建一个新的函数，其 this 值被永久地绑定到了传入的值，但不会立

即调用函数。

⚫ 箭头函数

◼ 箭头函数不绑定自己的 this，它们会捕获其所在上下文的 this 值作为自己的 this。

构造函数继承 bind 方法延迟

21.new 操作符具体干了什么

⚫ 创建一个给定构造函数的实例对象

⚫ 实例可以访问到构造函数中的属性

⚫ 实例可以访问到构造函数原型链中的属性

⚫ 在构建函数中显式加上返回值，这个返回值是一个原始类型，并没有作用

⚫ 构造函数如果返回值为一个对象，那么这个返回值会被正常使用

主要做了以下的工作：

⚫ 创建一个新的对象 obj

⚫ 将对象与构建函数通过原型链连接起来

⚫ 将构建函数中的 this 绑定到新建的对象 obj 上

⚫ 构建函数返回类型作判断，如果是原始值则被忽略，如果是返回对象，需要正常处理

22.null，undefined 的区别。

⚫ 定义和用途

◼ undefined: 表示变量已被声明，但尚未被赋予任何值。它是一个默认值，用于表示

变量未初始化的状态

◼ null: 是一个表示“空值”的对象，它是一个特意指定的值，用来表示变量或对象的值

为空或者没有任何对象实例。

⚫ 类型

◼ undefined 是一种基本数据类型，它是 undefined 类型的唯一值。

◼ null 虽然表示“无值”，但实际上是一个对象， typeof null 返回的是 'object'

⚫ 相等性

◼ 松散相等（==）比较 null 和 undefined 相等，它们都被认为是非值（non-values）。

◼ 严格相等（===）比较中，不相等，因为严格相等比较同时检查值和类型。

23. javascript 代码中的"use strict";是什么意思，严格模式有哪些规范？

严格模式（Strict Mode）是 ECMAScript 5 引入的一种运行模式

旨在提供更加严格的 JavaScript 解析和错误处理机制，以帮助开发者编写更加规范、安全

的代码。

严格模式的限制包括但不限于以下几个方面：

⚫ 全局变量：

◼ 在严格模式下，未声明就赋值的变量会抛出 ReferenceError 错误。

◼ 删除全局对象上的属性或变量会抛出错误。

⚫ 函数：

◼ 禁止重复的参数名。

◼ this 值在全局作用域中为 undefined，避免了意外全局 this 指向。

⚫ 语法和行为：

◼ 禁止使用 with 语句。

◼ eval在严格模式下创建的变量和函数不会被提升至当前执行上下文的变量环境中。

◼ 禁止使用 arguments.callee 和 arguments.caller。

◼ 对象字面量属性名不能重复。

◼ 函数不能有重名的属性和参数。

◼ 禁止 delete 非配置对象的属性。

⚫ 保留字：

⚫ 将 ECMAScript 3 中的一些静默错误转换为抛出错误，比如禁止使用关键字作为变量名。

24.同步和异步的区别，各自有优缺点？

同步（Synchronous）

⚫ 定义：

◼ 阻塞当前线程或进程，直到该操作完成并返回结果。

◼ 程序按顺序执行，一步接一步，每个步骤都需等待前一个步骤完成。

⚫ 优点：

◼ 简单易懂： 流程的控制流直观，易于理解和调试。

◼ 上下文连贯： 操作在一个上下文中连续执行，便于管理状态和资源。

◼ 异常处理直接： 错误和异常可以在发生时立即捕获并处理，逻辑处理连贯。

⚫ 缺点：

◼ 效率低： 在 I/O 密集型（文件读写、网络请求），线程被阻塞，导致整体效率下降。

◼ 阻塞性： 长时间的同步操作会阻碍后续代码的执行，影响程序响应性。

◼ 资源占用： 在多线程环境下，大量同步操作可能导致线程资源耗尽。

异步（Asynchronous）

⚫ 定义：

◼ 不会阻塞当前线程，在启动操作后立即返回，允许程序继续执行后续代码

◼ 操作结果未来某个时间通过回调、事件、Promise、async/await 方式通知给调用方。

⚫ 优点：

◼ 提高效率： 允许程序在等待 I/O 操作的同时执行其他任务，提高了 CPU 利用率。

◼ 响应快速： UI 线程不被阻塞，可以即时响应用户输入，提升用户体验。

◼ 资源利用： 减少了线程阻塞，更高效地利用系统资源，特别是处理大量并发请求时。

⚫ 缺点：

◼ 复杂度增加： 异步编程模式如回调地狱、Promise 链或 async/await 增加了代码的

复杂度，对初学者不够友好。

◼ 调试困难： 非线性的执行流程使得跟踪和调试异步代码相对困难。

◼ 控制流挑战： 由于操作不是按顺序执行，控制流程的管理变得复杂，尤其是错误处

理和资源清理。