ES5和ES6中的静态方法、类、单例模式

2020-02-03 20:01:23 阅读：217 来源： 互联网

标签：ES6 ES5 静态方法 name age Person console log

//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);

ES6单例模式

/**
 * Created by Administrator on 2018/3/17 0017.
 */

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();

标签：ES6,ES5,静态方法,name,age,Person,console,log
来源： https://www.cnblogs.com/loaderman/p/11511902.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

ES5和ES6中的静态方法、类、单例模式