定义

一个用于创建对象的接口,这个接口由子类决定实例化哪一个类。该模式使一个类的实例化延迟到了子类。而子类可以重写接口方法以便创建的时候指定自己的对象类型

  1. class Product {
  2. constructor(name) {
  3. this.name = name
  4. }
  5. init() {
  6. console.log('init')
  7. }
  8. fun() {
  9. console.log('fun')
  10. }
  11. }
  12. class Factory {
  13. create(name) {
  14. return new Product(name)
  15. }
  16. }
  17. // use
  18. let factory = new Factory()
  19. let p = factory.create('p1')
  20. p.init()
  21. p.fun()

场景

  • 如果你不想让某个子系统与较大的那个对象之间形成强耦合,而是想运行时从许多子系统中进行挑选的话,那么工厂模式是一个理想的选择
  • 将new操作简单封装,遇到new的时候就应该考虑是否用工厂模式;
  • 需要依赖具体环境创建不同实例,这些实例都有相同的行为,这时候我们可以使用工厂模式,简化实现的过程,同时也可以减少每种对象所需的代码量,有利于消除对象间的耦合,提供更大的灵活性

    JQuery的$()

    JQuery的$()就是一个工厂函数,它根据传入参数的不同创建元素或者去寻找上下文中的元素,创建成相应的jQuery对象 ```javascript class jQuery { constructor(selector) { super(selector) } add() {

    } // 此处省略若干API }

window.$ = function(selector) { return new jQuery(selector) }

  1. <a name="AalAs"></a>
  2. ## vue 的异步组件
  3. 在大型应用中,可能需要将应用分割成小一些的代码块,并且只在需要的时候才从服务器加载一个模块。为了简化,Vue 允许以一个工厂函数的方式定义你的组件,这个工厂函数会异步解析你的组件定义。Vue 只有在这个组件需要被渲染的时候才会触发该工厂函数,且会把结果缓存起来供未来重渲染
  4. ```javascript
  5. Vue.component('async-example', function (resolve, reject) {
  6. setTimeout(function () {
  7. // 向 `resolve` 回调传递组件定义
  8. resolve({
  9. template: '<div>I am async!</div>'
  10. })
  11. }, 1000)
  12. })