原型

JavaScript没有传统的面向对象模型。事实上,JavaScript根本就没有类。在JavaScript中,对象从其他对象那里继承行为,我们称之为原型式继承或基于原型的继承。
在这里插入图片描述

构造函数:它能让我们重用代码,但效率如何呢?

在这里插入图片描述
在这里插入图片描述
这些代码创建三个小狗对象。使用新对象图表示时,这些对象类似于下面这样。
在这里插入图片描述
在这里插入图片描述
一般而言,我们不希望每次使用构造函数实例化一个对象时,都创建一组新的方法。这样会影响应用程序的性能,占用计算机资源。还有更灵活、更强大的JavaScript对象创建方式。

构造函数的主要目的:试图重用行为。例如,创建大量的小狗对象时,我们希望这些对象都使用相同的bark方法。通过使用构造函数,我们只需将bark方法放在构造函数Dog中,这样每次实例化对象时,豆浆重用方法bark代码,从而在代码层面实现重用行为目的。但在运行阶段,这种解决方案的效果并不好,因为每个小狗对象都讲获得自己的bark方法的副本。

为何会出现这种问题呢?这是因为我们没有充分利用JavaScript对象模型。JavaScript对象模型基于原型的概念,在这种模型中,可通过扩展其他对象(即原型对象)来创建对象

原型是什么

JavaScript对象可以从其他对象那里继承属性和行为。更具体地说,JavaScript使用原型式继承,其中其行为被继承的对象称为原型。这旨在继承既有属性(包括方法),同时在新对象中添加属性。
我们来看一个示例。
在这里插入图片描述

继承原型

首先,需要创建小狗对象Fido、Fluffy和Spot的对象图,让它们继承新创建的小狗原型。为表示继承关系,我们讲绘制从小狗实例到原型的虚线。别忘了,我们只将所有小狗都需要的方法和属性放在小狗原型中,因为所有小狗都将继承它们。对于所有随小狗对象而异的属性,如name,我们都将其放在小狗实例中。
在这里插入图片描述

继承的工作原理

既然方法bark并不包含在各个小狗对象中,而是包含在原型中,如何让小狗发出叫声呢?这正是继承的用武之地。对对象调用方法是,如果在对象中找不到,将在原型中查找它,如下图所示。

在这里插入图片描述
属性的情况也一样。如果我们编写了需要获取fido.name的代码,将从fido对象中获取这个值。如果要获取fido.species的值,将首先在对象fido中查找;在这里找不到后,将接着在小狗原型中查找(结果是找到了)。
在这里插入图片描述
通过使用原型,可快速地创建对象,这些对象不仅能够重用代码,还能新增行为和属性。

重写原型

继承原型并不意味着必须与他完全相同。在任何情况下,都可以重写原型的属性和方法,为此只需在对象实例中提供他们即可。
下面来看看如何在对象spot中重写方法bark,让它发出叫声时显示says WOOF!
在这里插入图片描述

原型从哪里来

下面演示了如何在代码中访问这个原型:

Dog.prototype // 如果你查看构造函数Dog,将发现它有一个prototype属性。这是一个指向原型的引用

在这里插入图片描述
简单地说,在JavaScript中,函数也是对象。实际上,在JavaScript中,几乎所有的东西都是对象,数组也是——你可能还没有意识到这一点。
函数还可以有属性,而构造函数都包含属性prototype

如何设置原型

可通过构造函数Dog的属性prototype来访问原型对象,但这个原型对象包含哪些属性和方法呢?默认包含的不多。你需要给原型添加属性和放啊,这通常是在使用构造函数前进行的。

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值