本文阐述了JS学习笔记的原型链和原型继承。分享给大家参考,如下:
原型链
原型链是一种关系,实例对象和原型对象之间的关系,这种关系是由原型(_ _ prototype _)连接起来的
实例对象中有__proto__是一个叫prototype的对象,但不是浏览器使用的标准属性,有些浏览器在构造函数中不支持prototype属性,也是一个叫prototype的对象
请注意,原型中的方法可以相互访问
示例代码
函数动物(名称,年龄){ this.name=namethia.age=年龄;}//添加方法animal . prototype . eat=function(){ console . log('动物吃草')this . play()} animal . prototype . play=function(){ console . log('玩什么')} prototype的简单语法
与原型共享数据
第一种写作方式
函数Student(姓名、年龄、性别){ this.name=namethis.age=年龄;this.sex=sex} Student . prototype . height=' 188 ' Student . prototype . weight=' 55kg ' Student . prototype . study=function(){ console . log('好好学习我')} var stu=new Student('小红',20,'男')console
第二种写作方式
函数Student(姓名、年龄、性别){ this.name=namethis.age=年龄;this.sex=sex} student.prototype={身高:' 188 ',体重:' 55 kg ',study : function(){ console . log('好好学习i')}} var stu=new Student('小红',20,'男')console.dir()。
结果
我们会发现两种写法还是有区别的。第二种编写方法将导致构造函数属性消失,因此我们手动修改构造函数指向
最终代码
函数Student(姓名、年龄、性别){ this.name=namethis.age=年龄;this.sex=sex} Student . prototype={ constructor : Student,身高:' 188 ',体重:' 55 kg ',study : function(){ console . log('好好学习我')}} var stu=new Student('小红',20,'。
好了,这次有了
实例对象使用属性或方法的规则
现在在实例中搜索实例对象使用的属性或方法。如果它存在,将使用它自己的属性或方法。如果不存在,将通过__proto__指向的原型对象使用。如果找不到,它将继续搜索__proto__,并报告错误,直到找不到为止。
构造函数以及实例对象和原型对象之间的关系
构造函数可以实例化一个对象。构造函数中的属性称为prototype,它是构造函数的原型对象。构造函数的原型对象中有一个构造函数。此构造函数指向其原型对象所在的构造函数实例对象的原型对象(_ _ prototype _)。构造函数的原型对象中的方法可以是
你能改变原型吗?
首先,我们需要知道这在构造函数和实例对象中指向什么
在这里,我创建了一个自定义构造函数Person,并在内部输出它
此外,一个eat方法被添加到Person的原型对象中,并且一个this也被输出。
然后我实例化了一个对象,并调用了eat方法。
让我们运行它,看看结果如何
输出结果
如此获得的
原型对象中的方法中的这个是实例对象
这在构造函数中是实例对象
接下来,我们尝试改变原型的方向
在这段代码中,我首先定义了一个Person自定义构造函数,并在原型中添加了eat方法
定义了一个学生函数,并在原型上定义了一个sayHi方法。
然后我把学生的原型指向了人的实例对象
然后实例化一个Student,然后尝试在stude实例上分别调用eat方法和sayHi方法。
运行结果
此时,我们可以通过以下代码确认stu实例对象的原型点已被更改
学生原型=新人(10);摘要
原型指向一些可以改变的东西
实例对象的原型__proto__指向对象所在的构造函数的原型对象
如果构造函数的原型对象(原型)点改变,实例对象的原型(_ prototype _ _)点也将改变
实例对象和原型对象之间的关系由__proto__ prototype链接,这种关系就是原型链
如果原型方向改变,那么应该在原型改变方向之后添加原型方法
sayHi方法是在实例对象new Person(10)上创建的
原型最终指向哪里
实例对象中的__proto__指向构造函数的原型
以这段代码为例
测试一下
因此
每个实例对象的__proto__指向- Person.prototype-_ _ proto _ _指向- Object.prototype为空
看看html的dom对象,有一个有趣的原型链
祖传的JPG在这里献祭
实现继承
:实例的小知识判断方法
从左操作数的__proto__路由开始,从右操作数的原型开始,如果两条路由最终指向一个引用,则为真
1.使用调用借用构造函数继承
Advantage :实现了继承的属性,但值都不同
缺陷:不能继承父类原型上的方法
功能人(姓名、年龄、性别、体重){ this.name=namethis.age=年龄;this.sex=sexthis.weight=重量;} Person . prototype . say hi=function(){ console . log(' hello ')} function student(姓名、年龄、性别、体重、分数){//将当前实例对象传入person,借用一次即可达到继承效果person.call (this,姓名、年龄、性别、体重);this.score=score} var stu1=新生('小明',10,'男',' 10kg ',' 100')2。原型实现继承
有了原型,学生的原型指向人,达到传承的效果。
优点:继承父原型上的方法
缺陷:实例化多个学生必须共享相同的姓名和年龄
学生原型构造函数=学生注释:使用原型继承时,需要将构造函数的方向改回正确的方向
函数Person(姓名、年龄){ this.name=namethis.age=年龄;} Person . prototype . eat=function(){ console . log(' Person eat ')} function Student(num,Score){ this . num=numthis . Score=Score }//inherits . prototype=new Person(' Xiaohong ',10)Student . prototype . constructor=Student var stu=new Student(2016002288,80) stu.eat()
组合遗传实际上是将上述两种方法结合起来实现遗传,具有两种方法的优点
函数Person(姓名、年龄、性别){ this.name=namethis.age=年龄;this.sex=sex} person . prototype . say hi=function(){ console . log(' hello ')} function student(姓名、年龄、性别、分数){//借用了构造函数person.call (this,姓名、年龄、性别)this。score=score }//更改了原型点//传无值student . prototype . eat=function(){ console . log(' eat ');} var stu=new Student('小黑',20,'男',' 100分')console.log (stu.name,stu.age,stu.sex,stu . score);Stu.sayHi()//你好stu.eat()//Eat 4。复制继承
与复制类似,一个对象中的属性和方法被直接复制到另一个对象中
函数person(){ } person . prototype . name=' Xiaohong ' person . prototype . age=18函数student(){ } var p=person . prototype;学生原型;for(键入p){ s[key]=p[key] } console.dir(学生)控制台
每次进去都很累,可以优化打包
函数扩展(子,父){ var p=Parent.prototypevar c=Child .原型;for(p中的var I){ c[I]=p[I];}//这个属性直接指向父对象的原型属性,可以直接调用父对象的方法。为了达到继承的完备性,纯粹是备用属性c . par=p;}5.直接继承原型
优势:效率更高
缺陷:因为相当于一个地址转移过程,学生属性Person的修改也会改变
函数person(){ };Person.prototype.name='小红;人。原型。年龄=18岁;函数student(){ };学生原型=人原型;控制台目录(学生);控制台目录(人);学生原型年龄=25岁;安慰
6.利用空对象作中介实现继承
用这种方式修改学生的原型不会影响到人的原型
函数person(){ };Person.prototype.name='小红;人。原型。年龄=11岁;函数student(){ };var F=function(){ };原型=人原型;学生。原型=新F();学生。原型。构造者=学生;学生原型年龄=25岁;控制台。目录(个人)控制台。目录(学生)控制台
封装一下
函数扩展(子,父){ var F=function(){ };原型=父原型;孩子。原型=新F();孩子。原型。构造函数=子;孩子。par=父级。原型;}更多关于Java脚本语言相关内容还可查看本站专题: 《javascript面向对象入门教程》 、 《JavaScript错误与调试技巧总结》 、 《JavaScript数据结构与算法技巧总结》 、 《JavaScript遍历算法与技巧总结》 及《JavaScript数学运算用法总结》
希望本文所述对大家Java脚本语言程序设计有所帮助。