ES6类定义与使用全解析

目前golang学习网上已经有很多关于文章的文章了，自己在初次阅读这些文章中，也见识到了很多学习思路；那么本文《ES6 class定义与使用详解》，也希望能帮助到大家，如果阅读完后真的对你学习文章有帮助，欢迎动动手指，评论留言并分享~

class必须用new调用，因内部使用[[IsConstructor]]属性；constructor需显式定义传参，不可为箭头函数；static方法仅类名可调；子类constructor中super()必须首行调用。

class 声明必须用 new 调用，不能当普通函数执行

ES6 的 class 本质是语法糖，但行为上更严格：它内部使用了 [[IsConstructor]] 内部属性，所以直接调用会报错。比如：

class Person {
  constructor(name) {
    this.name = name;
  }
}
Person('Alice'); // TypeError: Class constructor Person cannot be invoked without 'new'

这和 ES5 构造函数不同——后者即使忘了 new，也可能静默创建全局属性（取决于是否严格模式）。而 class 强制要求 new，避免低级错误。

常见误操作：

• 在事件回调或 setTimeout 中直接写 Person(...) 而不是 new Person(...)
• 把 class 当作工厂函数返回实例（应改用静态方法，如 Person.create(...)）

constructor 不写会自动添加空构造函数，但显式声明才能传参

如果省略 constructor，JavaScript 会默认插入一个空的 constructor() {}。此时无法接收参数，也无法初始化实例属性。

正确做法是显式定义，并注意：

• constructor 必须是普通函数，不能是箭头函数（箭头函数没有 this 绑定）
• 若子类继承，且要调用 super()，父类必须有可访问的 constructor（哪怕空）
• 不能在 constructor 中返回原始值（如 return 42），否则忽略；返回对象则替代新实例（极少用）

static 方法不能被实例调用，只能通过类名访问

static 关键字定义的是类自身的方法，不是原型方法。这意味着：

class MathUtils {
  static add(a, b) {
    return a + b;
  }
  multiply(a, b) {
    return a * b;
  }
}
<p>MathUtils.add(2, 3);        // ✅ 5
MathUtils.multiply(2, 3);   // ❌ TypeError: MathUtils.multiply is not a function</p><p>const utils = new MathUtils();
utils.add(2, 3);            // ❌ TypeError: utils.add is not a function
utils.multiply(2, 3);       // ✅ 6</p>

容易混淆的点：

• 静态方法里没有 this 指向实例，只有类本身（可用 MathUtils 或 this 指代当前类，用于子类继承场景）
• 工具类（如日期格式化、HTTP 封装）适合用 static；状态相关逻辑必须放在原型方法中

继承时 super() 必须在 this 使用前调用，且只在 constructor 中有效

子类的 constructor 中，只要用了 this（包括访问 this.xxx 或调用 super.xxx），就必须先调用 super()。否则报 ReferenceError: Must call super constructor in derived class before accessing 'this' or returning from derived constructor。

几个关键细节：

• super() 等价于调用父类 constructor，参数必须匹配父类构造签名
• super.xxx 可在非 constructor 方法中访问父类原型上的方法或 getter/setter
• 不能在箭头函数或普通函数嵌套中调用 super() —— 它只在 class 方法的词法上下文中有效

示例：

class Animal {
  constructor(name) {
    this.name = name;
  }
  speak() {
    return `${this.name} makes a sound.`;
  }
}
<p>class Dog extends Animal {
constructor(name, breed) {
super(name); // ✅ 必须第一行
this.breed = breed; // ✅ this 可用
}
bark() {
return super.speak() + ' And barks!'; // ✅ super 在方法中可用
}
}</p>

没调用 super() 或顺序错了，JS 引擎会在解析阶段就拒绝执行，不是运行时才暴露问题。

真正容易被忽略的是：子类不写 constructor 时，JavaScript 会自动补一个隐式的 constructor(...args) { super(...args); }；但一旦写了，就必须手动处理 super —— 这个隐式逻辑不会“覆盖”你的自定义构造函数。

以上就是本文的全部内容了，是否有顺利帮助你解决问题？若是能给你带来学习上的帮助，请大家多多支持golang学习网！更多关于文章的相关知识，也可关注golang学习网公众号。