• class类的使用


    我们在ES5中经常使用方法或者对象去模拟类的使用,虽然可以实现功能,但是代码并不优雅,ES6为我们提供了类的使用。

    需要注意的是我们在写类的时候和ES5中的对象和构造函数要区分开来,不要学混了。

    类的声明

    先声明一个最简单的coder类,类里只有一个name方法,方法中打印出传递的参数。
    class coder{
        name(val){
            console.log(val);
        }
    }

    类的使用

    我们已经声明了一个类,并在类里声明了name方法,现在要实例化类,并使用类中的方法。
    class Person {
      name = "hello word";
      getName() {
        return this.name;
      }
    }
    const person = new Person();
    console.log(person.getName()); // hello word

    类的多方法声明

    class Coder{
        name(val){
            console.log(val);
            return val;
        }
        skill(val){
            console.log(this.name('js')+':'+'Skill:'+val);
        }
    }
    
    let zachary= new Coder();
    zachary.name('js');
    zachary.skill('web');
    这里需要注意的是两个方法中间不要写逗号了,还有这里的this指类本身,还有要注意return 的用法。

    类的传参

    在类的参数传递中我们用constructor( )进行传参。传递参数后可以直接使用this.xxx进行调用。
    class Coder{
        name(val){
            console.log(val);
            return val;
        }
        skill(val){
            console.log(this.name('js')+':'+'Skill:'+val);
        }
    
        constructor(a,b){
            this.a=a;
            this.b=b;
        }
    
        add(){
            return this.a+this.b;
        }
    }
    
    let zachary=new Coder(1,2);
    console.log(zachary.add());
    我们用constructor来约定了传递参数,然后用作了一个add方法,把参数相加。这和以前我们的传递方法有些不一样,所以需要小伙伴们多注意下。

    class的继承

    如果你学过java,一定知道类的一大特点就是继承。ES6中也就继承,在这里我们简单的看看继承的用法。
    class Person {
      name = "hello word";
      getName() {
        return this.name;
      }
    }
    class Teacher extends Person {
      getTname() {
        return "xx老师";
      }
    }
    const teacher = new Teacher();
    console.log(teacher.getName(), teacher.getTname()); // hello word xx老师

    重写(子类可以重写父类的东西)

    class Person {
      name = "hello word";
      getName() {
        return this.name;
      }
    }
    class Teacher extends Person {
      getTname() {
        return "xx老师";
      }
      getName() { //  重写父类的getName方法
        return "909";
      }
    }
    const teacher = new Teacher();
    console.log(teacher.getName(), teacher.getTname()); // 909 xx老师

    super 执行extends继承过来的父类方法

    如果子类调用constructor,那么子类必须在constructor方法中调用super方法,否则新建实例时会报错。这是因为子类没有自己的this对象,

    而是继承父类的this对象,然后对其进行加工。如果不调用super方法,子类就得不到this对象。
    在构造函数中使用时,super关键字单独出现,必须在可以使用this关键字之前使用。此关键字也可用于调用父对象上的函数。
    super拥有父类的全部方法
    使用场景就是当子类重写了父类的方法  但覆盖后还想调用父类的方法就可以使用super
    
    class Person {
      name = "hello word";
      getName() {
        return this.name;
      }
    }
    class Teacher extends Person {
      getTname() {
        return "xx老师";
      }
      getName() {
        return super.getName() + " 909";
      }
    }
    const teacher = new Teacher();
    console.log(teacher.getName(), teacher.getTname()); // hello word 909 xx老师

     使用实例

    class BaseModel {
        constructor(data,message){
            if(typeof data === 'string'){
                this.message = data
                data = null
                message = null
            }
            if(data){
                this.data = data
            }
            if(message){
                this.message = message
            }
        }
    }
    class SuccessModel extends BaseModel{
        constructor(data,message){
            super(data,message)
            this.error = 0
        }
    }
    class ErrorModel extends BaseModel{
        constructor(data,message){
            super(data,message)
            this.error = -1
        }
    }
    
    module.exports = {
        SuccessModel,
        ErrorModel
    }
    大致就是 两处不同的error错误状态不一样 一个-1一个0
    但是结构是一样的所以 可以共用父级结构 
    先继承父级结构  之后通过子类DIY
    class coders {
      constructor(a, b) {
        this.a = a;
        this.b = b;
      }
      name() {
        return this.a + this.b;
      }
    }
    class childer extends coders {
      constructor(a, b) {
        super(a, b);
        this.c = 3;
      }
    }
    let code = new childer(1, 2);
    console.log(code); // childer { a: 1, b: 2, c: 3 }
  • 相关阅读:
    三点求圆心坐标(三角形外心)
    半平面交
    旋转卡壳
    平面最近点对(HDU 1007)
    凸包
    ACM做题随做随思
    最短路径——SPFA算法
    树链剖分原理
    生成树的计数——Matrix-Tree定理
    次小生成树
  • 原文地址:https://www.cnblogs.com/Model-Zachary/p/7230495.html
Copyright © 2020-2023  润新知