JS设计模式——单例模式

作者 : 开心源码 本文共1332个字,预计阅读时间需要4分钟 发布时间: 2022-05-11 共77人阅读

JS设计模式——单例模式

命名空间

单例模式是JavaScript中最常见的一种模式,通过这种模式能为我们提供一个命名空间,例如jQuery库的命名空间为jQuery或者$。命名空间的用是为了让代码更加整洁,在多人协作开发的情况下,不同的人定义的变量很有可可以重复,此时就需要用命名空间来束缚每个人定义的变量,使相同名称的变量放在不同的命名空间中,避免相互干扰。例如:

// A程序员的命名空间var A = { get: function(id){ return document.getElementById(id); } css: function(id,key,value){ get(id).style[key] = value; }}// B程序员的命名空间var B = { get: function(className){ return document.getElementByClassName(className)[0]; } css: function(className,key,value){ get(className).style[key] = value; }}

A、B两个命名空间中都有一个get方法和一个css方法,使用于元素获取和元素样式修改,不同的是A是通过id来获取元素,而B是通过class来获取元素,通过命名空间,能使这些相同名称的方法共存,用时指定相应的命名空间就可。

板块化

JavaScript中单例模式除了定义命名空间之外,还可使用于管理代码库的各个功可以板块。例如:

google.dom.addClass // 增加元素类google.dom.append // 插入元素google.event.stopPropagation // 阻止事件冒泡google.event.preventDefault // 阻止默认行为google.string.trim // 去除字符串首尾空格google.string.encodeHTML // 将字符串进行HTML编码

以上各个板块都位于google命名空间下,每个板块都有属于自己的方法,用时只要按照需求调使用特定功可以板块下对应的方法就可。

常量

JavaScript中并没有finalstatic这类关键字使用来定义常量,但JavaScript非常灵活,通过常量只可以访问不可以修改这一特点,我们能将变量保存在函数内部,并且只提供获取变量的方法,不提供设置变量的方法,通过闭包的方式使函数执行一次并返回相应的访问方法对象,最后将这个对象放在全局空间中作为常量单例对象用。例如:

var Color = (function(){ // 私有变量 var color = { 'RED': '#ff0000', 'YELLOW': '#ffff00', 'BLUE': '#0000ff' } // 返回访问方法对象 return { // 常量获取方法 get: function(name){ return color[name] ? color[name] : null; } }})();var color = Color.get('BLUE');console.log(color); // #0000ff
说明
1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长!
2. 分享目的仅供大家学习和交流,您必须在下载后24小时内删除!
3. 不得使用于非法商业用途,不得违反国家法律。否则后果自负!
4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
5. 如有链接无法下载、失效或广告,请联系管理员处理!
6. 本站资源售价只是摆设,本站源码仅提供给会员学习使用!
7. 如遇到加密压缩包,请使用360解压,如遇到无法解压的请联系管理员
开心源码网 » JS设计模式——单例模式

发表回复