美文网首页
ES6 class关键字(extends,super,stati

ES6 class关键字(extends,super,stati

作者: 那是尿尿的地方 | 来源:发表于2019-11-22 10:39 被阅读0次

    es5中生成对象通过构造函数

    function A(name,age){
          this.name=name;
          this.age=age
        }
        // 在A的prototype属性上定义一个test方法,即A生成的实例化对象的原型对象上的方法
        A.prototype.test=function(){
          return this.name+' '+this.age
        }
    
        var a1=new A('dog',99)
        console.log(a1.test())//dog 99
    

    在es6中,引入了class关键字,上面代码等价于下面:

    class B{
          constructor(name,age){
            this.name=name
            this.age=age
          }
          test(){
            return this.name+' '+this.age
          }
        }
        var b1=new B('dog',99)
        console.log(b1.test())//dog 99
    

    class中的静态方法:static

    class C{
          //没有写上constructor,默认会生成一个空的构造函数
          static foo(){//注意:class里面函数不用添加function;
          // 函数前面添加一个static关键字,表明这是一个静态方法,不会被实例继承,只能通过类来调用
            console.log(100)
          }
        }
        let c1=new C()
        // c1.foo()报错
        C.foo()//100
    

    继承:class可以通过extends关键字继承,对比es5修改原型链简单直观方便许多

    注意:子类中如果写了构造函数contructor,那么一定要在里面使用super方法,同时只有使用了super方法才能使用this!当然如果没有构造函数,那么默认会生成一个构造函数

    class D{
          constructor(age,email){
            this.age=age
            this.email=email
          }
          static test(){
            console.log(10)
          }
        }
        class E extends D{
          constructor(age,email,weight){
            super(age+'E',email+'E')//这里的super指向的是父类
            this.weight=weight
          }
        }
        let e1=new E(10,'100@qq.com',100)
        console.log(e1)//E {age: "10E", email: "100@qq.comE", weight: 100}
        E.test()//10,说明父类的静态方法可以被子类继承;但同理实例对象无法访问
        // e1.test()//报错
    
    

    相关文章

      网友评论

          本文标题:ES6 class关键字(extends,super,stati

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