资讯专栏INFORMATION COLUMN

JS设计模式-单例模式

sPeng / 2997人阅读

摘要:单例模式是一个用来划分命名空间并将一批属性和方法组织在一起的对象,如果它可以被实例化,那么它只能被实例化一次。

单例模式是一个用来划分命名空间并将一批属性和方法组织在一起的对象,如果它可以被实例化,那么它只能被实例化一次。

原文链接

单例模式优点

划分命名空间,减少全局变量

组织代码为一体,便于阅读维护

并非所有的对象字面量都是单例,比如模拟数据
基本结构:
let Cat = {
   name: "Kitty",
   age: 3,
   run: ()=>{
      console.log("run");
   }
}

上面对象字面量结构是创建单例模式的方法之一,但并不是单例模式,单例模式的特点是仅被实例化一次
要实现单例模式可以使用变量来标示该类是否被实例

基本实现:
class Singleton {
    constructor(name){
        this.name = name;
        this.instance = null;
    }
    getName(){
        return this.name;
    }
}

let getInstance = (()=> {
    let instance;
    return (name)=> {
        if(!instance) {
            instance = new Singleton(name);
        }
        return instance;
    }
})()

let cat1 = getInstance("Hello");
let cat2 = getInstance("Kitty");
console.log(cat1 === cat2); //true
console.log(cat1.getName()) //"Hello"
console.log(cat2.getName()) //"Hello"

用instance变量标示实例Singleton,如果没有实例创建一个,如果有则直接返回实例,由于仅能被实例化一次,cat2得到的实例和cat1相同

实用
在创建dom元素时为避免重复创建,可以使用单例模式创建

//单例模式
let createModal = function() {
    let content = document.createElement("div");
    content.innerHTML = "弹窗内容";
    content.style.display = "none";
    document.body.appendChild(content);
}

//代理获取实例
let getInstance = function(fn) {
    let result
    return function() {
        return result || (result = fn.apply(this,arguments));
    }
}

let createSingleModal = getInstance(createModal);
document.getElementById("id").onclick = function(){
    let modal = createSingleModal();
    modal.style.display = "block";
};

单例模式是一种简单却非常使用的设计模式,在需要时创建实例,并且只创建唯一一个

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/88891.html

相关文章

  • JS 单例模式

    摘要:但是如何在对构造函数使用操作符创建多个对象的时候仅获取一个单例对象呢。单例的实例引用单例构造函数单例私有属性和方法暴露出来的对象改进之前在构造函数中重写自身会丢失所有在初始定义和重定义之间添加到其中的属性。 1. 单例模式 单例模式 (Singleton) 的实现在于保证一个特定类只有一个实例,第二次使用同一个类创建新对象的时候,应该得到与第一次创建对象完全相同的对象。当创建一个新对象...

    姘存按 评论0 收藏0
  • 浅谈js单例模式

    摘要:单例模式说到单例设计模式,中经常使用的单例模式通常分两种,懒汉模式和饿汉模式懒汉模式简单写了下私有化构造函数在获取实例的方法中返回实例化对象虽然很多大佬都写过啦,但是小生为了加深记忆便再写一遍虽然实现了单例模式,但是未考虑到线程安全,多个线 java单例模式 说到单例设计模式,Java中经常使用java的单例模式通常分两种,懒汉模式和饿汉模式 懒汉模式 class singleDemo...

    draveness 评论0 收藏0
  • js设计模式--单例模式

    摘要:文章系列设计模式单例模式设计模式策略模式设计模式代理模式概念单例模式的定义是保证一个类仅有一个实例,并提供一个访问它的全局访问点。在开发中,单例模式的用途同样非常广泛。 前言 本系列文章主要根据《JavaScript设计模式与开发实践》整理而来,其中会加入了一些自己的思考。希望对大家有所帮助。 文章系列 js设计模式--单例模式 js设计模式--策略模式 js设计模式--代理模式 概念...

    CloudwiseAPM 评论0 收藏0
  • js常用设计模式实现(一)单例模式

    摘要:什么是设计模式设计模式是一种能够被反复使用,符合面向对象特性的代码设计经验的总结,合理的使用设计模式能够让你得代码更容易维护和可靠设计模式的类型共分为创建型模式,结构型模式,行为型模式三种创建型模式创建型模式是对一个类的实例化过程进行了抽象 什么是设计模式 设计模式是一种能够被反复使用,符合面向对象特性的代码设计经验的总结,合理的使用设计模式能够让你得代码更容易维护和可靠设计模式的类型...

    EscapedDog 评论0 收藏0
  • 从ES6重新认识JavaScript设计模式(一): 单例模式

    摘要:什么是单例模式单例模式是一种十分常用但却相对而言比较简单的单例模式。对象就是单例模式的体现。总结单例模式虽然简单,但是在项目中的应用场景却是相当多的,单例模式的核心是确保只有一个实例,并提供全局访问。 1. 什么是单例模式? 单例模式是一种十分常用但却相对而言比较简单的单例模式。它是指在一个类只能有一个实例,即使多次实例化该类,也只返回第一次实例化后的实例对象。单例模式不仅能减少不必要...

    G9YH 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<