JavaScript无原生protected和virtual method，但可通过闭包、WeakMap或私有字段（#）模拟受保护的虚方法：将可重写逻辑封装在父类作用域内，仅暴露调用接口，子类通过约定方式（如_setOnRender或setter）覆盖，外部无法直接访问。
JavaScript 本身没有原生的 protected 访问修饰符，也没有真正的“虚方法”（virtual method）机制，但可以通过闭包 + 构造函数/类模式模拟出**受保护的、可被子类重写但不可被外部直接调用的方法**——即你所说的“受保护的虚方法”。核心思路是：把方法定义在父类的闭包作用域中，仅暴露给实例自身（或子类实例）调用，不挂载到原型上，也不对外公开。
用闭包封装“虚方法”逻辑
将希望被子类定制的行为封装在父类构造函数的闭包内，通过一个私有变量（如 _onRender）保存，父类公共方法内部调用它。子类可在初始化时覆盖该变量，从而改变行为，但外部无法访问或修改它。
示例：
function Component(name) {
// ✅ 受保护的“虚方法”：只在闭包内可见，子类可覆盖
let _onRender = () => console.log(`Default render for ${name}`);
// ✅ 公共接口：调用受保护的虚方法
this.render = function() {
_onRender(); // 子类改写 _onRender，就改变了 render 行为
};
// ✅ 子类可通过受保护方式“重写”虚方法（例如提供 protectedSetOnRender）
this._setOnRender = function(fn) {
if (typeof fn === 'function') {
_onRender = fn;
}
};
}
// 子类继承（非 class extends，而是组合式继承）
function Button(name, label) {
Component.call(this, name); // 调用父类构造
// ? 在子类内部安全地重写虚方法
this._setOnRender(() => {
console.log(`Button "${label}" rendered`);
});
}
// 使用
const btn = new Button('my-btn', 'Submit');
btn.render(); // → "Button "Submit" rendered"
// btn._onRender(); // ❌ undefined —— 外部不可见
// btn._setOnRender(...); // ⚠️ 不推荐暴露给外部，仅用于子类内部协作
更安全的方案：用 Symbol 或 WeakMap 隐藏方法
避免 _setOnRender 暴露给外部，可用 Symbol 作为私有键，或用 WeakMap 存储实例专属的虚方法，彻底隔绝外部访问。
立即学习“Java免费学习笔记（深入）”；
- 用
Symbol做私有属性名（仍需约定不碰该 key） - 用
WeakMap实现真正私有：只有父类内部能读写，连for...in和Object.keys()都看不到
WeakMap 版本示例：
const _onRender = new WeakMap();
function Component(name) {
// ✅ 真私有：外部完全无法访问 _onRender.get(this)
_onRender.set(this, () => console.log(`Default: ${name}`));
this.render = () => _onRender.get(this)();
}
Component.prototype.setProtectedOnRender = function(fn) {
if (typeof fn === 'function') {
_onRender.set(this, fn);
}
};
function Input(name, placeholder) {
Component.call(this, name);
// ✅ 安全重写：仅通过父类提供的受保护接口
this.setProtectedOnRender(() => {
console.log(`Input with placeholder: ${placeholder}`);
});
}
配合 class 语法的现代写法（ES6+）
如果使用 class，可结合私有字段（#）和受保护约定实现类似效果（注意：私有字段目前不可被子类继承访问，所以“受保护”需靠文档 + 约定）：
class Component {
#onRender;
constructor(name) {
this.name = name;
this.#onRender = () => console.log(`Default: ${name}`);
}
render() {
this.#onRender();
}
// ✅ 提供受保护的钩子（命名以 _ 开头，表示“子类可覆盖”，非强制但约定俗成）
set _onRender(fn) {
if (typeof fn === 'function') this.#onRender = fn;
}
}
class Modal extends Component {
constructor(title) {
super(title);
// ✅ 子类内部安全定制
this._onRender = () => console.log(`Modal: ${title} opened`);
}
}
关键要点总结
- “受保护”不是语言级权限，而是通过闭包、WeakMap 或私有字段实现外部不可见，再配合命名约定（如
_onRender）向子类传达“可重写”意图 - “虚方法”本质是延迟绑定：父类定义调用点，具体逻辑由子类在实例化时注入
- 避免把虚方法直接挂到
prototype上——那样就变成公开可覆盖的普通方法，失去“受保护”语义 - 若需多态调用（如数组里混放不同组件并统一
.render()），确保所有子类都遵循同一闭包结构或 WeakMap 协议
