JavaScript原型链的基本概念

最新推荐文章于 2026-01-06 19:45:54 发布

原创最新推荐文章于 2026-01-06 19:45:54 发布 · 277 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #原型模式 #前端

本文通过JavaScript实例代码展示了原型链的基本结构。包括构造函数、对象如何访问构造方法、原型及Object原型，揭示了JavaScript中对象继承的机制。

原型链的基本结构：
原型链的基本框架
以下为JavaScript的详细实验代码：

function Person(first, last, age, eyecolor) {
  this.firstName = first;
  this.lastName = last;
  this.age = age;
  this.eyeColor = eyecolor;
}

const myFather = new Person('John', 'Doe', 50, 'blue');
const myMother = new Person('Sally', 'Rally', 48, 'green');

console.log('1:访问构造方法');
console.log('对象访问构造方法:');
console.log(myFather.constructor);
console.log(myMother.constructor);
console.log('等价性：');
console.log(myMother.constructor === myFather.constructor);
console.log('2:访问原型');
console.log('构造方法访问原型:');
console.log(Person.prototype);
console.log('对象访问原型:');
console.log(myFather.__proto__);
console.log(myMother.__proto__);
console.log('等价性：');
console.log(myFather.__proto__ === myMother.__proto__);
console.log(myFather.__proto__ === Person.prototype);
console.log('3:访问Object原型');
console.log('Person原型访问Object原型:');
console.log(Person.prototype.__proto__);
console.log('Object对象访问Object原型:');
console.log(new Object().__proto__);
console.log('Object构造方法访问Object原型:');
console.log(new Object().constructor.prototype);
console.log('等价性：');
console.log(new Object().__proto__ === new Object().constructor.prototype);
console.log(new Object().__proto__ === Person.prototype.__proto__);