资讯专栏INFORMATION COLUMN

JS原型链

番茄西红柿 / 1523人阅读

摘要:组合继承把公共数据放在中,这样的话就不会公用一个引用类型,优化组合继承,判断原型和实例的关系,只要是原型链中的都可以

  原型链

  1. 每一个实例都有自己的原型,可以__proto__访问
  2. 构造函数,通过new创建实例
  3. 构造函数通过prototype指向原型对象
  4. 原型对象通过constructor指向构造函数
  5. 如下图所示:
  6. 访问对象中的属性,如果不存在,那么会在原型中查找,如果还没有,继续在原型中查找

    继承

1 构造函数

function Parent(name) {
    this.name = name
}
function Child(age) {
    Parent.call(this);
    this.age = age
}

  

2 原型链

child.prototype = new Parent()
缺点:当存在引用类型的时候,一个实例数据的改变,另一个也会改变,例如 P1.friend = [Jany, LiMINg],当P1增加一个朋友,另外的实例也会增加。

3 组合继承

把公共数据放在Parent中,这样的话就不会公用一个引用类型

1 function Parent(name) {
2     this.name = [‘Jang’,‘Dany’]
3 }
4 function Child(age) {
5     Parent.call(this);
6     this.age = age
7 }
8 child.prototype = new Parent()

 

4 优化组合继承

function Parent(name) {
    this.name = [‘Jang’,‘Dany’]
}
function Child(age) {
    Parent.call(this);
    this.age = age
}
Child.prototype = Object.create(Parent.prototype)
Child.prototype.constructor = Child

  

判断原型和实例的关系

1. instance instanceof object,只要是原型链中的都可以
2. object.prototyoe.isprototypeoof(instance)
3. object.prototype.tostring.call(instance)

  

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/1943.html

相关文章

  • JS基础-原型原型真的不能一知半解

    摘要:原型链和对象的原型是对象实例和它的构造函数之间建立的链接,它的值是构造函数的。对象的原型根据上文提到的构造调用函数的时候会创建一个新对象,自动将的原型指向构造函数的对象。 showImg(https://segmentfault.com/img/remote/1460000020185197); JS的原型、原型链一直是比较难理解的内容,不少初学者甚至有一定经验的老鸟都不一定能完全说清...

    changfeng1050 评论0 收藏0
  • 从实现角度分析js原型

    摘要:从实现角度分析原型链欢迎来我的博客阅读从实现角度分析原型链网上介绍原型链的优质文章已经有很多了,比如说作为补充,就让我们换个角度,从实现来分析一下吧本文假设你对原型链已经有所了解。 从实现角度分析js原型链 欢迎来我的博客阅读:《从实现角度分析js原型链》 网上介绍原型链的优质文章已经有很多了,比如说: https://github.com/mqyqingfeng/Blog/issu...

    CompileYouth 评论0 收藏0
  • 理解js原型与继承

    摘要:相当于在用原型继承编写复杂代码前理解原型继承模型十分重要。同时,还要清楚代码中原型链的长度,并在必要时结束原型链,以避免可能存在的性能问题。 js是一门动态语言,js没有类的概念,ES6 新增了class 关键字,但只是语法糖,JavaScript 仍旧是基于原型。 至于继承,js的继承与java这种传统的继承不一样.js是基于原型链的继承. 在javascript里面,每个对象都有一...

    wthee 评论0 收藏0
  • js原型 原型 原型的继承

    摘要:图片描述缺点是无法实现多继承可以在构造函数中,为实例添加实例属性。 对象的方法 Object.assign() 对象可以简写 ,如果 key 和 value 相等则可以简写 let name = xm; let age = 2; let obj = { name, age, fn(){ // 可以省略函数关键字和冒号: console.log(2...

    soasme 评论0 收藏0
  • js原型

    摘要:构造函数,实例,原型三者的关系如下图构造函数是构成整个原型链的关键,是他利用将原型传给了后代。因此,通过操纵构造函数的,就能够操纵原型链,从而对原型链进行自在的拼接。 要理解js的原型链主要就是理清楚以下三者的关系: 构造函数的protitype属性 对象的__proto__属性 对象的constructor属性 在js中,函数作为一等公民,它是一个对象,可以拥有自己的属性,可...

    NervosNetwork 评论0 收藏0
  • 【前端基础进阶】JS原型原型、对象详解

    摘要:二构造函数我们先复习一下构造函数的知识上面的例子中和都是的实例。这两个实例都有一个构造函数属性,该属性是一个指针指向。原型链其中是对象的实例。 一. 普通对象与函数对象 JavaScript 中,万物皆对象!但对象也是有区别的。分为普通对象和函数对象,Object 、Function 是 JS 自带的函数对象。下面举例说明 var o1 = {}; var o2 =new Objec...

    explorer_ddf 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<