类这个概念要说新鲜在JSA中也算新鲜，但它又早就存在于JSA中。我们已经接触过类了：之前我们在介绍简单对象的过程中，接触到的对象类型，这其实就是一个类，只不过到ES6.0，才引入了class的写法。

一、什么是类？

如何去理解类？

在一家公司入职时，hr会让入职人员填写员工入职信息表，填完信息表之后才算是公司的员工了；财务人员在做账时根据实际的报销单据、收款单据、银行回单等等原始凭证来填写的记账凭证；我们去银行办卡开户时，银行让我们填写的相关单子，以及办完之后交给我们的银行卡片。

以上种种表单、单据、凭证、卡片，它们在当时的场景下都是一样的，无论谁来了填写的都是同一张表单模板（入职表，谁来入职都是填一样的表；记账凭证，任何会计填写做账，它的格式始终一样；银行卡片，所有人的银行卡都是一样的大小、同类型的卡片连外观都一样）。

这种将一类业务、同类事物抽像成一个模板，以后再使用这个模板在具体事务中形成一张张具体的单据。

在JSA以及编程语言中，我们就称这个模板为类；在具体事务中，填写完成之后的一张张表、拿到的一张张银行卡等等具体行为，在编程语言中，我们称这种形为为对象实例化。

什么是类？

简单来说类是用于创建对象的模板。

在这个模板中，程序员们将其要实现的功能，通过程序代码，封装在类中。

我们在对象那一章节中接触到的类：

//定义一个远古动物的原型对象类型function AcientAnimal(){  this.legsNumber = 4;  this.hasTail = true;  this.life = 40;  this.language = 'No Language';}//三个原型对象原型链上的三个方法AcientAnimal.prototype.speak = function(words){  console.log(`No Language,No sence expressed by ${words}.`); }AcientAnimal.prototype.hunt = function(food){  console.log(`When hangury,knows to hunt ${food} for eating.`);}AcientAnimal.prototype.run = function(dis){  console.log(`can run very fast by speed in ${dis}`);}

上面这个其实也是一个类，因为JSA的类是建立在原型之上的。

二、声明类

我们如何声明（定义）一个类呢？

这里需要用到关键字class。

定义类的方式像前我们定义函数那样，有两种形式：

第一种：表达式形式

//1、匿名类表达式形式let Circle = class{    constructor(radius,center) {    this.radius = radius;    this.center = center;  }}//上面我们定义了一个匿名类，并将之赋值给一个变量Circle,//2、具名类表达式let Circle = class ShapeCircle{    constructor(radius,center) {      this.radius = radius;      this.center = center;  }}//上面我们定义了一个具名类ShapeCircle，并将之赋值给变量Circle。

第二种：声明形式

class ShapeCircle{    constructor(radius,center) {      this.radius = radius;      this.center = center;  }}

语法：

由上面的两种形式，我们不难看出，定义一个类的基本语法如下：

//1、声明形式class className{  constructor(参数1,参数2,....)  {    语句...  }  其他语名。}//2、表达式形式变量名称 = class [calssName]{  constructor(参数1,参数2,....)  {    语句...  }  其他语名。}

类主体：

由上面的定义语法，我们可以看出，类的主体内容就是写在{}中间的代码了。我们可以在{}中间定义类的属性、方法、构造函数等等。

类的主体成员有如下：私有属性、公有属性、静态属性、构造函数、getter和setter。

三、主体组成部分

1、构造函数和extends：

constructor方法，是用于创建和初始化一个由类创建的对象的特殊方法。一个类只能拥有一个名为“constructor”的特殊方法，可以使用 super 关键字来调用父类的构造函数。我们在实例化一个类的时候，通常都new + 类名。通过这个new操作符，就是调用构造函数方法了。

extends：用于类声明或者类表达式中，以创建一个指定类的子类。

//定义一个动物类，这个类目前就三个属性：性别，生日，名字class Animal{  constructor(gendar,birthDay,name){    this.gendar = gendar;    this.birthDay = birthDay;    this.name = name;  }}//狗类，派生类自动物类，通过super来调用其父类中的构造函数class Dog extends Animal{  constructor(gendar,birthDay,name){    super(gendar,birthDay,name);  }}//猫类，派生类自动物类，通过super来调用其父类中的构造函数class Cat extends Animal{  constructor(gendar,birthDay,name){    super(gendar,birthDay,name);  }}//上面两个狗和猫的类就是由动物类派生出来的，能继承动物类的所有方法和属性。//当我们要实例化一只狗的时候：WangCai = new Dog('male','2023-7-2','旺财');//我们再实例化一只猫Garfield = new Cat('male','1977-7-2','加菲猫');console.log(Garfield.name);//加菲猫console.log(WangCai.name);//旺财

2、私有属性

属性在类当中包含两个方面的内容：字段和方法。

私有属性：就是只能在定义该属性的类中使用，类外部的其他任何地方都无法被访问到的属性。通常是与公有属性相对应的。

私有属性通过在属性前加上“#”(读作“hash”)前缀来创建。

class Human{  #age;  constructor(birth,name){    //定义两个变量，用来存放当前日期和出生日期的日期对象    let today = new Date(Date.now());    let birthday = new Date(Date.parse(birth));        this.birth = birth;    this.name = name;    //将两个日期的年份之差作为年龄    this.#age = today.getFullYear()- birthday.getFullYear();  }  //定义一个获取人物年龄的方法。  GetAge(){    return this.#age;//返回年龄，向外部展示。  }}LeeLei = new Human('April 25 2006',"李雷");console.log(LeeLei.GetAge());//返回18console.log(LeeLei.#age);//Error: Private field '#age' must be declared in an enclosing class

上面示例中#age就是一个私有字段，它是无法在实例外部访问的。

3、公有属性

同样的公有属性也是包含有公有字段和公有方法，公有方法也就是我们在简单对象中所讲的定义对象的方法。因此本小节主要讲述如何在类中定义公有类字段。

公有类字段：即是在类中声明的，我们可以访问、编辑、可枚举、可配置的属性。公有字段参与原型的继承。

声明一个公有类字段语法也很简洁。只需要在类的顶部写出你想要作为类的字段的名称就可以了。

class Car{  owner;//以下声明了两个公有类字段，只不过该字段没有初始值；  price;  #lightType;//声明了一个私有类字段，也没有初始值；  constructor(owner,price){    this.owner = owner;//在属性初始化器中初始化公有字段    this.price = price;  }}let Car1 = new Car('李明',129800);console.log(Car1.owner)//李明console.log(Car1.price)//129800

在属性初始化器中只能引用constructor上面的字段，而无法引用其下面的字段。

4、静态属性

静态属性：是一组在属于类本身的属性，而不属于该类的实例的属性。静态属性的调用，与之前所说的公有属性的调用是不同的。

声明静态属性的语法格式是：static 变量名称，请看如下示例。

class someclass{  static staticprop;  constructor(){    this.staticprop = '看看这里会不会被运行';//不会被运行  }  static getStaticProp(){    return this.staticprop  }}console.log(someclass.getStaticProp());//undefined,为什么会是这个值呢？

在上述示例中：我在属性初始化器中初始化了这个类的静态属性staticprop，并且希望通过静态方法能返回这个静态值。

但是，由于静态属性是属于类本身，而不属性于该类的具体实例，所以在这其中constructor这个构造函数是不会被运行的，因此这其中的赋值行为也就不会发生。所以最终返回的是undefined.

如何想要让静态属性能有所返回？需要类中声明一个叫做静态初始化块的特殊结构。

5、静态初始化块

静态初始化块是一个在类第一次加载时运行的代码块，在这其中是可以访问静态私有属性的。

静态初始化块的语法：以上方的示例为例：

class someclass{  static staticprop;  constructor(){    someclass.staticprop = '看看这里会不会被运行';//不会被运行  }  static getStaticProp(){    //return this.staticprop----下面的语句写成这样也是可以的。    return someclass.staticprop  }  static{    //this.staticprop----下面的语句写成这样也是可以的。    someclass.staticprop = '孙悟空被迫到此一游！';  }}console.log(someclass.getStaticProp());//孙悟空被迫到此一游！

由此可见，在一个类中，静态属性如果要被初始化，则必须要放置在静态初始化块中。

6、getter和setter

有时候通过简单方法对属性进行访问会出现各种不便，那么这个时候getter和setter就起到大作用了。

getter和setter的作用是：创建一个类似于对象属性的东西，但却不是属性，getter和setter其实是两个分别以get和set为前缀的方法，它就使得我们可以像操作对象属性那样操作它们。

如果一个字段只有getter而没有setter则表示这个字段是只读的；相反只有setter没有getter表示只写。

class Student{  #name;  constructor(name){    this.#name = name;  }  get name(){    return this.#name;  }  set name(value)  {    if(value!==this.#name) this.#name = value;  }}HanMeimei = new Student();HanMeimei.name = '韩美美';console.log(HanMeimei.name);//韩美美

上述示例中的get和set就是相当于给类设置了一个叫name的属性，我们可以像操作属性那样操作这个方法。

好了，以上就是关于雷的相关内容。

关注我，持续共同学习，一起踏上wps宏(JSA)的登山之路。

#头条创作挑战赛#