最直接的方式是用 Object.getPrototypeOf() 递归遍历原型链，标准可靠且兼容性好；增强版可显示构造函数名、是否原生、自有属性等元信息，便于快速定位问题。
在 JavaScript 中，调试对象属性时想看清完整的原型链，最直接的方式是使用控制台逐级展开 __proto__，但手动点击太慢且容易遗漏。更高效的方法是用代码自动遍历并输出整条原型链，包括每个环节的构造函数名、是否为原生对象、以及是否有自定义属性。
用 Object.getPrototypeOf() 递归获取原型链
这是标准、可靠的方式，避开已废弃的 __proto__，兼容性好，也符合规范：
- 从目标对象开始，反复调用
Object.getPrototypeOf(obj) - 每次拿到原型后，检查是否为
null（即到达原型链终点） - 把每层原型存入数组，最后统一打印
示例代码：
function getPrototypeChain(obj) {
const chain = [];
let current = obj;
while (current !== null) {
chain.push(current);
current = Object.getPrototypeOf(current);
}
return chain;
}
const arr = [1, 2];
console.log(getPrototypeChain(arr));
// 输出：[Array(2), Array.prototype, Object.prototype, null]
增强版：显示构造函数与关键属性
只看对象本身不够直观，加点元信息能快速定位问题：
立即学习“Java免费学习笔记（深入）”；
- 用
constructor.name显示每层的构造函数名（如"Array"、"Object"） - 用
Object.getOwnPropertyNames()查看该原型上定义的自有属性（非继承来的） - 对
Function.prototype、Array.prototype等常见原型做标记，方便识别
可直接粘贴到控制台运行：
function inspectPrototypeChain(obj) {
const chain = [];
let current = obj;
while (current !== null) {
const ctor = current.constructor?.name || '(anonymous)';
const props = Object.getOwnPropertyNames(current).filter(p =>
typeof current[p] !== 'function'
);
chain.push({
constructor: ctor,
isBuiltIn: ['Object', 'Array', 'Function', 'String', 'Number'].includes(ctor),
ownProperties: props.length > 0 ? props : undefined,
toString: current.toString()
});
current = Object.getPrototypeOf(current);
}
console.table(chain);
}
inspectPrototypeChain({a: 1});
Chrome / Edge 控制台快捷技巧
不用写代码也能快速观察原型链：
- 在控制台输入对象（如
{}），回车后点击右侧展开箭头 → 展开<prototype>可逐层看 - 右键对象 → “Store as global variable”（例如生成
temp1），再执行temp1.__proto__快速跳转下一层 - 输入
console.dir(obj, { depth: 10 })，强制展开多层原型（比默认深）
注意几个易错点
实际调试中常因这些细节误判属性来源：
-
Object.create(null)创建的对象没有Object.prototype，原型链以null终止 - 箭头函数没有
prototype属性，但它的__proto__指向Function.prototype - 类实例的
__proto__指向类的prototype，而类本身的__proto__是Function.prototype - 通过
Object.setPrototypeOf()修改过原型的对象，控制台可能不实时刷新显示，建议用getPrototypeOf确认
