js原型

递归终结者
• 阅读 706

在使用封装方法时,当创建了多个对象,则会开辟多个内存空间,对资源造成了极大的浪费。这个时候原型(prototype)就派上用场了。原型是让多个创建的对象在不创建内存的情况下使用一个构造函数,每个函数都会有默认的prototype对象和proto的属性。

原型对象

创建函数的时候默认会创建一个新的对象叫prototype。

function show(){
}
console.log(show.prototype); 

在浏览器中会显示prototype,发现里面有个叫constructor的方法。

js原型

这样,constructor和prototype就开始了无线套娃模式,prototype里面存在constructor,constructor这表明prototype是由哪个对象创建的。

当对象里面的prototype被赋值时,constructor就会被取代掉

show.prototype={
  name:'demo',
} 

js原型

除非重新定义constructor函数,否则在原型对象里面不会出现默认构造函数,当然,如果用“.”来操作的话只是添加属性,并不会让constructor消失

对象原型

对象原型的作用有点像this指针,当实例化一个对象之后,会存在一个名叫proto的默认指针指向该该函数的prototype

console.log(demo.__proto__===show.prototype); 

js原型

三者关系

构造函数、对象原型和原型对象这三者就形成了一种美妙的铁三角关系。构造函数和原型对象之间相互套娃,彼此指向对方。实例化后的对象里面的对象原型则又指向构造函数里面的原型对象,所以可以说实例化对象其实就是通过构造函数的protorype来进行实例化的

原型链

在这三者的关系延伸上发现原型对象里面也有一个原型指针指向一个名叫Object的原型对象,进一步研究发现这个Object里面的constructor指向了这个Object的构造函数,Object的原型对象呢里面又有一个__proto__指针指向了null.
那么这个null就是这整个链路的最底层了
js原型
在检索优先级上面,对象实例上的属性会优先检索到,其次是主原型对象,再是Object,后面就返回空了.

function show(){
    this.name=name
}
show.prototype.name='lbzz2'
let demo=new show()
demo.name='lbzz1'
console.log(demo.name);

输出结果为lbzz1,所以对象属性优先级高于原型对象属性,后面的如法炮制

点赞
收藏
评论区
推荐文章
晴空闲云 晴空闲云
3年前
JavaScript中isPrototypeOf函数详解
有时看一些框架源码的时候,会碰到isPrototypeOf()这个函数,那么这个函数有什么作用呢?isPrototypeOf()isPrototypeOf()是Object函数(类)的下的一个方法,用于判断当前对象是否为另外一个对象的原型,如果是就返回true,否则就返回false。这个函数理解的关键是在原型链上,这个据说是JavaScript
菜园前端 菜园前端
2年前
前端学习重点-原型与原型链
原文链接:什么是原型?每一个函数都包含一个prototype属性,这是一个指针指向"原型对象"(prototypeobject),也就是我们平时说的原型。每一个函数都包含不同的原型对象。当将函数用作构造函数的时候,新创建的对象(实例)会从原型对象上继承属性
灯灯灯灯 灯灯灯灯
3年前
「超全超细」Java设计模式图文详解!!!
java设计模式—原型模式Java原型模式1、概述  啥是原型模式?  原型模式属于设计模式中的创建型中的一员,  原型模式:使用原型实例指定待创建对象的类型,并且通过复制这个原型来创建新的对象!  说大白话就是自己复制自己,通过原生对象复制出一个新的对象,这两个对象结构相同且相似;  需要注意的是,原型对象自己不仅是个对象还是个工厂!并且通过克隆方式创
Souleigh ✨ Souleigh ✨
4年前
Js中 constructor, prototype, __proto__ 详解
本文为了解决以下问题:__proto__(实际原型)和prototype(原型属性)不一样!!!constructor属性(原型对象中包含这个属性,实例当中也同样会继承这个属性)prototype属性(constructor.prototype原型对象)__proto__属性(实例指向原型对象的指针)<br/首先弄清楚几个概念:<br/
Stella981 Stella981
3年前
JavaScript学习总结(十七)——Javascript原型链的原理
一、JavaScript原型链ECMAScript中描述了原型链的概念,并将原型链作为实现继承的主要方法。其基本思想是利用原型让一个引用类型继承另一个引用类型的属性和方法。在JavaScript中,用__proto__属性来表示一个对象的原型链。当查找一个对象的属性时,JavaScript会向上遍历原型
可莉 可莉
3年前
23.JavaScript原型和原型链
1.原型:prototype,所有的函数都有一个属性prototype,称之为函数原型默认情况下,prototype是一个普通的Object对象默认情况下,prototype中有一个属性constructor,它也是一个对象,它指向构造函数本身functionTest(){}Test.prototype:函数Test的原型Test.pr
Stella981 Stella981
3年前
Javascript 是如何体现继承的 ?
js继承的概念js里常用的如下两种继承方式:原型链继承(对象间的继承)类式继承(构造函数间的继承) 由于js不像java那样是真正面向对象的语言,js是基于对象的,它没有类的概念。所以,要想实现继承,可以用js的原型prototype机制或者用apply和call方法去实现在面向对象的语言中,我们使用类来创建一个自定义对象
Wesley13 Wesley13
3年前
JS函数高级
原型与原型链所有函数都有一个特别的属性:prototype:显式原型属性所有实例对象都有一个特别的属性:__proto__:隐式原型属性显式原型与隐式原型的关系函数的prototype:定义函数时被自动赋值,值默认为{},即用为原型对象
Wesley13 Wesley13
3年前
JS原型、原型链深入理解
原型是JavaScript中一个比较难理解的概念,原型相关的属性也比较多,对象有”prototype”属性,函数对象有”prototype”属性,原型对象有”constructor”属性。原型是JavaScript中一个比较难理解的概念,原型相关的属性也比较多,对象有”prototype”属性,函数对象有”prototype”属性,原型对
Stella981 Stella981
3年前
JavaScript 基于原型链的继承
JavaScript对象是动态的属性“包”(指其自己的属性)。JavaScript对象有一个指向一个原型对象的链。当试图访问一个对象的属性时,它不仅仅在该对象上搜寻,还会搜寻该对象的原型,以及该对象的原型的原型,依次层层向上搜索,直到找到一个名字匹配的属性或到达原型链的末尾。遵循ECMAScript标准,someObject.Prototype
Stella981 Stella981
3年前
Javascript 构造函数和类
1.构造函数构造函数的名称一般都是首字母大写挂载在this上面的属性为实例属性,实例属性再每个实例间都是独立的原型链属性通过prototype添加,他是所有实例共享的类方法/静态属性只能由构造函数本身访问当实例属性和原型链上的属性重名时,优先访问实例属性,没有实例属性再访问原型属性大多数浏览器的ES5实现之中,每一个对象都有\_\_pr
递归终结者
递归终结者
Lv1
砧杵敲残深巷月,井梧摇落故园秋。
文章
4
粉丝
0
获赞
0