1. 程式人生 > >es5 es6靜態方法、類、單例模式

es5 es6靜態方法、類、單例模式

原聲js的類,靜態方法繼承

/**
 * 
 */
//es5中的類和靜態方法
//
//    function Person(name,age) {
//        //建構函式裡面的方法和屬性
//        this.name=name;
//        this.age=age;
//        this.run=function(){
//            console.log(`${this.name}---${this.age}`)
//        }
//    }
//    //原型鏈上面的屬性和方法可以被多個例項共享
//    Person.prototype.sex='男';
//    Person.prototype.work=function(){
// console.log(`${this.name}---${this.age}---${this.sex}`); // } // //靜態方法 // Person.setName=function(){ // console.log('靜態方法'); // } // var p=new Person('zhangsan','20'); /*例項方法是通過例項化來呼叫的,靜態是通過類名直接呼叫*/ // p.run(); // p.work(); // // Person.setName(); /*執行靜態方法*/ // //es5繼承 /* 原型鏈繼承和物件冒充繼承 物件冒充繼承:沒法繼承原型鏈上面的屬性和方法 原型鏈繼承:可以繼承建構函式裡面以及原型鏈上面的屬性和方法,例項化子類的時候沒法給父類傳參 * */
function Person(name,age) { this.name=name; this.age=age; this.run=function(){ console.log(this.name+'---'+this.age); } } Person.prototype.work=function(){ console.log('work'); } function Web(name,age){ Person.call(this,name,age); /*物件冒充實現繼承*/ } Web.prototype=new Person(); var
w=new Web('李四',20); w.run(); w.work(); //w.work is not a function

es6中的類、靜態方法 繼承

/**
 * 
 */

//定義Person類
//
//class Person{
//    constructor(name,age) {   /*類的建構函式,例項化的時候執行,new的時候執行*/
//        this._name=name;
//        this._age=age;
//    }
//    getName(){
//        console.log(this._name);
//
//    }
//    setName(name){
//        this._name=name
//    }
//}
//var p=new Person('張三1','20');
//p.getName();
//p.setName('李四');
//p.getName();



//es6裡面的繼承
    //
    //class Person{
    //    constructor(name,age){
    //        this.name=name;
    //        this.age=age;
    //    }
    //    getInfo(){
    //        console.log(`姓名:${this.name} 年齡:${this.age}`);
    //    }
    //    run(){
    //        console.log('run')
    //    }
    //}
    //class Web extends Person{  //繼承了Person     extends          super(name,age);
    //    constructor(name,age,sex){
    //        super(name,age);   /*例項化子類的時候把子類的資料傳給父類*/
    //        this.sex=sex;
    //    }
    //    print(){
    //
    //        console.log(this.sex);
    //    }
    //}
    //var w=new Web('張三','30','男');
    //w.getInfo();


//es6裡面的靜態方法

class Person{

    constructor(name){

        this._name=name;  /*屬性*/
    }
    run(){  /*例項方法*/

        console.log(this._name);
    }
    static work(){   /*靜態方法*/
        console.log('這是es6裡面的靜態方法');
    }
}
Person.instance='這是一個靜態方法的屬性';


var p=new  Person('張三');

p.run();
Person.work();   /*es6裡面的靜態方法*/

console.log(Person.instance);

單例模式

/**
 * 
 */
//單例只執行一次建構函式 這樣咱們以後在連線資料庫的時候不會重複連線從而導致的資源浪費
class Db {

    static getInstance(){   /*單例*/

        if(!Db.instance){

            Db.instance=new Db();
        }
        return Db.instance;
    }

    constructor(){

        console.log('例項化會觸發建構函式');

        this.connect();
    }

    connect(){

        console.log('連線資料庫');
    }
    find(){
        console.log('查詢資料庫');
    }
}

var myDb=Db.getInstance();


var myDb2=Db.getInstance();


var myDb3=Db.getInstance();


var myDb4=Db.getInstance();

myDb3.find();

myDb4.find();