JavaScript 如何写类
在前端开发里，“类”是组织代码的重要工具，能把相同类型的对象（比如“用户”“商品”）的共性属性和方法打包在一起，不用反复写重复代码。很多刚接触JavaScript的开发者会疑惑，为什么明明有函数，还要专门学写类？其实JavaScript的类是ES6之后推出的“语法糖”——本质还是基于它原本的原型机制，但写法更贴近大家熟悉的面向对象概念，上手也简单。
最基础的写法：用class关键字定义类
写JavaScript的类，最直接的是用class关键字，就像给“模板”起个名字，比如要做一个“外卖订单”的模板，就可以这么写：
`javascript
class Order {
// 构造函数：用来给新订单设置初始信息，就像填订单的必填项
constructor(菜品, 数量) {
this.菜品 = 菜品; // 每个订单自己的菜品名，不能共用
this.数量 = 数量; // 每个订单的数量
this.状态 = "待接单"; // 初始状态都是待接单，属于所有订单的默认值
}
// 类里的方法：所有订单都能调用的通用功能，不用每个订单单独写
计算总价() {
// 假设菜品单价是20元，就像外卖平台的固定定价
return this.数量 * 20;
}
修改状态(新状态) {
this.状态 = 新状态;
console.log(订单${this.菜品}状态更新为：${新状态});
}
}
`
用这个“模板”生成具体订单，只要用new关键字：
`javascript
// 生成一个具体的外卖订单：买2份宫保鸡丁
const 我的订单 = new Order("宫保鸡丁", 2);
console.log(我的订单.菜品); // 输出：宫保鸡丁
console.log(我的订单.计算总价()); // 输出：40
我的订单.修改状态("已派送"); // 输出：订单宫保鸡丁状态更新为：已派送
`
这个例子里，constructor是类的“初始化器”，负责给每个新对象赋初始值；类里的函数（比如计算总价）是所有实例共享的方法，不用重复创建，省内存。
进阶用法：让类继承，减少重复代码
如果要做“会员订单”，它和普通订单有很多共性（菜品、数量、状态），但多了“会员折扣”的属性，不用重新写一遍所有代码，只要让会员订单继承普通订单就行：
`javascript
// 用extends实现继承，Order是父类，MemberOrder是子类
class MemberOrder extends Order {
// 子类的构造函数：要先调用父类的构造，用super()
constructor(菜品, 数量, 会员等级) {
super(菜品, 数量); // 把父类要求的参数传给父类初始化
this.会员等级 = 会员等级; // 新增的会员属性
}
// 重写父类的计算总价：会员有8折优惠
计算总价() {
// 先调用父类的计算结果，再乘以0.8
return super.计算总价() * 0.8;
}
}
`
用这个子类生成会员订单：
`javascript
const 会员订单 = new MemberOrder("麻婆豆腐", 3, "黄金会员");
console.log(会员订单.计算总价()); // 普通总价60，打8折后是48
// 还能调用父类的方法，因为继承了Order
会员订单.修改状态("已付款"); // 正常输出状态更新
`
这种继承就像“升级版说明书”，既有旧说明书的所有功能，又加了新内容，不会重复写相同的规则，代码更整洁。
常见误区：别把类和普通函数搞混
有些新手会问：“我用函数也能实现一样的功能，为什么用类？”其实类和普通函数的核心区别是：类必须用new调用，否则会报错；而普通函数可以直接调用。比如下面的错误写法：
`javascript
// 直接调用类会报错！
const 错误调用 = Order("鱼香肉丝",1); // 报错：Class constructor Order cannot be invoked without 'new'
`
另外，类里的方法默认是不可枚举的，而普通函数如果直接绑在对象上，会遍历出来，这也是类的优势之一——不会意外改动通用方法。
简单来说，JavaScript写类的核心就是：用class定义模板，constructor设初始值，方法写通用功能，继承实现代码复用。只要记住“类是模板，new生成具体实例”，就能轻松上手，不用纠结底层的原型机制，先会用，再慢慢理解背后的逻辑就好。