位置: 编程技术 - 正文

javascript学习笔记(五)原型和原型链详解(javascript学习指南)

编辑:rootadmin

推荐整理分享javascript学习笔记(五)原型和原型链详解(javascript学习指南),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:javascript教程推荐知乎,javascript怎么学,javascript教程推荐知乎,javascript基础笔记,javascript基础笔记,javascript入门教程,javascript教程推荐知乎,javascript入门教程,内容如对您有帮助,希望把文章链接给更多的朋友!

私有变量和函数

在函数内部定义的变量和函数,如果不对外提供接口,外部是无法访问到的,也就是该函数的私有的变量和函数。

这样在函数对象Test外部无法访问变量color和fn,他们就变成私有的了:

静态变量和函数

当定义一个函数后通过点号 “.”为其添加的属性和函数,通过对象本身仍然可以访问得到,但是其实例却访问不到,这样的变量和函数分别被称为静态变量和静态函数。

实例变量和函数

在面向对象编程中除了一些库函数我们还是希望在对象定义的时候同时定义一些属性和方法,实例化后可以访问,JavaScript也能做到这样

为实例变量和方法添加新的方法和属性

在o1中修改了a和fn,而在o2中没有改变,由于数组和函数都是对象,是引用类型,这就说明o1中的属性和方法与o2中的属性与方法虽然同名但却不是一个引用,而是对Obj对象定义的属性和方法的一个复制。

这个对属性来说没有什么问题,但是对于方法来说问题就很大了,因为方法都是在做完全一样的功能,但是却又两份复制,如果一个函数对象有上千和实例方法,那么它的每个实例都要保持一份上千个方法的复制,这显然是不科学的,这可肿么办呢,prototype应运而生。

基本概念

我们创建的每个函数都有一个prototype属性,这个属性是一个指针,指向一个对象,这个对象的用途是包含可以由特定类型的所有实例共享的属性和方法。那么,prototype就是通过调用构造函数而创建的那个对象实例的原型对象。

使用原型的好处是可以让对象实例共享它所包含的属性和方法。也就是说,不必在构造函数中添加定义对象信息,而是可以直接将这些信息添加到原型中。使用构造函数的主要问题就是每个方法都要在每个实例中创建一遍。

在JavaScript中,一共有两种类型的值,原始值和对象值。每个对象都有一个内部属性 prototype ,我们通常称之为原型。原型的值可以是一个对象,也可以是null。如果它的值是一个对象,则这个对象也一定有自己的原型。这样就形成了一条线性的链,我们称之为原型链。

含义

函数可以用来作为构造函数来使用。另外只有函数才有prototype属性并且可以访问到,但是对象实例不具有该属性,只有一个内部的不可访问的__proto__属性。__proto__是对象中一个指向相关原型的神秘链接。按照标准,__proto__是不对外公开的,也就是说是个私有属性,但是Firefox的引擎将他暴露了出来成为了一个共有的属性,我们可以对外访问和设置。

当我们调用Bro.run()方法时,由于Bro中没有这个方法,所以,他就会去他的__proto__中去找,也就是Browser.prototype,所以最终执行了该run()方法。(在这里,函数首字母大写的都代表构造函数,以用来区分普通函数)

当调用构造函数创建一个实例的时候,实例内部将包含一个内部指针(__proto__)指向构造函数的prototype,这个连接存在于实例和构造函数的prototype之间,而不是实例与构造函数之间。

Person的实例person1中包含了name属性,同时自动生成一个__proto__属性,该属性指向Person的prototype,可以访问到prototype内定义的printName方法,大概就是这个样子的:

再举个栗子:

可以从程序运行结果看出,构造函数的prototype上定义的方法确实可以通过对象直接调用到,而且代码是共享的。(可以试一下将Animal.prototype.behavior 中的prototype属性去掉,看看还能不能运行。)在这里,prototype属性指向Animal对象。

数组对象实例

再看个数组对象的实例。当我们创建出array1这个对象的时候,array1实际在Javascript引擎中的对象模型如下:

array1对象具有一个length属性值为3,但是我们可以通过如下的方法来为array1增加元素:

javascript学习笔记(五)原型和原型链详解(javascript学习指南)

array1.push(4); push这个方法来自于array1的__proto__成员指向对象的一个方法(Array.prototye.push())。正是因为所有的数组对象(通过[]来创建的)都包含有一个指向同一个具有push,reverse等方法对象(Array.prototype)的__proto__成员,才使得这些数组对象可以使用push,reverse等方法。

函数对象实例

这样代码的结果是什么,我们在Javascript引擎中看到的对象模型是:

new操作符具体干了什么呢&#;其实很简单,就干了三件事情。

原型链

原型链:当从一个对象那里调取属性或方法时,如果该对象自身不存在这样的属性或方法,就会去自己关联的prototype对象那里寻找,如果prototype没有,就会去prototype关联的前辈prototype那里寻找,如果再没有则继续查找Prototype.Prototype引用的对象,依次类推,直到Prototype.….Prototype为undefined(Object的Prototype就是undefined)从而形成了所谓的“原型链”。

这里,用构造器Shape()新建了一个实体,然后用它去覆盖该对象的原型。

原型继承

原型继承:在原型链的末端,就是Object构造函数prototype属性指向的那个原型对象。这个原型对象是所有对象的祖先,这个老祖宗实现了诸如toString等所有对象天生就该具有的方法。其他内置构造函数,如Function,Boolean,String,Date和RegExp等的prototype都是从这个老祖宗传承下来的,但他们各自又定义了自身的属性和方法,从而他们的子孙就表现出各自宗族的那些特征。

ECMAScript中,实现继承的方法就是依靠原型链实现的。

原型链的问题:原型链虽然很强大,可以用它来实现继承,但它也存在一些问题。其中最主要的问题来自包含引用类型的值原型。包含引用类型的原型属性会被所有实例共享;而这也正是为什么要在构造函数中,而不是在原型对象中定义属性的原因。在通过原型来实现继承时,原型实际上回变成另一个类型的实例。于是,原先的实例属性也就变成了原型的属性。

在创建子类型的实例时,不能向超类型的构造函数中传递参数。实际上,应该说是没有办法在不影响所有对象实例的情况下,给超类型的构造函数传递参数。再加上刚刚讨论的由于原型中包含引用类型值所带来的问题,实践中很少会单独使用原型链。

再举个栗子:

看下面一个原型链例子:

从上面例子中,test对象从Hi.prototype和Year.prototype中继承下来;因此他能访问Year的原型方法method,同时他能访问实例属性value

__ptoto__属性

__ptoto__属性(IE浏览器不支持)是实例指向原型对象的一个指针,它的作用就是指向构造函数的原型属性constructor,通过这两个属性,就可以访问原型里的属性和方法了。

Javascript中的对象实例本质上是由一系列的属性组成的,在这些属性中,有一个内部的不可见的特殊属性——__proto__,该属性的值指向该对象实例的原型,一个对象实例只拥有一个唯一的原型。

__proto__属性和prototype属性的区别

prototype是function对象中专有的属性。__proto__是普通对象的隐式属性,在new的时候,会指向prototype所指的对象;__ptoto__实际上是某个实体对象的属性,而prototype则是属于构造函数的属性。__ptoto__只能在学习或调试的环境下使用。

原型模式的执行流程

1.先查找构造函数实例里的属性或方法,如果有,就立即返回。2.如果构造函数的实例没有,就去它的原型对象里找,如果有,就立即返回

原型对象的

构造函数的

javascript学习笔记(六)数据类型和JSON格式 什么是JSONJSON:JavaScript对象表示法(JavaScriptObjectNotation)。JSON的形式是用大括号{}包围起来的项目列表,每一个项目间用逗号(,)分隔,而项目就是用

javascript学习笔记(七)Ajax和Http状态码 Ajax及其工作原理AJAX是一种与服务器交换数据无需刷新网页的技术,最早由Google公司在谷歌地图里使用,并迅速风靡。AJAX是不能跨域的,如需跨域,可

javascript学习笔记(八)正则表达式 基本概念正则表达式是一种文本模式,包括普通字符(例如,a到z之间的字母)和特殊字符(称为元字符)。模式描述在搜索文本时要匹配的一个或多个

标签: javascript学习指南

本文链接地址:https://www.jiuchutong.com/biancheng/385656.html 转载请保留说明!

上一篇:javascript学习笔记(四)function函数部分(javascript教程完整版)

下一篇:javascript学习笔记(六)数据类型和JSON格式(javascript总结笔记)

  • 增值税专用发票的税率是多少啊
  • 小规模季报利润表本月金额和本年累计金额
  • 预缴纳税和年度汇缴
  • 名义股东转让股份侵权
  • 合伙做生意账目
  • 坏账确认无法收回的会计分录
  • 应付账款发生额在哪方
  • 闲置资金怎么说?
  • 月末收到一批b材料,结算凭证未到,估价50000
  • 购进商品返点的钱用于抵扣货款怎么入账?
  • 筹备费用怎么扣税的
  • 增值税专用发票开错了咋办
  • 理财产品增值税纳税人
  • 残保基金属税金怎么算
  • 各税种会计分录
  • 苏州工会经费减半政策
  • 个人住房交易50万元
  • 金融资产包括哪三大类及会计科目
  • 出售废旧物资可以开专票吗
  • 个人所得税做账怎么做
  • 现金清偿债务怎么算
  • 公司原因领不了失业保险要赔偿吗
  • 兼营行为的含义
  • 园林绿化工程公司有哪些
  • 如何修复windows11无法的注册表值
  • 王者荣耀中吕布的克星
  • 新版关闭edge地址栏建议
  • 一般纳税人问题
  • 年终奖个税如何计算
  • 以租代购算固定资产吗
  • 固态硬盘什么牌子性价比高
  • 资产减值损失的科目编码
  • 所得税贷款利息扣除
  • php require include
  • 结算劳务外包的工作内容
  • 临时经营如何纳税
  • php控制器是用来做什么的
  • 建筑工程房屋租赁费属于什么费用
  • javaweb入门简单小项目
  • html扫码功能
  • 民办学校学费收入
  • 公司进项抵税
  • wordpress运行缓慢
  • dedecms安装步骤
  • 税控盘锁死日期是什么意思
  • 年终奖的个税税率表
  • 附加税计税依据扣除留抵退税
  • 企业所得税会计利润
  • 广告制作费怎么入账
  • 应交税费明细科目设置最新
  • 企业发生的职工福利费支出,不超过工资
  • 居民和非居民企业的区别是什么
  • 预缴所得税科目
  • 应收账款对应什么会计科目
  • 多计费用以前年度损益调整账务处理
  • 单位租用员工个人的车可以不收租吗
  • 工程预付款如何扣回
  • 特别提款权和普通提款权的区别
  • mysql 常用
  • 苹果发布会最新消息
  • linux find -perm 详解
  • win7桌面图标变成了lnk
  • linux磁盘配额实验报告
  • win8升级win10补丁
  • ubuntu怎么设置成中文
  • 怎么设置开机启动项?
  • win8计算器在哪里找
  • win10应用商店下载不了
  • javascript中的函数
  • jquery插件是干什么的
  • Linux makefile 和shell文件相互调用实例详解
  • vue.js 开发工具
  • python数据清洗的方法有哪些
  • jquery鼠标点击事件怎么写
  • javascript例题
  • js验证正则表达式
  • jquery通过属性值获取元素
  • 棚改房办房产证用不用交费
  • 宁波增值税普通发票有几联发票
  • 北京密云十里堡镇河漕社区卫生服务站
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设