Webpack

• 模块打包工具，可以管理模块依赖，并能编译出模块需要的静态资源文件
• 可以很好的管理打包 web 需要的 html、css、js、image、font 等，让开发过程更高效
• 对不同类型的资源有对应的模块加载器
• 打包器会分析模块间的依赖关系生成优化且合并后的静态资源
• 构建优化
  • 减少编译体积，IgnorePlugin，babel-plugin-import，babel-plugin-transform-runtime
  • 并行编译，happypack，thread-loader，uglifyjsWebpackPlugin
  • 缓存，cache-loader，hard-source-webpack-plugin，babel-loader
  • 预编译，dllWebpackPlugin，DllReferencePlugin，auto-dll-webpack-plugin
• 性能优化
  • 减少编译体积，Tree-shaking，scope hositing
  • hash 缓存，webpack-md5-plugin
  • 拆包，splitChunksPlugin，import，require.ensure

异步编程

• 回调函数
  • 优点：简单容易理解
  • 缺点：不利于维护，代码耦合高
• 事件监听（采用事件驱动模式，取决于事件是否发生）
  • 优点：容易理解，可以绑定多个事件，每个事件可以绑定多个回调函数
  • 缺点：事件驱动型，流程不够清晰
• 观察者模式（发布订阅）
  • 类似于事件监听，但是可以通过消息监听可以了解现在有多少个订阅者和发布者
  • promise 对象
    • 优点：可以用 then 方法链式调用，可以书写错误时的回调函数
    • 缺点：编写和理解比较难
  • Generator 函数
    • 优点：函数体内的数据交换、错误处理机制
    • 缺点：流程管理不方便
  • async 函数
    • 优点：内置执行器，更好的语义，更广的适用性，返回的是 promise，结构清晰
    • 缺点：错误处理机制

函数式编程

脚手架工具

自动化构建

自动化测试

自动化部署

开发规范

重构

MVC 和 MVVM 的区别

• MVC 单向数据绑定，需要手动绑定事件来影响数据
• MVVM 双向数据绑定
• MVC 比 MVVM 少了视图改变影响数据
• MVC
  • View 接受用户交互请求
  • View 将请求转交给 Controller 处理
  • Controller 操作 Model 进行数据更新保存
  • 数据更新保存之后，Model 会通知 View 更新
  • View 更新变化数据使用户得到反馈
• MVVM
  • Model，Model 代表数据模型，也可以在 Model 中定义数据修改和操作的业务逻辑
  • View，View 代表 UI 组件，它负责将数据模型转化为 UI 展现出来
  • ViewModel，ViewModel 监听模型数据的改变和控制视图行为、处理用户交互，简单理解就是一个同步 View 和 Model 的对象，连接 Model 和 View

设计模式

• 观察者模式/发布订阅，
• 工厂模式，解决重复实例化，可以消除对象间的耦合
• 构造函数模式，既解决了重复实例化的问题，又解决了对象识别的问题，直接将方法和属性赋值给对象