javascript设计模式(一)

406 阅读2分钟

在使用js时,开发者经常遇到的一些编码问题可以通过一些比较完善的设计模式来解决,不过因为javascript并不是传统的面向对象编程语言,所以设计模式对更难被识别,但是并非不可以实现。

下面记录一些javascript比较常见的设计模式

创建型模式

原型模式

这是一个专门用于对象的属性clone为新对象的设计模式,因此才有一个关键词prototype,javascript通过创建对象实现这种设计模式,所以建立自己的原型是一种非常重要的设计模式。

function Hello (greeting) {
  this.greeting = greeting || 'Hello World!';
}

Hello.prototype.speak = function (somethingElse) {
  var message = somethingElse || this.greeting;
  console.log(message);
};

var hi = new Hello('Just saying hi!');

hi.speak();
hi.speak('Something different');

var hello = new Hello();
hello.speak();
hello.speak('Yep');

javascript中,ES6引入了class,如果要实现这种设计模式,可以直接创建一个class,但重要的是要知道这是现有原型模式之上的语法糖。

模块模式

模块模式可能是在原型模式后最常使用的模式,模块应该是一个立即调用的函数表达式IIFE,所有的模块代码都存在一个闭包中,通过函数执行来导入变量,通过返回一个对象来导出变量(暴露变量)。

为什么要使用模块模式,模块应该在任意系统中使用而不是在一个函数中,它对防止污染全局变量并保持函数的可导入/可导出很有用

var options = {
  username: 'blah',
  server: '127.0.0.1',
};
var ConfigObject = (function (params) {
  var username = params.username || '',
    server = params.server || '',
    password = params.password || '';
  function _checkPassword () {
    if (this.password === '') {
      console.log('no password!');
      return false;
    }
    return true;
  }
  function _checkUsername () {
    if (this.username === '') {
      console.log('no username!');
      return false;
    }
    return true;
  }
  function login () {
    if (_checkPassword() && _checkUsername()) {
      // perform login
    }
  }
  return {
    login: login,
  };
})(options);

单例模式

单例对象的创建应该是自调用的,意味着它将在定义时执行并存储实例。

什么时候使用单例模式,当你只想要一个对象的一个实例时,使用单例模式。在被请求时,单例接口将返回该实例。

var GlobalConfigurationObject = (function () {
  var instance;
  function createInstance () {
    return new ConfigObject();
  }

  var getInstance = function () {
    if (!instance) {
      instance = createInstance();
    }
    return instance;
  };

  return {
    getInstance: getInstance,
  };
})();