码迷,mamicode.com
首页 > 其他好文 > 详细

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

时间:2021-04-16 12:05:56      阅读:0      评论:0      收藏:0      [点我收藏+]

标签:共享   let   因此   实现   构造   pre   代码   new   直接   

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) 作为对象使用,实现子类对父类的重名的方法的调用

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

标签:共享   let   因此   实现   构造   pre   代码   new   直接   

原文地址:https://www.cnblogs.com/chenhaiyun/p/14664094.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!