原型、原型链

最新推荐文章于 2025-06-11 17:50:26 发布

原创最新推荐文章于 2025-06-11 17:50:26 发布 · 236 阅读

0 ·

CC 4.0 BY-SA版权

前端专栏收录该内容

29 篇文章

订阅专栏

本文详细介绍了JavaScript中构造函数的原型属性及其实现原理。解释了如何通过原型属性实现对象间属性和方法的继承，以及如何利用原型链解决代码冗余问题。

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

原型

这里写图片描述
定义：原型是 function 对象的一个属性，它定义了构造函数制造出的对象的公共祖先。通过该构造函数产生的对象，可以继承该原型的属性和方法。原型也是对象

//Person.prototype;--原型
//Person.prototype = {};--祖先
Person.prototype.name = "vita";
Person.prototype.LastName = "l";
function Person(name,age){
    this.name = name;
    this.age = age;
}
var person = new Person('linmer',22);
console.log(person.name);//linmer
console.log(person.LastName);//l

原型也是对象，可以这样写

 Person.prototype = {
    name : 'viat',
    sex:'female',
    age: 23
 }

//原型可以减少代码冗余

function Car(name,color){
            this.color = color;
            this.name = name;
        }
        Car.prototype = {
            height:1400,
           width: 234,
           age: 2
        } //把公有属性提取出来
        var car = new Car("BWM",'red');

下面的做法代码冗余

function Car(name,color){
                this.color = color;
                this.name = name;
                this.height = 1400;
                this.width = 234;
                this.age = 2
            }

            var car = new Car("BWM",'red');

对象如何查看对象的构造函数 —>constructor

  person.constructor;-->Person(name,age){}

对象如何查看原型

---> 隐式属性--  __proto__ ;

person.__proto__ = Person.prototype;

利用原型可以提取公有属性

Car.prototype = {
            height:1400,
           width: 234,
           age: 2
        } //把公有属性提取出来

delete操作(不能删除公有属性和全局变量)

delete person.name;//返回的结果是true，因为delete告诉你这个是可以删除的。但是person.name 并没有值。

Person.prototype.name = xxx,是直接是原型上name属性修改。Person.prototype = {}；是换掉了原型。

  Person.prototype.name = 'vita';
  function Person(age){
        this.age = age;
 }

var person = new Person();
Person.prototype.name = 'lin';
person.name; // 'lin'; 

Person.prototype.name = 'vita';
      function Person(age){
            this.age = age;
     }

    var person = new Person();
     Person.prototype = {
        name : 'mala'
     }
    person.name; // 'vita';

注意xxx.prototype={},放上放下的区别；

原型链

原型链的链接点是 prototype
原型链的终端是 Object
默认情况下，所有对象都是对象（Object）的实例，并继承了所有基本方法，比如toString（）。

function Book(title,price){
        this.title = title;
        this.name = name;
    }
    Book.prototype.color = 'white';

    var book = new Book('JS',23);
    book.color; //white

使用构造函数Book来创建一个新的Book实例。实例book的原型（_proto_）是Book.prototype,而Book.prototype的原型是Object.这就是原型链的创建过程。