JavaScript ES6类的主要功能

标题JavaScript ES6类的主要功能

JavaScript ES6(ECMAScript 6)引入了类(Class)的概念,这是对JavaScript面向对象编程模型的一种更清晰、更简洁的语法糖。虽然在ES6之前,我们可以通过构造函数和原型链实现类似类的行为,但ES6中的类语法更加接近传统面向对象语言如Java或C#。

1.类声明:使用class关键字来定义一个类

复制代码
class Person {
  // ...
}

2.构造函数:类中定义的特殊方法constructor用于创建并初始化新实例

复制代码
class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
}

3.实例属性和方法:在类内部可以定义实例属性和方法,这些将被所有类的实例共享

复制代码
class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
  sayHello() {
    console.log(`Hi, I am ${this.name} and I am ${this.age} years old.`);
  }
}

4.静态属性和方法:使用static关键字定义的属性和方法属于类本身,而不是其任何实例。

复制代码
class Person {
  static species = "Human";
  static getSpecies() {
    return this.species;
  }
}
console.log(Person.getSpecies()); // 输出 "Human"

5.继承:通过extends关键字实现类之间的继承关系,并且子类可以使用super关键字调用父类的构造函数或其他方法

复制代码
class Employee extends Person {
  constructor(name, age, position) {
    super(name, age);
    this.position = position;
  }

  introduceYourself() {
    super.sayHello();
    console.log(`I work as a ${this.position}.`);
  }
}

6.getter 和 setter:类中可以定义访问器属性(getter/setter),用来控制对对象属性的读取和赋值操作

复制代码
class Person {
  constructor(name, age) {
    this._age = age;
  }

  get age() {
    return this._age;
  }

  set age(value) {
    if (value >= 0) {
      this._age = value;
    } else {
      console.error("Age cannot be negative.");
    }
  }
}
相关推荐
CoderYanger21 分钟前
Java EE 进阶:4.Spring Web MVC 入门(第一弹)
java·开发语言·前端·spring·面试·java-ee·mvc
估值探索者35 分钟前
【Python量化选股流水线 #04】选股器好不好用?「昨日候选→今日表现」回看验收
开发语言·python·股票数据·股票数据api接口
szp200542 分钟前
Cache API 会丢掉 URL 里的 #:我的 9 个模型分块一直写在同一条缓存上
javascript·浏览器
keyipatience1 小时前
TypeScript学习(1)
前端·javascript·学习·typescript·html·css3
爱喝热水的呀哈喽2 小时前
HEJIAN RESEARCH
开发语言·matlab
白露与泡影2 小时前
后端 Java 面试核心八股汇总|高频面试题 + 解析,覆盖基础到进阶
java·开发语言·面试
xifangge20252 小时前
基于 JavaScript 实现 CNC 数控切削参数与螺纹公差纯前端核算引擎
开发语言·前端·javascript
“AI国潮设计-小江”2 小时前
【AIGC实战】Python+SDXL批量生成「潮汕英歌舞冰淇淋蛋糕&红桃粿咖啡」IP,固定角色形象批量出甜品商业效果图
开发语言·人工智能·python·prompt·aigc
\光辉岁月/2 小时前
3.包装类
java·开发语言·包装类
honkun62 小时前
vue 表格组件 vxe-table 修改滚动条样式,修改滚动条样式,统一宽度、颜色与自动隐藏
前端·javascript·vue.js