js中class语法的核心是理清结构逻辑而非画图；需围绕类的基本结构展开四大分支：声明方式、构造函数、方法写法、属性声明位置，并区分实例/静态/私有/原型四类成员，强调继承机制与常见误区。
JS 中 class 语法的核心不是画图本身，而是理清结构逻辑——思维导图只是把已理解的知识点可视化。重点在于分类清晰、层级合理、关键细节不遗漏。下面按实战角度拆解怎么组织这张图。
类的基本结构与语法规则
这是最底层的主干，必须放在中心位置。围绕它展开四个关键分支：
-
声明方式：用
class关键字，首字母大写（如Person），不可变量提升（必须先定义后使用） -
构造函数：唯一方法名是
constructor()，new 实例时自动调用；无显式定义时，JS 提供空构造函数 -
方法写法：不加
function关键字，不写逗号分隔；所有非静态方法默认挂载到原型上 -
属性声明位置：实例属性可写在
constructor内（this.name = …），也可直接写在类体顶层（name = 'default'，ES2022+ 支持）
属性与方法的类型划分
这是最容易混淆的部分，建议用颜色或图标区分四类，每类标注访问方式和生命周期：
-
实例属性：每个对象独有，通过
this.xxx或实例点号访问（如p1.name） -
静态属性/方法：用
static声明，仅属于类本身（如MathUtil.PI），实例无法调用 -
私有字段/方法：以
#开头（如#id、#validate()），仅限类内部访问，外部读写均报错 -
原型方法：即普通实例方法，本质是添加到
ClassName.prototype上，所有实例共享
继承与扩展机制
继承是 class 的核心价值之一，导图中要突出语法 + 限制 + 常见陷阱：
-
基础语法：子类用
extends继承父类；子类构造函数中必须调用super()（且必须在this之前） -
super 的双重角色：在构造函数中是调用父类构造器，在方法中是调用父类同名方法（
super.sayHello()） -
不能继承内置类的某些行为：比如 extends Array 后，子类实例可能不被
Array.isArray()识别，需手动修复 -
静态方法也会被继承：子类可直接调用
Parent.staticMethod()，也可重写
常见误区与底层对应关系
这部分是导图的“警示区”，帮助避开典型坑点：
-
class 不是全新机制：它仍是基于原型的语法封装，
new MyClass()底层仍走原型链查找 -
方法不是“绑定 this”：class 中定义的方法不会自动绑定
this，作为回调传入时仍需手动.bind()或箭头函数处理 -
私有字段不可枚举、不可反射：
Object.keys()、for...in、JSON.stringify()都看不到#字段 -
不存在“类变量”概念：JS 没有 Java 那种类级变量，所有“类变量”本质都是静态属性，需显式声明
static
