美文网首页
ES6 面向对象对比 老版本

ES6 面向对象对比 老版本

作者: 崩鲨卡拉卡 | 来源:发表于2019-02-20 14:21 被阅读0次
    222.jpg

    - ES5及之前

    原来的面向对象:
    • 类和构造函数一样
    • 属性和方法是分开写的
    如下:
     function oldObj(name,ages){
                    this.name=name;
                    this.ages=ages;
                }
                oldObj.prototype.getName=function(){
                    console.log(this.name);
                }
                oldObj.prototype.getAges=function(){
                    console.log(this.ages);
                }
    
                var obj=new oldObj('张健','26')
                obj.getAges();
                obj.getName();
    
    关于继承 等 详细,之前的笔记ES5基于call的继承

    - ES6 的面向对象

    • ES6中 class 、构造器、类 分开了
    • class 里面直接 添加方法
    添加了新的关键字:class、constructor、static、extends、super (父类====java的超类)
    类的所有方法都是定义在类的 prototype 属性上:
    class Animal {
      constructor() { ... };
      toString() { ... };
      getName() { ... };
    }
    
    // 等价于
    Animal.prototype = {
      constructor() {},
      toString() {},
      getName() {}
    }
    
    实例:继承
     class User{
                constructor(name,pwd){
                    this.name=name;
                    this.pwd=pwd;
                }
    
                showName(){
                    alert(this.name)
                }
            }
            
           vipUser  继承 User 
            class vipUser extends User{
                constructor(name,pwd,level){
                    // super 
                    super(name,pwd)
                    this.level=level
                }
                showLevel(){
                    alert(this.level)
                }
            }
    
            创建 vipUser对象 的实例
            var vip=new vipUser('zhangjian','123456','lv90')
            vip.showLevel();
    
    

    相关文章

      网友评论

          本文标题:ES6 面向对象对比 老版本

          本文链接:https://www.haomeiwen.com/subject/rpgxyqtx.html