什么是提升？什么是暂时性死区？var、let 及 const 区别？
- 当我们在一个作用域使用var声明一个变量的时候，会首先声明这个变量在当前作用域（undefined）的最上面，然后在进行赋值。
console.log(a) // undefined var a = 1;复制代码
- var 声明的变量会发生提升的情况，其实不仅变量会提升函数也会被提升。并且函数提升（声明加定义同时完成）优先于变量提升。
console.log(a) // ƒ a() {} function a() {} var a = 1复制代码 - let 和 const 声明变量，变量并不会被挂载到 window 上。
var a = 1 let b = 1 const c = 1 console.log(window.b) // undefined console.log(window. c) // undefined function test(){ console.log(a) // 报错 a is not defined let a } test()复制代码 - 使用let、const声明变量的时候，会存在暂时性死区 也就是说声明之前是无法使用变量的 会报错。
原型如何实现继承？Class 如何实现继承？Class 本质是什么？
组合继承(call+原型继承)
子类会存在父类的公有属性和私有属性。
function Parent(value) { this.val = value } Parent.prototype.getValue = function() { console.log(this.val) } function Child(value) { Parent.call(this, value) } Child.prototype = new Parent() const child = new Child(1) child.getValue() // 1 child instanceof Parent // true复制代码 寄生组合式继承
父类的原型赋值给了子类，并且将构造函数设置为子类，这样既解决了无用的父类属性问题，还能正确的找到子类的构造函数
function Parent(value) { this.val = value } Parent.prototype.getValue = function() { console.log(this.val) } function Child(value) { Parent.call(this, value) } Child.prototype = Object.create(Parent.prototype, { constructor: { value: Child, enumerable: false, writable: true, configurable: true } }) const child = new Child(1) child.getValue() // 1 child instanceof Parent // true复制代码 class 继承（class的本质就是函数）
class 实现继承的核心在于使用 extends 表明继承自哪个父类，并且在子类构造函数中必须调用 super(super相当于调用父类的构造函数)
class Parent { constructor(value) { this.val = value } getValue() { console.log(this.val) } } class Child extends Parent { constructor(value) { super(value) this.val = value } } let child = new Child(1) child.getValue() // 1 child instanceof Parent // true复制代码 为什么要使用模块化？都有哪几种方式可以实现模块化，各有什么特点？
模块化的好处
- 解决命名冲突
- 提供复用性
- 提高代码可维护性
立即执行函数
(function(globalVariable){ globalVariable.test = function() {} // ... 声明各种变量、函数都不会污染全局作用域 })(globalVariable)复制代码 AMD(requireJs)和CMD(seaJs)
// AMD 依赖前置 define(['./a', './b'], function(a, b) { // 加载模块完毕可以使用 a.do() b.do() }) // CMD 依赖就近 define(function(require, exports, module) { // 加载模块 // 可以把 require 写在函数体的任意地方实现延迟加载 var a = require('./a') a.doSomething() })复制代码 CommonJs(modele.exports require)
exports = module.exports ,并且require默认导出的是module.exports,所以对两者赋值要特别小心。
// a.js module.exports = { a:1 } // b.js let module = require('./a.js') module.a // 1复制代码 ES Module
- CommonJS 支持动态导入，也就是 require(${path}/xx.js)，后者目前不支持，但是已有提案
- CommonJS 是同步导入，因为用于服务端，文件都在本地，同步导入即使卡住主线程影响也不大。而后者是异步导入，因为用于浏览器，需要下载文件，如果也采用同步导入会对渲染有很大影响
- CommonJS 在导出时都是值拷贝，就算导出的值变了，导入的值也不会改变，所以如果想更新值，必须重新导入一次。但是 ES Module 采用实时绑定的方式，导入导出的值都指向同一个内存地址，所以导入值会跟随导出值变化
- ES Module 会编译成 require/exports 来执行的
// 引入模块 API import XXX from './a.js' import { XXX } from './a.js' // 导出模块 API export function a() {} export default function() {}复制代码 Proxy 可以实现什么功能？（vue3.0实现响应式完全是采用了proxy，而不是原来的Object.defineProperty）
// target 代表需要添加代理的对象，handler 用来自定义对象中的操作 let p = new Proxy(target, handler)复制代码
// Proxy 来实现一个数据响应式 let onWatch = (obj, setBind, getLogger) => { let handler = { get(target, property, receiver) { getLogger(target, property) return Reflect.get(target, property, receiver) }, set(target, property, value, receiver) { setBind(value, property) return Reflect.set(target, property, value) } } return new Proxy(obj, handler) } let obj = { a: 1 } let p = onWatch( obj, (v, property) => { console.log(`监听到属性${property}改变为${v}`) }, (target, property) => { console.log(`'${property}' = ${target[property]}`) } ) p.a = 2 // 监听到属性a改变 p.a // 'a' = 2复制代码