原型链js简书,如何理解js中的原型链

  原型链js简书,如何理解js中的原型链

  本文给大家带来了一些关于javascript的知识,主要介绍了一些关于原型链的相关问题。原型链指的是__proto__指针形成的一些原型的链表。原型链可以为想要共享原型链中数据的对象提供服务。希望对你有帮助。

  推荐:javascript教程

  

1.原型链

  

1.1 原型链解释:

  (概念)原型链是指由__proto__指针构成的一些原型的链表。原型链可以服务于想要共享原型链中数据的对象,并用于实现JavaScript中的继承机制。

  (原型链指针)原型链中涉及的指针:

  每个对象都有一个__proto__指针来访问对象的原型。每个原型都是用来实现继承的对象。除了__proto__指针,还有指向构造函数的构造函数指针。每个函数都是一个对象。除了__proto__指针之外,还有指向与之关联的原型对象的原型指针,即prototype和__proto的指针。

1.2 不涉及继承的原型链图示:

  构造器类型原型链:原型链服务的对象由构造器(这张图非常重要,涉及了底层的链,网上也有类似的图)函数A() {

  }

  设a1=新A()

  设a2=新A()

  设a3=新A()

  //这几行代码将产生如下所示的原型链。

  非构造函数类型原型链:原型链服务的对象由工厂函数、对象文字、Object.create等生成。让A={

  测试:“”

  }

  设a1=Object.create(A)

  设a2=Object.create(A)

  设a3=Object.create(A)

  //这几行代码对应下面显示的原型链。

  简化原型链:实际考虑原型链时,往往不需要考虑“构造函数实例对应的原型链”,甚至‘原型链端点’和‘object . prototype’都不需要考虑。因为涉及到复杂的继承关系时考虑这些底层内容,不利于分析。一般分析时使用下面的两个简化图分析即可。函数A() {

  }

  设a1=新A()

  设a2=新A()

  设a3=新A()

  //这几行代码将产生如下所示的原型链。

  

1.3 涉及继承的原型链图示

  涉及继承的原型链可以用简化图来分析。

  //使用寄生组合方式实现继承

  函数C() {}

  函数B() {}

  B.prototype=new C()

  函数A() {}

  a .原型=新B()

  设a1=新A()

  设a2=新A()

  设a3=新A()

  

1.4 原型链终点

  原型链的结尾为空,并且不引用原型对象。

  

1.5 原型的动态性

  原型的动态在《面向对象程序设计》中有详细讲解,主要涉及原型的改写和修改。这里有几个例子。例题1—原型的动态性

  var A=function(){ };

  a .原型. n=1;

  var b=new A();

  a .原型={

  n: 2,

  男:3

  }

  var c=new A();

  console . log(b . n);//1

  console . log(b . m);//未定义

  console . log(c . n);//2

  console . log(c . m);//3例题2—原型的动态性原型链底层链

  var F=function(){ };

  Object.prototype.a=function() {

  console . log( a );

  };

  Function.prototype.b=函数(){

  console . log( b );

  }

  var F=new F();

  f . a();//a

  f . b();//没有B属性。

  f . a();//a

  f . b();//b参考上述“不涉及继承的原型链图”中的第一张图,可以画出下面的简化参考图分析问题。

  例题3—原型动态性原型链底层链

  功能人(姓名){

  this.name=name

  }

  设p=新人( Tom );

  console . log(p . _ _ proto _ _)//person . prototype

  console.log(Person。_ _ proto _ _)//function . prototype例题4—原型动态性原型链底层链

  var foo={},F=function(){}

  object . prototype . a= value a ;

  Function.prototype.b=值b ;

  Object.prototype={

  答:“值a”

  }

  function . prototype=}

  b:“值b”

  }

  console . log(foo . a);//值a

  console . log(foo . b);//未定义

  console . log(f . a);//值a

  console . log(f . b);//值b参考上面提到的“不涉及继承的原型链图”中的第一张图,可以画出下面的简化参考图分析问题。由于foo和F声明时它们就将自己的原型进行绑定,它们通过栈内存中存储的指针获取堆内存中存储的原型的地址。首先进行了原型的修改操作,修改操作会在堆内存上修改原型,foo和F通过栈内存的指针仍然可以访问到修改后的结果。第二步进行了原型的重写,JS都是“传值操作”,重写原型后,首先在堆内存中开辟一块新空间存储新的原型,然后在栈内存重新开辟一个空间存储指向堆内存的指针。此时由于foo和F持有的栈内存指针和新的栈内存指针不同,所以foo和F无法访问到重写后的原型。

  推荐:javascript学习教程以上是图文并茂的JavaScript原型链详细内容。更多请关注我们的其他相关文章!

郑重声明:本文由网友发布,不代表盛行IT的观点,版权归原作者所有,仅为传播更多信息之目的,如有侵权请联系,我们将第一时间修改或删除,多谢。

留言与评论(共有 条评论)
   
验证码: