js開發模式

js中的開發模式進化史：

---

js中有最初的只能由基本數據類型描述——》單例模式--》工廠模式--》構造函數模式--》原型模式--》各個模式相結合的混合模式，下面我會給大家逐一講解各個開發模式；

 1、單例模式

第一次模式升級引用了對象數據類型：

對象數據類型的作用級好處：

        1、分組，把描述同一個事物的所有屬性放在一起來描述，每一組都是一個單獨的個體（單獨的實例）；

        2、避免沖突-每一個分組中都有自己的私有屬性及值，和其他分組不會產生沖突。

var person ={
    name:"張松",
    age:26
}
var person1 = {
        name:"zys",
       age:26;
}

 

我們用以上對象把兩個個體實現了分組和獨立開，我們說每一個對象都是一個單獨的個體|實例    --這就是單例模式（就是一個普通的對象）；person不僅叫對象名還可以叫做”命名空間“；

單例模式可以實現簡易的”模塊化開發“

 

2、工廠模式：

單例模式雖然實現了分組的作用，但是還是處於手工作業模式，為了增加生產的效率，實現批量生產，就有了工廠模式；

工廠模式其實就是一個函數；

函數的封裝：把實現同一個功能的相同代碼放在一個函數中，以后再想實現這個功能的時候，我們只需要直接的執行這個函數就可，減少了頁面中的坑余代碼，提高代碼的重復使用率【低耦合高內聚】

 

function  sayHello(name){
   var obj={};
    obj.name = name;
　　obj.say= function(){ "Hello "+this.name};
　　return obj;
}

var person1 = sayHello("張松”）；
person1.say();

 

js中存在多態一詞，多態指的是一個方法的多種形態；

同一個方法根據執行時傳遞參數的不同（值不同、類型不同、參數數量不同）實現不一樣的功能的操作就叫做多態

 

3、構造函數：

構造函數模式：通過new一個類來創建一個實例；

構造函數模式和工廠模式的區別：

一般情況下，我們如果是通過構造函數來創建一個類的話，我們的類名第一個字母要大寫，這不是規范，而是大家約定的一個規律；

1、在執行時，構造函數模式是通過 new Object（）來執行的，我們把Object稱之為一個類，而通過類創建出來的結果（person)就是當前類的一個實例；

2、類也是一個函數，所以也會像普通函數執行一樣，形成私有的作用域，形參賦值，預解釋，代碼從上到下執行；但是構造函數模式在執行之前，瀏覽器默認會創建一個對象數據類型的值，並且會默認的把這個對象數據類型的值進行返回（不用自己手動的return返回了）

3、把瀏覽器默認創建的那個對象當做當前函數執行的整體（this）然后通過this。XXX這種方式給默認創建的對象添加屬性和屬性值

瀏覽器默認創建的這個對象其實就是我們當前類的一個實例

在構造函數模式創建一個類的時候，方法執行，里面的this其實就是我們當前類的一個實例

function SayHello(name){
   this.name = name;

　　this.say = function(){
　　　　alert("Hello"+this.name)
　　};
}

var p1 = new SayHello("張松“);
p1.say();//類都是函數數據類型的
//console.log(typeof CreateJsPerson);//-->"function"
//類創建出來的實例都是對象數據類型的
//console.log(typeof p1);//-->"object"

 

4、原型模式

// 首先需要構造函數, 原則就是將獨有的屬性和方法放在 對象中
    function Person ( name, age, gender ) {
        this.name = name;
        this.age = age;
        this.gender = gender;
    }

將共享的方法放到默認的 .prototype 原型中，而獨有的數據與行為放到對象中

 // 將共享的方法提取出來
    Person.prototype.sayHello = function () {
        console.log( '你好, 我是 ' + this.name );
    };
    Person.prototype.eat = function () {
        console.log( this.name + '在吃飯' );
    };
 
    Person.prototype.run = function () {
        console.log( this.name + '在跑步. 已經跑了 ' + this.age + ' 年' );
    };
 
    // 直接給原型對象添加成員
    var p1 = new Person( 'lilei', 19, '男' );
    var p2 = new Person( 'hanmeimei', 18, '女' );