Javascript继承机制的设计思想

systrace分析 之 问题初步定位 如下surfaceflinger空缺点,上面对应的bufferTX 中有buffer,但VSYNC-SF 过来后,SurfaceFlinger却没有去取,检查测试app “android.settings”, 也没有GPU completion 时间长的问题,所以该部分可以请SurfaceFlinger的owner 进一步确认为何不取buffer。. GPU拿的是acquireFence HWC拿的是releaseFence, GPU是绘图,HWC是合成显示,这两个是互相等待的关系, 阅读详情

Javascript继承机制的设计思想

作者: 阮一峰

我一直很难理解Javascript语言的继承机制。

它没有"子类"和"父类"的概念,也没有"类"(class)和"实例"(instance)的区分,全靠一种很奇特的"原型链"(prototype chain)模式,来实现继承。

我花了很多时间,学习这个部分,还做了很多笔记。但是都属于强行记忆,无法从根本上理解。

直到昨天,我读到法国程序员Vjeux的解释,才恍然大悟,完全明白了Javascript为什么这样设计。

下面,我尝试用自己的语言,来解释它的设计思想。彻底说明白prototype对象到底是怎么回事。其实根本就没那么复杂,真相非常简单。

一、从古代说起

要理解Javascript的设计思想,必须从它的诞生说起。

1994年,网景公司(Netscape)发布了Navigator浏览器0.9版。这是历史上第一个比较成熟的网络浏览器,轰动一时。但是,这个版本的浏览器只能用来浏览,不具备与访问者互动的能力。比如,如果网页上有一栏"用户名"要求填写,浏览器就无法判断访问者是否真的填写了,只有让服务器端判断。如果没有填写,服务器端就返回错误,要求用户重新填写,这太浪费时间和服务器资源了。

因此,网景公司急需一种网页脚本语言,使得浏览器可以与网页互动。工程师Brendan Eich负责开发这种新语言。他觉得,没必要设计得很复杂,这种语言只要能够完成一些简单操作就够了,比如判断用户有没有填写表单。

1994年正是面向对象编程(object-oriented programming)最兴盛的时期,C++是当时最流行的语言,而Java语言的1.0版即将于第二年推出,Sun公司正在大肆造势。

Brendan Eich无疑受到了影响,Javascript里面所有的数据类型都是对象(object),这一点与Java非常相似。但是,他随即就遇到了一个难题,到底要不要设计"继承"机制呢?

二、Brendan Eich的选择

如果真的是一种简易的脚本语言,其实不需要有"继承"机制。但是,Javascript里面都是对象,必须有一种机制,将所有对象联系起来。所以,Brendan Eich最后还是设计了"继承"。

但是,他不打算引入"类"(class)的概念,因为一旦有了"类",Javascript就是一种完整的面向对象编程语言了,这好像有点太正式了,而且增加了初学者的入门难度。

他考虑到,C++和Java语言都使用new命令,生成实例。

C++的写法是:

  ClassName *object = new ClassName(param);

Java的写法是:

  Foo foo = new Foo();

因此,他就把new命令引入了Javascript,用来从原型对象生成一个实例对象。但是,Javascript没有"类",怎么来表示原型对象呢?

这时,他想到C++和Java使用new命令时,都会调用"类"的构造函数(constructor)。他就做了一个简化的设计,在Javascript语言中,new命令后面跟的不是类,而是构造函数。

举例来说,现在有一个叫做DOG的构造函数,表示狗对象的原型。

  function DOG(name){

    this.name = name;

  }

对这个构造函数使用new,就会生成一个狗对象的实例。

  var dogA = new DOG('大毛');

  alert(dogA.name); // 大毛

注意构造函数中的this关键字,它就代表了新创建的实例对象。

三、new运算符的缺点

用构造函数生成实例对象,有一个缺点,那就是无法共享属性和方法。

比如,在DOG对象的构造函数中,设置一个实例对象的共有属性species。

  function DOG(name){

    this.name = name;

    this.species = '犬科';

  }

然后,生成两个实例对象:

  var dogA = new DOG('大毛');

  var dogB = new DOG('二毛');

这两个对象的species属性是独立的,修改其中一个,不会影响到另一个。

  dogA.species = '猫科';

  alert(dogB.species); // 显示"犬科",不受dogA的影响

每一个实例对象,都有自己的属性和方法的副本。这不仅无法做到数据共享,也是极大的资源浪费。

四、prototype属性的引入

考虑到这一点,Brendan Eich决定为构造函数设置一个prototype属性。

这个属性包含一个对象(以下简称"prototype对象"),所有实例对象需要共享的属性和方法,都放在这个对象里面;那些不需要共享的属性和方法,就放在构造函数里面。

实例对象一旦创建,将自动引用prototype对象的属性和方法。也就是说,实例对象的属性和方法,分成两种,一种是本地的,另一种是引用的。

还是以DOG构造函数为例,现在用prototype属性进行改写:

  function DOG(name){

    this.name = name;

  }

  DOG.prototype = { species : '犬科' };


  var dogA = new DOG('大毛');

  var dogB = new DOG('二毛');


  alert(dogA.species); // 犬科

  alert(dogB.species); // 犬科

现在,species属性放在prototype对象里,是两个实例对象共享的。只要修改了prototype对象,就会同时影响到两个实例对象。

  DOG.prototype.species = '猫科';


  alert(dogA.species); // 猫科

  alert(dogB.species); // 猫科

五、总结

由于所有的实例对象共享同一个prototype对象,那么从外界看起来,prototype对象就好像是实例对象的原型,而实例对象则好像"继承"了prototype对象一样。

如何在iPhone上本地运行SmolVLM?5亿参数模型实战指南(附Swift代码) 本文详细介绍了如何在iPhone上本地部署和运行轻量高效的SmolVLM多模态模型。通过实战指南,分享了使用Swift和MLX框架进行环境配置、模型加载、内存优化以及实现实时图像分析与文本生成的完整流程,帮助开发者在移动端高效运行AI视觉语言模型。 阅读详情

相关推荐

使用cubeMX生成USB HID设备

本文主要介绍如何使用stm32开发板和cubeMX生成HID设备,供参考。

专注音频,高效工作,快乐生活! 970

JS中的八种继承方法

详细讲解js中的八种继承方法,原型链继承、构造函数继承(经典继承)、组合面试、原型式继承、Object.create()、寄生式继承、寄生组合式继承、ES6类继承

weixin_70134200的博客 6646

Vue项目实战:5分钟搞定高德地图离线部署(附避坑指南)

本文详细介绍了在Vue项目中实现高德地图离线部署的完整方案。针对内网或网络隔离环境,通过获取并改造JSAPI文件、下载组织地图瓦片数据,并集成vue-amap组件,实现地图功能的本地化运行。文中提供了核心代码、避坑指南及性能优化建议,帮助开发者快速构建稳定可靠的离线地图应用。

data3的博客 935

Js实现继承的6种方式

Js实现继承的6种方式: 1.原型链继承 2.借用构造函数继承 3.组合继承(经典继承) 4.原型式继承 方法一: 方法二:Object.create() 5.寄生式继承 6.寄生组合式继承 7.ES6、Class实现继承

wuliyouMaozhi的博客 2万+

一次HTTP完整得请求过程

一次HTTP完整的请求过程 一,大致流程: 根据域名和DNS解析到服务器的IP地址(DNS+CDN) 通过ARP协议获得IP地址对应的物理机器得MAC地址 浏览器对服务器发起三次握手 建立TCP连接后发起HTTP请求报文 服务器响应HTTP请求,将响应报文返回浏览器 短连接情况下,请求结束通过TCP四次挥手关闭连接,长连接在没有访问服务器得若干时间后,进行连接关闭 浏览器得到响应信...

qq_40760617的博客 344

Cesium高效渲染海量GeoJSON数据的7种优化策略与实战解析

本文深入解析Cesium高效渲染海量GeoJSON数据的7种优化策略,包括瓦片化转换、LOD分级加载、数据简化等关键技术。通过实战案例展示如何解决渲染卡顿问题,提升矢量数据加载性能,实现流畅的60FPS交互体验。特别针对GeoJSON大数据量场景提供完整优化方案。

h0i1j2k3l的博客 934

【笔记】JS实现继承的几种方式

JS实现继承的几种方式

weixin_44755080的博客 2689

【AI蛋白预测实战】零门槛在Colab上运行AlphaFold2全流程解析

本文为零基础用户提供了在谷歌Colab平台上运行AlphaFold2进行蛋白质结构预测的完整实战指南。通过ColabFold项目,用户无需本地高性能硬件,即可免费利用云端GPU完成从序列输入到3D结构生成和结果可视化的全流程,大幅降低了AI蛋白预测的技术门槛。

mqtt6iot的博客 912

JavaScript继承

寄生组合继承存在效率问题,最主要的效率问题是父类构造函数始终被调用两次,一次是在创建子类原型时调用,另一次是在子类构造函数中调用,本质上,子类原型最终是要包含超类对象的所有实例属性,子类构造函数只要在执行的时候重写自己的原型就可以了。把子类的原型对象指向父类,就能使用父类中的方法和属性了。采用原型式继承不自定义类型,临时创建一个构造函数,借助已有的对象作为临时构造函数的原型,然后在此基础实例化对象,并返回。继承就是指一个子类继承父类的属性和方法,使得子类对象(实例化对象)具有父类的方法和属性。

m0_61480985的博客 1988

【EMC专题】为什么芯片规格书ESD性能中看不到MM(机器放电模型)

器件级ESD包括三种类型,HBM人体放电模型、MM机械放电模型和CDM元件充电模型。但在芯片规格书中为什么只见到HBM模型与CDM模型,却没有看到MM模型的数据?

一点硬件 450

看完就会!手把手教您如何正确开启飞牛Nas 虚拟机的 IOMMU 硬件直通,让虚拟机的性能飙升!

看完就会!手把手教您如何正确开启飞牛Nas 虚拟机的 IOMMU 硬件直通,让虚拟机的性能飙升!

XiaoqiangClub的博客 1万+

js的六种继承方式

1、原型链继承 核心: 将父类的实例作为子类的原型 特点: 1.非常纯粹的继承关系,实例是子类的实例,也是父类的实例 2.父类新增原型方法/原型属性,子类都能访问到 3.简单,易于实现缺点: 1.要想为子类新增属性和方法,必须要在new Animal()这样的语句之后执行,不能放到构造器中 2.无法实现多继承 3.来自原型对象的所有属性被所有实例共享(来自原型对象的引用属性是所有实例共享的) 4.创建子类实例时,无法向父类构造函数传参2、构造函数继承(借助 call) 核心:使用父类的构造函数来增强子类实例

weixin_41759744的博客 7748

wvp gb28181 pro 平台国标级连功能说明

国标28181不同平台之间支持两种连接方式,平级和上下级,WVP目前支持向上级级联。

zengliguang的专栏 3887

原型和原型链—Javascript继承机制的设计思想

写在前面: 以前一直不懂原型和原型链的含义,虽然看过几篇介绍,仍然处于似懂非懂的状态。后来看到一篇文章,通俗易懂,可以很好地理解原型和原型链。先说一下原型和原型链的定义。 原型:JS中的对象都包含了一个prototype的内部属性,这个属性所对应的就是该对象的原型。 原型链:原型链是是有一些用来继承和共享属性的对象组成的对象链。并且原型链的长度是有限的。 正文: 我一直很难理解Javas...

阵雨的博客 599

SIMATIC S7-1200, S7-1500 PID 控制[手册]

SIMATIC S7-1200, S7-1500 PID 控制[手册]

汉书HE8,好用的汇编代码编写工具

汉书HE8,好用的汇编代码编写工具早期编写汇编代码所用功能强大

上一篇: Servlet总结06——servlet过滤器
下一篇: Javascript 面向对象编程(一):封装
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值