再谈原型链，深刻理解原型及原型链（案例分析，详细图解，一目了然）

最新推荐文章于 2025-04-21 11:12:20 发布

spicyboiledfish

最新推荐文章于 2025-04-21 11:12:20 发布

阅读量1.9k

点赞数 3

分类专栏： JavaScript 文章标签：原型链原型 JavaScript Object.create

本文链接：https://blog.youkuaiyun.com/SpicyBoiledFish/article/details/71172496

版权

本文详细探讨JavaScript原型链的概念，通过案例分析为何不直接使用`Student.prototype=Person.prototype`，而是采用`Student.prototype=Object.create(Person.prototype)`避免影响原型链。同时，文章展示了修改`Student.prototype`属性方法后的原型链结构变化，并提供了相关代码及图解，帮助读者深入理解原型和原型链的工作原理。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、前言：这个案例稍微有些难度，需要掌握基本的原型、原型链、构造函数、继承等相关知识，如若还没有掌握，不妨看看我的这篇博客，详细介绍了这些知识及关系：http://blog.youkuaiyun.com/spicyboiledfish/article/details/71123162

二、首先看看这个案例，源代码附上：

function Person(name,age){
      this.name=name;
      this.age=age;
}
Person.prototype.hi=function(){
      console.log("Hi,my name is"+this.name+",I'm"+this.age+"years old now.");
};
Person.prototype.LEGS_NUM=2;
Person.prototype.ARMS_NUM=2;
Person.prototype.walk= function () {
      console.log(this.name+"is walking...");
};

function Student(name,age,className){
      Person.call(this,name,age);
      this.className=className;
}
Student.prototype=Object.create(Person.prototype);
Student.prototype.constructor=Student;