本文实例讲述了JS 设计模式之：工厂模式定义与实现方法。分享给大家供大家参考，具体如下：前言上次我们介绍了单例模式，没看过的小伙伴可以看这个链接：浅析 JS 设计模式之：单例模式浅析 JS 设计模式之：单例模式今天来说一说一种常见的设计模式：工厂模式。工厂模式是一种创建对象的 创建型模式，遵循 DRY（Don't Repeat Yourself）原则。在该模式下，代码将会根据具体的输入或其他既定规则，自行决定创建哪种类型的对象。简单点儿说就是，动态返回需要的实例对象。创建型模式动态返回需要的实例对象回顾上次的例子让我们继续使用单例模式中的例子，一个日志工具 Logger ：
class Logger {
log (...args) {

console.log(...args);
}
}
class Logger {
log (...args) {

console.log(...args);
}
}上面是最核心的 api，每次使用都需要使用 new Logger() 来创建一个 logger 对象，然后使用方法就和 console 一样啦~new Logger()console多种 Logger假如我们现在的代码要支持 electron 环境，即日志既可以是 console 日志，也可以是 file 日志，那么我们就需要有两种类型的 logger：electronConsoleLogger
// logger/console.js
class ConsoleLogger {
log (...args) {

console.log(...args)
}
}
export default ConsoleLogger
// logger/console.js
class ConsoleLogger {
log (...args) {

console.log(...args)
}
}
export default ConsoleLoggerFileLogger
// logger/file.js
class FileLogger {
log (...args) {

dumpLog(...args)
}
}
export default FileLogger
// logger/file.js
class FileLogger {
log (...args) {

dumpLog(...args)
}
}
export default FileLogger这里先不用管 dumpLog 的具体实现，只用知道它就是将日志写在文件中的即可~dumpLog使用工厂我们已经有了两种类型的 logger，但是这两种 logger 的 api 实际上都是一样的，在项目中直接导入当然也可以使用，只不过每次都要导入对应类型的模块，然后再使用，像下面这样：使用 console loggerconsole logger
import ConsoleLogger from './logger/console'
const logger = new ConsoleLogger()
import ConsoleLogger from './logger/console'
const logger = new ConsoleLogger()使用 file loggerfile logger
import FileLogger from './logger/file'
const logger = new FileLogger()
import FileLogger from './logger/file'
const logger = new FileLogger()是不是很繁琐？如果还有其他 logger 类型，如远程日志，就会出现种使用方式了。为了把 logger 模块的使用方式统一，这时候就会用到工厂模式啦~让我们新建一个 index.js：index.js
// logger/index.js
import ConsoleLogger from './console.js'
import FileLogger from './file.js'

function createLogger(type = 'console') {
if (type === 'console') {

return new ConsoleLogger()
} else if (type === 'file') {

return new FileLogger()
}
throw new Error(`Logger type not found: ${type}`)
}

export default createLogger
// logger/index.js
import ConsoleLogger from './console.js'
import FileLogger from './file.js'

function createLogger(type = 'console') {
if (type === 'console') {

return new ConsoleLogger()
} else if (type === 'file') {

return new FileLogger()
}
throw new Error(`Logger type not found: ${type}`)
}

export default createLogger好了，这下我们的使用方式就会变成这样：
import createLogger from './logger'
// console logger
const logger1 = createLogger('console')
// file logger
const logger2 = createLogger('file')
import createLogger from './logger'
// console logger
const logger1 = createLogger('console')
// file logger
const logger2 = createLogger('file')重构一下上面的 if else 不是很优雅？如果有中 logger 类型添加起来很麻烦？那我们可以使用对象来映射一下，从而抛弃 if else，同时添加一个 logger 选项。
// logger/index.js
import ConsoleLogger from './console.js'
import FileLogger from './file.js'

const loggerMap = {
console: ConsoleLogger,
file: FileLogger
}
// 可选参数一般放在最后面
function createLogger(options, type = 'console') {
const Logger = loggerMap[type]
if (Logger) {

return new Logger(options)
}
throw new Error(`Logger type not found: ${type}`)
}
// logger/index.js
import ConsoleLogger from './console.js'
import FileLogger from './file.js'

const loggerMap = {
console: ConsoleLogger,
file: FileLogger
}
// 可选参数一般放在最后面
function createLogger(options, type = 'console') {
const Logger = loggerMap[type]
if (Logger) {

return new Logger(options)
}
throw new Error(`Logger type not found: ${type}`)
}上面这种封装的方式，其实也符合 SOLID 原则中的 开闭原则，即 对扩展开放，对修改关闭，每当我们添加一种 logger 类型时，只需要新增一个文件，然后将构造器注册进 loggerMap 中即可。而外面的使用方式都是不变的，这样就用最少的修改完成了功能的新增，是不是很棒呀~SOLID开闭原则对扩展开放，对修改关闭loggerloggerMap总结下面我们来回顾一下工厂模式的优点：

动态创建对象：可以用于需要在 运行时 确定对象类型的情况。

抽象：封装了对象创建的细节，用户不会接触到对象的构造器，只需要告诉工厂需要哪种对象。

可用性 / 可维护性：将相似的对象用一个工厂管理，提供统一的创建接口，满足 开闭原则，使我们可以轻松添加多种类型的对象，而无需修改大量代码。
动态创建对象：可以用于需要在 运行时 确定对象类型的情况。动态创建对象运行时抽象：封装了对象创建的细节，用户不会接触到对象的构造器，只需要告诉工厂需要哪种对象。抽象可用性 / 可维护性：将相似的对象用一个工厂管理，提供统一的创建接口，满足 开闭原则，使我们可以轻松添加多种类型的对象，而无需修改大量代码。可用性 / 可维护性开闭原则好啦~！工厂模式就介绍到这里啦~ 下次我们讲一讲装饰器模式~装饰器模式参考内容

JavaScript Object Oriented Patterns: Factory Pattern

《JavaScript 设计模式》

《JavaScript 面向对象编程指南》
JavaScript Object Oriented Patterns: Factory PatternJavaScript Object Oriented Patterns: Factory Pattern《JavaScript 设计模式》《JavaScript 面向对象编程指南》感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具：http://tools./code/HtmlJsRun测试上述代码运行效果。在线HTML/CSS/JavaScript代码运行工具在线HTML/CSS/JavaScript代码运行工具http://tools./code/HtmlJsRun关于JavaScript相关内容感兴趣的读者可查看本站专题：《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》javascript面向对象入门教程JavaScript错误与调试技巧总结JavaScript数据结构与算法技巧总结JavaScript遍历算法与技巧总结JavaScript数学运算用法总结希望本文所述对大家JavaScript程序设计有所帮助。