面试题目+答案汇总

箭头函数的 this 指向

  1. 箭头函数没有 this,所以需要 通过查找作用链来确定 this 的值
  2. 箭头函数没有自己的 arguments 对象
  3. 不能通过 new 关键字调用

ps: this 指向是在函数执行的时候确定

JS 模块化

发展历程

  • 自执行函数
  • AMD 使用 requirejs 来编写模块化(依赖必须提前声明好)
  • CMD 使用 seajs 编写模块化,动态依赖引入文件
  • CommonJS nodejs 中自带模块化
  • UMD 兼容 AMD CommonJS 语法
  • webpack 代码分割
  • ES Modules 标签增加 type=’module’

模块化历程

AMD 和 CMD 的区别

对依赖模块的执行时机处理不同

  • AMD 依赖前置,定义模块的时候就要声明依赖模块
  • CMD 就近依赖,用到了之后才去 require

CommonJS 规范

  1. 所有代码都运行在模块的作用域,不会污染全局
  2. 模块同步加载,引入的模块加载完成才会进行后续操作
  3. 模块有缓存
  4. 输出的是值的拷贝

ES6 modules 特点

  1. 输入的变量不可重新赋值,可读引用,可以改写属性
  2. export 和 import 处于模块顶层
  3. babel 会把 export/import 转换成 exports/require 的形式

CommonJS 和 ES6 modules 的区别

  1. CommonJS 运行时加载,ES6Modules 是编译时加载
  2. CommonJS 输出值的拷贝,ES6Modules 输出值的引用
  3. 前者导入模块是一个表达式,后者导入只能是字符串
  4. 前者 this 指向当前模块,后者 this 指向 undefined
  5. ES6Modules 中没有 arguments、require、module、exports、_filename、_dirname 这些顶层变量

addEventListener 的第三个参数是什么

  • 当为 boolean 时,true 为捕获,false 为冒泡
  • 当为 Object 时:capture,布尔值,捕获阶段传播到该 dom 时触发。once,布尔值,是否只调用一次,passive,布尔表示 listener 永远不会调用 preventDefault

冒泡:从下层到上层传递 捕获:从上层到下层传递

创建自定义事件 new Event,customEvent,document.createEvent&initEvent,触发 dispatchEvent

闭包

作用

  1. 可以访问函数中变量
  2. 可以使变量长期保存在内存中

内存泄漏

  1. 循环引用
  2. 自动类型装箱转换
  3. 某些 dom 操作
  4. 闭包

程序中提示内存不足不是内存泄漏,一般是无限递归函数调用导致栈内存溢出

内存泄漏一般指的是堆内存泄漏,栈区不会泄漏

基本数据类型保存在栈内存,但是闭包中的数据类型存储在堆内存。引用数据类型实体存储在堆内存,栈中存储了指针

EventLoop

执行过程

  1. 整个 script 作为一个宏任务进行执行
  2. 同步代码直接执行,宏任务进入宏任务队列,微任务进入微任务队列
  3. 当前宏任务执行完成之后,检测微任务列表,有则进行微任务执行,直到微任务列表全部执行完毕
  4. 执行浏览器的 UI 线程渲染工作
  5. 检查是否有 web worker 任务,有则执行
  6. 执行完本轮宏任务,回到第二步,依次循环,直到宏任务和微任务队列都为空