微信扫一扫打赏支持

ES6课程---12、面向对象

ES6课程---12、面向对象

一、总结

一句话总结：

ES6中面向对象的写法就是普通的后端语言面向对象的写法，定义类用class关键字，继承通过extends关键字
//需求
//创建Animal类（name属性，say方法）
//创建Animal类的子类Bird类（age属性，fly方法）
class Animal {
  constructor(name) {
      this.name = name;
  }
  say() {
      console.log('我是'+this.name);
  }
}
class Bird extends Animal {
  constructor(name, age) {
      super(name);
      this.age = age;
  }
  fly() {
      console.log('我是'+this.name+','+this.age+'岁,我在自由自在的飞翔！');
  }
}
let animal1=new Animal('大动物');
animal1.say();
let monkey=new Bird('飞猴',15);
monkey.fly();

 

 

1、es6中类如何定义和使用？

类的定义和使用：通过class关键字定义类，在类中通过constructor定义构造方法，用new关键字来创建类的实例
//需求
//创建Animal类（name属性，say方法）
//创建Animal类的子类Bird类（age属性，fly方法）
class Animal {
  constructor(name) {
      this.name = name;
  }
  say() {
      console.log('我是'+this.name);
  }
}
class Bird extends Animal {
  constructor(name, age) {
      super(name);
      this.age = age;
  }
  fly() {
      console.log('我是'+this.name+','+this.age+'岁,我在自由自在的飞翔！');
  }
}
let animal1=new Animal('大动物');
animal1.say();
let monkey=new Bird('飞猴',15);
monkey.fly();

 

 

2、es6中类如何继承？

类的继承：通过extends来实现类的继承，通过super调用父类的构造方法，重写从父类中继承的一般方法
//需求
//创建Animal类（name属性，say方法）
//创建Animal类的子类Bird类（age属性，fly方法）
class Animal {
  constructor(name) {
      this.name = name;
  }
  say() {
      console.log('我是'+this.name);
  }
}
class Bird extends Animal {
  constructor(name, age) {
      super(name);
      this.age = age;
  }
  fly() {
      console.log('我是'+this.name+','+this.age+'岁,我在自由自在的飞翔！');
  }
}
let animal1=new Animal('大动物');
animal1.say();
let monkey=new Bird('飞猴',15);
monkey.fly();

 

3、类的继承意义何在？

子类继承父类之后可以获得父类的属性和方法

 

 

 

二、面向对象

博客对应课程的视频位置：12、面向对象
https://www.fanrenyi.com/video/24/213

 

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>12、面向对象</title>
 6 </head>
 7 <body>
 8 <!--
 9 
10 ES6中面向对象的写法就是普通的后端语言面向对象的写法，定义类用class关键字，继承通过extends关键字
11 
12 
13 类的定义和使用
14 1、通过class定义类
15 2、在类中通过constructor定义构造方法，构造方法来初始化类的属性
16 3、通过new来创建类的实例
17 
18 
19 类的继承意义何在
20 子类继承父类之后可以获得父类的属性和方法
21 
22 
23 类的继承具体语法
24 1、通过extends来实现类的继承
25 2、通过super调用父类的构造方法来初始化从父类继承过来的属性
26 3、重写可以覆盖父类中继承的方法
27 
28 
29 -->
30 <script>
31     // class Person {
32     //     //调用类的构造方法
33     //     constructor(name, age){
34     //         this.name = name;
35     //         this.age = age;
36     //     }
37     //     //定义一般的方法
38     //     showName(){
39     //         console.log(this.name, this.age);
40     //     }
41     // }
42     // let person = new Person('林冲', 29);
43     // console.log(person);
44     // person.showName();
45 
46 
47     //定义一个子类
48     //继承的话会继承父类的属性和方法
49     // class Student extends Person{
50     //     constructor(name, age, stuNum){
51     //         super(name, age);//调用父类的构造方法
52     //         this.stuNum = stuNum;
53     //     }
54     //     showName(){//在子类自身定义方法
55     //         console.log(this.name, this.age, this.stuNum);
56     //     }
57     // }
58     // let student = new Student('夏雨', 10, 22201901);
59     // console.log(student);
60     // student.showName();
61 </script>
62 
63 <script>
64     //需求
65     //创建Animal类（name属性，say方法）
66     //创建Animal类的子类Bird类（age属性，fly方法）
67     class Animal {
68         constructor(name) {
69             this.name = name;
70         }
71         say() {
72             console.log('我是'+this.name);
73         }
74     }
75     class Bird extends Animal {
76         constructor(name, age) {
77             super(name);
78             this.age = age;
79         }
80         fly() {
81             console.log(`我是${this.name},${this.age}岁,我在自由自在的飞翔！`);
82         }
83     }
84     let animal1=new Animal('大动物');
85     animal1.say();
86     let monkey=new Bird('飞猴',15);
87     monkey.say();
88     monkey.fly();
89 </script>
90 </body>
91 </html>

 

 

 

 

 

 
posted @ 2020-05-03 18:34  范仁义  阅读(305)  评论(0)  编辑  收藏  举报