腾讯T4大佬十分钟带你掌握 JS 的 7 种设计模式

当启动一个新的项目时候，我们不应该马上开始编程。而是首先应该定义项目的目的和范围，然后列出其功能或规格。如果你已经开始编程或者正在从事一个复杂的项目，则应该选择一个最适合你项目的设计模式。

什么是设计模式？

在软件工程中，设计模式是针对软件设计中常见问题的可重用解决方案。设计模式也是经验丰富的开发人员针对特定问题的最佳实践。它可以被当作编程的模板。

为什么要使用设计模式？

许多工程师要么认为设计模式浪费时间，要么不知道如何恰当的使用设计模式。但如果能正确使用设计模式，则可以帮助你写出更好的可读性更高的代码，并且代码更容易被维护和理解。

最重要的是，设计模式为软件开发人员提供了通用的词汇表。它们能让学习你代码的人很快了解代码的意图。例如，如果你的项目中使用了装饰器模式，那么新的开发可以很快就知道这段代码的作用，从而他们可以将更多精力放在解决业务问题上，而不是试图理解代码在做什么。

我们已经知道了什么是设计模式和它的重要性，下面我们深入研究一下 JavaScript 中的 7 种设计模式。

一、模块模式

模块是一段独立的代码，因此我们可以更新模块而不会影响代码的其它部分。模块还允许我们通过为变量创建单独的作用域来避免命名空间污染。当它们与其它代码解耦时，我们还可以在其它项目中重用模块。

模块是任何现代 JavaScript 应用程序不可或缺的一部分，有助于保持代码干净，独立和有条理。在 JavaScript 中有许多方法可以创建模块，其中一种是模块模式。

与其它编程语言不同，JavaScript 没有访问修饰符，也就是说，你不能将变量声明为私有的或公共的。因此，模块模式也可用来模拟封装的概念。

模块模式使用 IIFE（立即调用的函数表达式），闭包和函数作用域来模拟封装的概念。例如：

const myModule = (function() {  
  const privateVariable = 'Hello World';  
  function privateMethod() {
    console.log(privateVariable);
  }
  return {
    publicMethod: function() {
      privateMethod();
    }
  }
})();
myModule.publicMethod();

由于是 IIFE 因此代码会被立即执行，并将返回对象赋值给了 myModule 变量。由于闭包，即使在 IIFE 完成后，返回的对象仍可以访问 IIFE 内部定义的函数和变量。

因此，IIFE 内部定义的变量和函数对外部是看不见的，从而使其成为 myModule 模块的私有成员。

执行代码后，myModule 变量看起来像下面所示：

const myModule = {
  publicMethod: function() {
    privateMethod();
  }};

因此当我们调用 publicMethod() 时候，它将调用 privateMethod() 例如：

// Prints 'Hello World'
module.publicMethod();

二、揭示模块模式

揭示模块模式是 Christian Heilmann 对模块模式的略微改进。模块模式的问题在于，我们必须创建新的公共函数才能调用私有函数和变量。

在这种模式下，我们将返回的对象的属性映射到要公开暴露的私有函数上。这就是为什么将其称为揭示模块模式。例如：

const myRevealingModule = (function() {  
  let privateVar = 'Peter';
  const publicVar  = 'Hello World';
  function privateFunction() {
    console.log('Name: '+ privateVar);
  }
  
  function publicSetName(name) {
    privateVar = name;
  }
  function publicGetName() {
    privateFunction();
  }
  /** reveal methods and variables by ass