js如何获取所有原型链上的属性-js教程-PHP中文网

js如何获取所有原型链上的属性

畫卷琴夢

发布： 2025-08-18 12:06:02

原创

384人浏览过

要获取javascript对象所有原型链上的属性，需遍历原型链并收集每层的属性，同时避免污染和性能问题。1. 使用 object.getprototypeof() 沿原型链向上遍历，结合 object.getownpropertynames() 收集每个原型的属性，并用 set 去重，最终转为数组返回；2. 避免原型链污染的方法包括：不直接修改内置对象原型、使用 object.create(null) 创建无原型对象、用 object.freeze() 或 object.seal() 锁定对象、对外部数据严格校验、以及通过 object.prototype.hasownproperty.call(obj, prop) 安全检测自身属性；3. 处理原型链过长应减少继承层级、优先使用组合代替继承、缓存频繁访问的原型属性、并推荐使用标准的 object.getprototypeof() 而非非标准的 __proto__；4. 判断属性是否为对象自身所有，应使用 obj.hasownproperty(prop)，但为防止方法被覆盖，应使用 object.prototype.hasownproperty.call(obj, prop) 以确保可靠性，该方法返回布尔值并准确区分自身与继承属性。

js如何获取所有原型链上的属性

要获取JavaScript对象所有原型链上的属性，核心在于遍历对象的原型链，并将每个原型上的属性收集起来。这涉及到理解

__proto__

登录后复制

、

Object.getPrototypeOf()

登录后复制

以及如何安全地遍历原型链。

解决方案：

function getAllPrototypeProperties(obj) {
  const properties = new Set(); // 使用Set去重
  let current = obj;

  while (current) {
    Object.getOwnPropertyNames(current).forEach(property => {
      properties.add(property);
    });
    current = Object.getPrototypeOf(current); // 沿着原型链向上
  }

  return Array.from(properties); // 转换为数组返回
}

// 示例
const obj = { a: 1 };
const parent = { b: 2 };
Object.setPrototypeOf(obj, parent);
const grandParent = { c: 3 };
Object.setPrototypeOf(parent, grandParent);

const allProps = getAllPrototypeProperties(obj);
console.log(allProps); // 输出: ["a", "b", "c"] (顺序可能不同)

登录后复制

如何避免原型链污染？

原型链污染是指恶意修改内置对象的原型，从而影响所有继承自该原型的对象。防范的关键在于避免直接修改内置对象的原型，以及对外部输入的数据进行严格的校验和过滤。

避免直接修改内置原型： 尽量不要直接修改
```
Object.prototype
```
登录后复制
登录后复制
、
```
Array.prototype
```
登录后复制
等。如果确实需要扩展功能，考虑使用静态方法或创建自定义类。
使用
```
Object.create(null)
```
登录后复制
登录后复制
创建无原型对象： 如果不需要继承任何属性，可以使用
```
Object.create(null)
```
登录后复制
登录后复制
创建一个完全空的对象，避免继承
```
Object.prototype
```
登录后复制
登录后复制
上的属性，从而减少被污染的风险。
```
const noProtoObj = Object.create(null);
noProtoObj.myProp = 'value'; // 安全地添加属性
console.log(noProtoObj.toString); // undefined，没有继承toString方法
```
登录后复制
使用
```
Object.freeze()
```
登录后复制
登录后复制
或
Object.seal()
登录后复制
登录后复制
：
```
Object.freeze()
```
登录后复制
登录后复制
可以冻结对象，使其属性不可修改，
```
Object.seal()
```
登录后复制
登录后复制
可以阻止对象添加新属性。这可以防止对象被意外修改。
```
const safeObj = { x: 1 };
Object.freeze(safeObj);
safeObj.x = 2; // 严格模式下会报错，非严格模式下修改无效
```
登录后复制
数据校验和过滤： 对于外部输入的数据，例如来自URL参数或用户提交的数据，需要进行严格的校验和过滤，确保数据符合预期格式，避免恶意代码注入。
使用
hasOwnProperty()
登录后复制
登录后复制
登录后复制
登录后复制
登录后复制
登录后复制
检查属性： 在访问对象的属性时，使用
hasOwnProperty()
登录后复制
登录后复制
登录后复制
登录后复制
登录后复制
登录后复制
方法检查属性是否是对象自身的属性，而不是继承来的。这可以防止访问到被污染的属性。
```
const obj = { a: 1 };
if (obj.hasOwnProperty('a')) {
  console.log('obj has property a');
}
```
登录后复制

如何处理原型链过长的情况？

原型链过长会影响性能，因为每次访问属性都需要沿着原型链向上查找。虽然JavaScript引擎通常会进行优化，但过长的原型链仍然可能成为性能瓶颈。

减少继承层级： 尽量避免过度使用继承，保持原型链的简洁。如果多个类之间只有少量相似之处，可以考虑使用组合而不是继承。

使用组合代替继承： 组合是指在一个类中包含其他类的实例，通过委托来使用这些实例的功能。这可以避免创建深层的原型链。

class Engine {
  start() {
    console.log('Engine started');
  }
}

class Car {
  constructor() {
    this.engine = new Engine(); // 组合
  }

  start() {
    this.engine.start(); // 委托
  }
}

const myCar = new Car();
myCar.start(); // 输出: Engine started

登录后复制

缓存常用的属性： 如果需要频繁访问原型链上的属性，可以将这些属性缓存到对象自身的属性中，避免每次都沿着原型链向上查找。

function MyClass() {
  this.cachedValue = this.getLongCalculation(); // 缓存
}

MyClass.prototype.getLongCalculation = function() {
  // 复杂的计算
  return 'result';
};

const instance = new MyClass();
console.log(instance.cachedValue); // 直接访问缓存的值

登录后复制

使用
```
Object.getPrototypeOf()
```
登录后复制
登录后复制
登录后复制
优化： 虽然
```
__proto__
```
登录后复制
登录后复制
在浏览器中可用，但推荐使用
```
Object.getPrototypeOf()
```
登录后复制
登录后复制
登录后复制
方法来获取对象的原型，因为它更符合标准，并且在某些情况下可能更高效。

如何判断一个属性是继承来的还是对象自身的？

使用

hasOwnProperty()

登录后复制

方法可以准确判断一个属性是对象自身的属性还是继承自原型链的属性。

const obj = { a: 1 };
const parent = { b: 2 };
Object.setPrototypeOf(obj, parent);

console.log(obj.hasOwnProperty('a')); // true，a 是 obj 自身的属性
console.log(obj.hasOwnProperty('b')); // false，b 是继承来的属性

// 安全地使用 hasOwnProperty，防止被覆盖
console.log(Object.prototype.hasOwnProperty.call(obj, 'a')); // true

登录后复制

hasOwnProperty()

登录后复制

方法返回一个布尔值，指示对象自身是否具有指定的属性。需要注意的是，

hasOwnProperty()

登录后复制

方法本身也可能被对象覆盖，因此推荐使用

Object.prototype.hasOwnProperty.call(obj, propertyName)

登录后复制

的方式来调用，以确保使用的是原始的

hasOwnProperty()

登录后复制

方法。

以上就是js如何获取所有原型链上的属性的详细内容，更多请关注php中文网其它相关文章！