JS 面试题

闭包

因为js的链式作用域结构（子对象往父级一层一层寻找父级的变量,父对象的所有变量 子对象是可见的 反之不成立）

//闭包函数 外部可以通过调用f1来读取内部的变量a function f1(){ var a = 1; return function f2(){ alert(n) }

概念：定义在一个函数内部的函数，有权访问其他函数内部变量的函数 作用：阻止变量被回收 优缺点：优点：可以读取函数内部的变量（私有化数据） 让这些变量的值始终保存在内存中 不会被垃圾回收 缺点：不会被垃圾回收也是他的缺点 导致内存消耗大 滥用闭包 造成网页性能问题（在函数退出之前 将不使用的局部变量全部删除） 容易改变父函数内部的变量值

用途：防抖 节流 函数的柯里化 源码中 vue的响应式原理 react的hooks原理

防抖： 短时间内多次触发事件，只执行一次，比如搜索框输入内容时，几秒内只执行一次搜索，滚动条滚动时，几秒内只执行一次滚动条滚动 利用定时器实现

节流： 让函数在特定时间内就执行一次,与后端交互的按钮，用户一直点击，只有一次请求

函数的柯里化： 将多个参数的函数变成一个参数的函数 让函数可以复用 调用方便

webpack打包优化 css js 代码压缩 构建时间优化 thread-loader webpack.base.js 缓存资源 cache-loader webpack.base.js 开启热更新 webpack.dev.js 合理使用exclude 和 include webpack.base.js 开启gzip配置 webpack.prod.js compression-webpack-plugin 构建区分环境 开发和生产环境 代码压缩 gzip 体积优化配置（webpack更新版本）

tree-shaking:清除多余代码来优化打包体积得技术，只打包用到得代码  webpack5默认开启  基于es6的模块特性
tree-shaking 工作原理：es6 模块引入静态分析 编译的时候可以判断到底加载了什么模块 可以知道哪些使用过没使用 进而删除对应代码
副作用  会import 但是可能没有任何export 

设置方式 
 1.在.babelrc文件中设置
 "presets": [
      [
        "es2015", {
          "modules": false,
        }
      ],
      "stage-2"
    ]
  2.

CommonJs 和 es6中模块引入的区别

commonjs是一种模块规范 输出一个值的拷贝 运行时加载 单个值导出 动态语法判断引入  this当前的模块
es6模块                      值得引用  编译时输出接口  导出多个 静态语法       this是undifined