理解JavaScript 的原型属性
1.原型继承
面向对象编程可以通过很多途径实现。其他的语言,比如 Java,使用基于类的模型实现: 类及对象实例区别对待。但在 JavaScript 中没有类的概念,取而代之的是一切皆对象。JavaScript 中的继承通过原型继承实现:一个对象直接从另一对象继承。对象中包含其继承体系中祖先的引用——对象的 prototype 属性。
2. JavaScript 实现继承的语言特性
当尝试访问 JavaScript 对象中不存在的属性时,解析器会查找匹配的对象原型。例如调用 car.toString(),如果 car 没有 toString 方法,就会调用 car 对象的原型。 这个查找过程会一直递归, 直到查找到匹配的原型或者继承链尽头。
调用 new Car() 会创建一个新的对象,并初始化为 Car.prototype。 这样就允许为新对象设置原型链。需要注意的是,new Car() 只有当 Car 是函数时才有意义。 此类函数即所谓构造函数。
调用对象的一个成员函数时, this 的值被绑定为当前对象。例如调用 "abc".toString(),this 的值被设置为 "abc",然后调用 toString 函数。该技术支持代码重用:同样的代码,可在 this 为各种不同的值时调用。对象的成员函数,也被称为对象的方法。

首先,我们定义构造函数 Rectangle。 按照规范,我们大写构造函数名首字母,表明它可以用 new 调用,以示与其他常规函数的区别。构造函数自动将 this 赋值为一空对象,然后代码中用 x 和 y 属性填充它,以备后用。然后, Rectangle.prototype 新增一个通过 x 和 y 属性计算周长成员函数。 注意 this 的使用,在不同的对象中,this 会有不同的值,这些代码都可以正常工作。最后, 一个名为 rect 的对象创建出来了。 它继承了 Rectangle.prototype, 我们可以调用 rect.perimeter(), 然后将结果打印到控制台。
prototype 属性名称带来的误解
有一些关于 JavaScript 的原型的误解。 一个对象的原型与对象的 prototype 属性并非一回事。 前者用于在原型链中匹配不存在的属性。后者用于通过 new 关键字创建对象,它将作为新创建对象的原型。 理解二者的差异,将帮助你彻底理解 JavaScript 中的原型特性。
Rectangle.prototype 是用 new Rectangle() 创建出来对象的原型, 而 Rectangle 的原型实际上是 JavaScript 的 Function.prototype。(子对象的原型是父对象的 prototype 属性 对象中保存原型的变量,也被称之为内部原型引用(the internal prototype link),历史上也曾称之为 __proto__ ,对这个称谓始终存在一些争议。 更精确的,它可以被称为 Object.getPrototypeOf(...) 的返回值。
理解JavaScript 的原型属性的更多相关文章
- 深入理解JavaScript中的属性和特性
深入理解JavaScript中的属性和特性 JavaScript中属性和特性是完全不同的两个概念,这里我将根据自己所学,来深入理解JavaScript中的属性和特性. 主要内容如下: 理解JavaSc ...
- 理解 JavaScript 对象原型、原型链如何工作、如何向 prototype 属性添加新的方法。
JavaScript 常被描述为一种基于原型的语言 (prototype-based language)——每个对象拥有一个原型对象,对象以其原型为模板.从原型继承方法和属性.原型对象也可能拥有原型, ...
- 简单理解javascript的原型prototype
原型和闭包是Js语言的难点,此文主要讲原型. 每一个方法都有一个属性是 prototype 每一个对象都有一个属性是 _proto_ 一旦定义了原型属性或原型方法,则所有通过该构造函数实例化出来的所有 ...
- 三张图较为好理解JavaScript的原型对象与原型链
最近从网上看到别人详细得讲解了js的原型对象和原型链,看完感觉是看得最清晰的一个,于是,摘录到自己博客里 对于新人来说,JavaScript的原型是一个很让人头疼的事情,一来prototype容易与_ ...
- 理解Javascript的原型和原型链
前言 本文2088字,阅读大约需要13分钟. 总括: 结合实例阐述了原型和原型链的概念并总结了几种创建对象的方法,扩展原型链的方法. 参考文章:The Secret Life of Objects,继 ...
- 理解JavaScript的原型链
1. 什么是对象 在JavaScript中,对象是属性的无序集合,每个属性存放一个原始值.对象或函数. 1.1 创建对象 在JavaScript中创建对象的两种方法: ① 字面上: var myObj ...
- 深入理解javascript之原型
理解原型 原型是一个对象.其它对象能够通过它实现属性继承. 不论什么一个对象都能够成为继承,全部对象在默认的情况下都有一个原型.由于原型本身也是对象,所以每一个原型自身又有一个原型. 不论什么一个对象 ...
- 如何理解JavaScript的原型和原型链
在现在的业务开发中,应该很少人在写原生JavaScript了,大家都一股脑地扑在各个框架上.本来,这些框架对于业务和开发者来说是一种福音,减少了各种各样的开发痛点,但是带来的负面问题就是对于开发者来说 ...
- [我的理解]Javascript的原型与原型链
一.原型与原型链的定义 原型:为其他对象提供共享属性的对象 注:当构造器创建一个对象,为了解决对象的属性引用,该对象会隐式引用构造器的"prototype"属性.程序通过const ...
随机推荐
- Set Windows IP by Batch
netsh interface ip set address name="Local" static 192.168.1.55 255.255.255.0 192.168.1.1 ...
- ASP.Net动态创建GridView
1.创建Field BoundField requestitem = new BoundField();//注意Field可以是ButtonField,TemplateField,...等等GridV ...
- XAML 命名空间和命名空间映射
本主题将介绍大部分 XAML 文件的根元素中存在的 XML/XAML 命名空间 (xmlns) 映射.它还将介绍如何为自定义类型和程序集生成类似的映射. XAML 命名空间如何与代码定义和类型库相关 ...
- [c#]控制台进度条的示例
看到[vb.net]控制台进度条的示例 感觉很好玩,翻译成C#版. using System; using System.Collections.Generic; using System.Linq; ...
- 1.1C++入门 未完待续。。。
第一个C++程序: #include<iostream> int main() { std::cout << "Hello World !" << ...
- POJ1276:Cash Machine(多重背包)
Description A Bank plans to install a machine for cash withdrawal. The machine is able to deliver ap ...
- Win7下部署 .NET MVC网站 之 HTTP错误 403.14-Forbidden 解决方法
今天在 IIS 7 发布MVC 站点时 遇到 ”HTTP错误 403.14-Forbidden Web 服务器被配置为不列出此目录的内容 “ 的错误提示. 一番折腾后发现在web.config 中加入 ...
- Backbone的 listenTo 和 on
使用情景区别 listenTo用于监听自身意外的对象 on用于监听自身 listenTo和on中的回调函数里的this的区别 listener.listenTo(object, 'eventName' ...
- DEDE数据库修改
dede数据库配置文件所在路径为:/data/common.inc.php 修改方法: 下面是该dede数据库配置文件的内容: <?php //数据库连接信息 $cfg_dbhost = 'lo ...
- Android再学习-20141022-Activity的生命周期
20141022-Android再学习 如何在一个应用程序当中定义多个Activity 定义一个类,继承Activity 在该类当中,复写Activity当中的onCreate方法.onCreate( ...