JavaScript设计模式之对单例模式的一些见解
程序员文章站
2022-04-03 19:41:54
JavaScript设计模式之对单例模式的一些见解
JavaScript设计模式主要分类:
①创建型设计模式,例如单例模式、工厂模式
②结构型设计模式,例如装饰者模式、适配器...
JavaScript设计模式之对单例模式的一些见解
JavaScript设计模式主要分类:
①创建型设计模式,例如单例模式、工厂模式
②结构型设计模式,例如装饰者模式、适配器模式
③行为型设计模式,例如观察者模式、访问者模式
④技巧型设计模式,例如委托模式、数据访问队形模式
⑤结构型设计模式,例如MVC模式、MVVM模式、MVP模式
本文讨论的是JavaScript中最常见的设计模式:单例模式,适合对JavaScript设计模式没什么太多了解的伙伴。
单例模式出现的背景:
以下为一段用于前后端交互的js
function getUserInfo() { // 获取用户信息 } function setUserInfo(param) { // 设置用户信息 } function getCount() { // 登录 } function logout() { // 注销 }
这样写的弊端:因为function getUserInfo(){}相当于 var getUserInfo = function(){},产生了很多全局变量,例子举的例子算是比较特殊的了,如果是比较大众一点的变量名,就很容易产生冲突。
如何解决?
使用单例模式定义命名空间:
var requestUtil = { getUserInfo: function () { // 获取用户信息 }, setUserInfo: function (param) { // 设置用户信息 }, login: function () { // 登录 }, logout: function () { // 注销 } }
函数的调用:当需要获取用户信息时,requestUtil.getUserInfo()即可。
使用单例模式创建小型代码库:
var X = { Util: { util1: function () {}, util2: function () {} }, Ajax: { get: function () {}, post: function () {} }, Others: { function1: function () {}, function2: function () {} } }
使用方法:X.Ajax.get()
使用单例模式管理静态变量:
背景:我们都知道,JavaScript没有static这类关键字,所以定义任何变量理论上都是可以改变的(ES6前,因为ES6出现了类似的const,用于定义常量),那么在ES6前,想定义一个静态变量,原意是不想改变的,可实质上它又能被改变,应该如何做到不能被改变?答案如下:
var Conf = (function () { // 私有变量 var conf = { MAX_NUM: 100, MIN_NUM: 1, COUNT: 1000 } // 返回取值函数 return { get: function (name) { retrun conf[name] conf[name] : null } } })()
没有定义赋值函数,因此里边的变量自然就不能被改变。
使用方法: var count = Conf.get('MAX_NUM')
惰性单例:
说明:用于延迟单例对象的创建,即惰性创建。
var LazySingle = (function () { var _instance = null function Single () { return { publicMethod: function () { return this.publicProperty }, publicProperty: '1.0' } } return function () { if (!_instance) { _instance = new Single() } return _instance } })() console.log(LazySingle().publicMethod())