微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

ES6系列---【面向对象语法】

1 基本结构

  // ES6使用 class 来声明一个类
  class Person {
    // 类中必须要有构造函数,即使不写,js引擎会自动创建一个空的constructor。
    // 构造函数的作用:主要是为实例化空对象添加属性
    // 构造函数在类的实例化时,会自动运行。因此可以将实例化后需要自动运行的方法放在构造函数内。
    constructor(name,sex){
      this.name = name;
      this.sex = sex;
      this.say();
    }
    // 普通的方法
    say(){
      console.log( "我是"+ this.name );
    }
    // ES6新增 静态方法(静态函数)
    static play(){
      console.log("我是静态方法");
    }
  }
  // 实例化
  let p1 =  new Person("张三","男");
  let p2 = new Person("rose","女");
  // 所有实例对象共享原型对象
  console.log( p1.__proto__ == p2.__proto__ ); 
  console.log( p1 );
  // 静态方法只能使用 类名.静态方法() 调用
  Person.play()

2 类中的静态方法

​ 正常情况下所有类中定义的方法,都会被实例继承。但如果一个方法加上static关键字,就表示该方法不会被实例继承。也不能被实例调用,而是直接通过类来调用,这个被称为“静态方法”。

  // 静态方法只能使用 类名.静态方法() 调用
  Person.play()

3 实现继承

​ ES6 子类中使用 extends 即可实现继承

// 定义子类,继承Person父类
// ES6 使用 extends 关键词实现继承,比ES5的修改原型对象实现继承,要清晰和方便。
class Girl extends Person{

}
// 即使子类是个空壳,目前也可以使用父类的静态方法
Girl.play()

子类的基本构造:

// 定义子类,继承Person父类
// ES6 使用 extends 关键词实现继承,比ES5的修改原型对象实现继承,要清晰和方便。
class Girl extends Person{
  constructor(){
    // 子类的构造函数中第一行需先调用 super(),用于实现继承
    super();
  }
  go(){

  }
  say(){
    
  }
}

如果想在子类中添加自己的属性

1) 直接在子类的构造函数添加

  constructor(name,sex,age){
    // 子类的构造函数中第一行需先调用 super(),用于实现继承
    super();
    this.name = name;
    this.sex = sex;
    this.age = age;
  }

2)在super()添加父类属性名,实现对父类代码的“借用”

  constructor(name,sex,age){
    // 子类的构造函数中第一行需先调用 super(),用于实现继承
    super(name,sex);
    this.age = age;
  }

3)假如子类和父类有重名的方法,可以使用super 关键词实现子类对父类方法调用

class Girl extends Person{
  constructor(name,sex,age){
    // 子类的构造函数中第一行需先调用 super(),用于实现继承
    super(name,sex);
    this.age = age;
  }
  go(){
    super.say();//调用父类的say方法
  }
  // say(){
  //   console.log("我是子类的say方法");
  // }
}

​ 实际上,super有两种使用方式:

​ 1) 在子类的构造函数的第一行,作为函数使用,用于实现子类对父类属性代码“借用”

​ 2) 作为对象使用,实现子类对父类的重名的方法调用

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐