欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

JS设计模式之单例模式(一)

程序员文章站 2022-04-09 21:49:32
命名空间 单例模式是javascript中最常见的一种模式,通过这种模式可以为我们提供一个命名空间,例如jquery库的命名空间为jquery或$。命名空间的使用是为...

命名空间

单例模式是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中并没有final、static这类关键字用来定义常量,但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

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。