JavaScript面向对象编程:对象创建与原型链详解

作者:异步漫步

时间:2026-10-30

浏览:214

本文深入解析JavaScript面向对象编程中对象的创建方法,对比直接量与构造函数的区别,并详细阐述原型(prototype)与原型链(__proto__)的工作机制。通过实例说明如何共享方法以优化内存,帮助开发者理解JS对象模型的核心概念。

文章目录

JavaScript对象的基本概念

面向对象是对现实世界的理解与抽象方式,是计算机编程技术演进至特定阶段的产物。

对象的含义

对象涵盖汽车、人、动物、文字、表单或任何存在的事物。

对象包含以下要素:

属性:对象的特定性质。 方法:对象执行的行为。 事件:对象对发生事情的响应。

通过构建一个人对象来阐释面向对象概念。

人:

具备两只手、两只脚、一个头,并能跑动。

手、脚、头为人属性,跑动为人方法。

对象的创建方式

首先,采用最简单方式创建对象。


var person = {
      head: "one",
      hand: "two",
      foot: "two",
      run : function(){
        console.log("running");
      }
    }

此方法不具实用性,因仅创建单独对象,且与常见数据结构无关联。

接着,使用构造函数方式创建对象。


var Person = function(){//注意,首字母大写
      this.head = "one",
      this.hand = "two",
      this.foot = "two",
      this.run = function(){
        alert("running");
      }
    }
    var Joan = new Person();
    document.write(Joan.run())// "running"

此为构造函数创建的对象,添加一行代码后观察结果。


var Niki = new Person();
    alert(Joan==Niki) //false;

此时创建了兩個不同的对象实例。

原型与原型链机制

JavaScript中每个函数均拥有prototype属性。若函数用作构造函数,该属性会通过new调用自动创建对象的原型。


console.log(Joan)

可见存在__proto__:Person,其中__proto__为Joan的原型链,指向Person的原型。

JS创建对象(无论普通或函数对象)时,均存在名为__proto__的内置属性,指向创建它的函数对象的原型对象prototype。

关于原型链的理解在《JavaScript高级程序设计》一书中阐述详尽。感兴趣者可查阅,网上亦有PDF文档,但建议购买原版书籍以支持正版。

原型方法的共享与应用

随后,对prototype原型属性的任何更改均能应用于通过new Person()构造的每个实例对象,无论其创建于更改前后。为Person.prototype添加新函数,具体如下:


var Person = function(){//注意,首字母大写
      this.head = "one",
      this.hand = "two",
      this.foot = "two"
    }
    Person.prototype.run = function(){
      alert("running");
    }
    var Joan = new Person();
    Joan.run()// "running"
    alert(Joan.__proto__===Person.prototype)//'true'

可见,在原型中创建的方法可被调用,同时Joan的原型链指向Person的原型。

再看:


var Niki = new Person();//"runing"
     Person.prototype.run = function(){
       alert("running running")
     }
     Joan.run()//"running running"
     Niki.run()//"running running"

修改Person的原型方法后,所有通过new Person()创建的对象实例中的方法均被修改,因所有实例共享同一原型方法run。此即原型的一种应用。

以上为关于创建对象的一些理解。

撰写耗时较长,不确定是否有误。若有错误,欢迎各位指正。

下次将撰写面向对象继承方面的内容。

以上即小编为大家带来的对Js OOP编程 创建对象的一些全面理解全部内容,希望大家多多支持本站~

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章