JS設計模式之單例模式

在瞭解單例模式之前，我們要先搞懂什麼是設計模式：

比較官方的設計模式定義：就是在面向對象軟件設計過程中針對特定問題的簡潔而優雅的解決方案。
當然說白了就是：設計模式對某個特定場景下對某種問題的解決方案。

所以，我們在合適的場景下可能會條件反射一樣自然而然想到符合這種場景的設計模式。
所有的設計模式的共同目標都是：高內聚，低耦合。

我們在日常的開發當中，都或多或少地接觸了設計模式，但是很多時候不知道自己使用了哪種設計模式或者說該使用何種設計模式。其實我個人覺得哈，咱們用不着糾結該用什麼樣的設計模式，因爲有的時候在不經意間我們就已經使用了設計模式當中的一種。

-----------------分割線-----------------

好，下面我將結合一些實例，說一下我對單例模式的瞭解：

1、首先我們要大概的知道單例模式的概念：

• 單例模式也叫單體模式。
• 核心思想是保證一個類僅有一個實例，並提供一個訪問它的全局訪問點。
• 實現的方法爲先判斷實例存在與否，如果存在則直接返回，如果不存在就創建了再返回，這就確保了一個類只有一個實例對象。
• 說白了就是：多次創建同一個對象時，沒有必要創建多個對象，只需要一個即可。

2、適用場景：
①如果我們希望p1,p2是完全相等的應該怎樣做？

傳統代碼如下：

function Fn(){
        if(!Fn.obj){
            Fn.obj = {};
        }
        Fn.obj.sayHello = "hello";
        return Fn.obj;
    }
    let p1 = new Fn();
    let p2 = new Fn();

    console.log(p1 === p2);  // true

可以在構造函數上創建一個instance變量來保存實例。如果實例存在則直接返回，如果不存在則創建一個保存在instance屬性中並返回。

// 首先封裝一個構造函數
function Person(){}
// 封裝一個單例模式的調用方式
let f = (function(){

    let instance;    

    return function(){
        if(!instance){
            instance = new Person();
        }
        return instance;
    }
})();

let p1 = f();
let p2 = f();

console.log(p1); // Person
console.log(p2); // Person

console.log(p1 === p2); // true

②我們平時在使用的過程中，肯定還會用到DOM節點，也就是在下面的代碼中的init函數中去創建DOM元素，但是這樣操作就會導致每次創建實例的時候都創建一次DOM節點，這顯然是不正確的，因此，我們可以把DOM的創建過程提到函數頂部，也就是程序一開始直接創建一個DOM節點，僅在init中去修改裏面的內容。這樣是不是就省了好多事。

function Msg(){
    this.ele = document.createElement("div");
    document.body.appendChild(this.ele);
}
Msg.prototype.init = function(str){
    this.ele.innerHTML = str;
}

let singleCase = (function (){
    let instance;
    return function(text){
        if(!instance){
            instance = new Msg();
        }
        instance.init(text);
        return instance;
    }
})();

let m1 = singleCase("hello");
let m2 = singleCase("world");
console.log(m1===m2); // true

注意：
當在一個命名空間A中調用別的命名空間B中的函數的時候，調用方法爲B.functionName();

當在一個命名空間A中調用自己空間中的函數的時候，調用方法爲 this.functionName()。