ES6 Class基本使用和继承

最新推荐文章于 2023-05-21 15:47:45 发布

yiyiyiyi_

最新推荐文章于 2023-05-21 15:47:45 发布

阅读量318

点赞数 1

本文链接：https://blog.csdn.net/qiqiyiyi_/article/details/103602715

版权

本文介绍了ES6的Class特性，包括类的基本使用、构造方法、实例化、静态属性和方法。讲解了Class的实例属性、静态属性与静态方法，并深入探讨了类的继承、this和super关键字的用法。通过案例分享，帮助读者理解和应用Class。

摘要由CSDN通过智能技术生成

Class基本使用和继承

内容大纲：

                     1、Class的使用和构造方法
                     2、类的实例
                     3、类的继承、this和super关键字
                     4、案例分享（便于理解class类）

一、Class的使用和构造方法

1.1 Class 类概述

ES6 引入了 Class（类）这个概念，作为对象的模板。可以通过 class 关键字定义类。
class 的本质是一个 function函数。
它可以看作一个语法糖，让对象原型的写法更加清晰、更像面向对象编程的语法。

1.2 Class 类的基础用法

// 定义一个类
class Example {
   
    constructor(a,b) {
   
        this.a = a;
        this.b = b;
    };
};

注意：

虽然class类相当于一个function但是不用像创建一个function一样在函数名后面加括号，加了反而错了
class 类声明不能重复

1.3 Class 类的构造方法（constructor 方法）

// constructor 方法是类的默认方法，创建类的实例化对象时被调用。
class Example{
   
    constructor(){
   
      console.log('hello world');
    }
}
new Example(); // hello world
// constructor方法，如果没有显式定义，一个空的constructor方法会被默认添加。
class Example{
   
}
// 等同于
class Example{
   
    constructor(){
   
    }
}
// 即 定义了一个空的类Example，JavaScript 引擎会自动为它添加一个空的constructor方法。

二、类的实例

2.1 类的实例化

// 定义一个类
class Example {
   
	//代码块
};
// 实例化一个类
var  example = new Example();

2.2 实例属性和实例方法

// 实例属性：定义在实例对象（ this ）上的属性。
class Example {
   
    a = 2;
    constructor () {
   
        console.log(this.a);
    }
}
// 实例方法
class Example {
   
    constructor() {
   
        this.sum = (a, b) => {