对象原型

1、对象:属性和方法的集合,即变量和函数的封装。每个对象都有一个_proto_属性,指向这个对象的构造函数的原型对象。

2、构造器函数:用于创建对象的函数,通过new关键字生成对象。函数名一般首字母大写的,有一个prototype属性指向原型函数

3、原型对象:每个原型函数都有一个construetor属性,它是一个指向构造函数的指针(原型对象在定义函数时同时被创建)

原型对象.png

1.从上面的代码中可以看到,创建stu对象虽然使用的是students构造函数,但是对象创建出来之后,这个stu对象其实已经与students构造函数没有任何关系了,stu对象的proto属性指向的是students构造函数的原型对象。

  1. 如果使用new students()创建多个对象stu1、stu2、stu3,则多个对象都会同时指向students构造函数的原型对象。

3.我们可以手动给这个原型对象添加属性和方法,那么stu1,stu2,stu3…这些对象就会共享这些在原型中添加的属性和方法。

4.如果我们访问stu中的一个属性name,如果在stu对象中找到,则直接返回。如果stu对象中没有找到,则直接去stu对象的proto属性指向的原型对象中查找,如果查找到则返回。(如果原型中也没有找到,则继续向上找原型的原型—原型链)。

5.如果通过stu对象添加了一个属性name,则stu对象来说就屏蔽了原型中的属性name。 换句话说:在stu中就没有办法访问到原型的属性name了。

6.通过stu对象只能读取原型中的属性name的值,而不能修改原型中的属性name的值。 stu.name = “李四”; 并不是修改了原型中的值,而是在stu对象中给添加了一个属性name。

请看下面代码(在上面提到的文章中做了小幅度修改,更有助于理解)

<body>
   <script type="text/javascript">
       function students () {        
       }
       // 可以使用students.prototype 直接访问到原型对象
       //给students函数的原型对象中添加一个属性 name并且值是 "张三"
       students.prototype.name = "张三";
       students.prototype.age = 20;

       var stu = new students();
       /*
           访问stu对象的属性name,虽然在stu对象中我们并没有明确的添加属性name,但是
           stu的__proto__属性指向的原型中有name属性,所以这个地方可以访问到属性name
           就值。
           注意:这个时候不能通过stu对象删除name属性,因为只能删除在stu中删除的对象。
       */
       alert(stu.name);  // 张三

       var stu1 = new students();
       alert(stu1.name);  // 张三  都是从原型中找到的,所以一样。

       alert(stu.name === stu1.name);  // true

       // 由于不能修改原型中的值,则这种方法就直接在stu中添加了一个新的属性name,然后在stu中无法再访问到
       //原型中的属性。
       stu.name = "李四";
       alert(stu.name); //李四
       // 由于stu1中没有name属性,则对stu1来说仍然是访问的原型中的属性。    
       alert(stu1.name);  // 张三  
   </script>
</body>
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容