JS解惑--原型与原型链

来源:互联网 发布:广告法淘宝处罚案例 编辑:程序博客网 时间:2024/05/21 15:42

首先,我们需要明确一些概念


  • JavaScript 中,一切都可视为对象,但对象也是有区别的。分为普通对象和函数对象,Object ,Function 是JS自带的函数对象。
  • 原型对象: 在JavaScript 中,每当定义一个对象(函数)时候,对象中都会包含一些预定义的属性。其中函数对象的一个属性就是原型对象 prototype。
  • 注:普通对象没有prototype,但有proto属性。
  • JS在创建对象(不论是普通对象还是函数对象)的时候,都有一个叫做proto的内置属性,用于指向创建它的函数对象的原型对象prototype。
  • 原型链: JS在创建对象(不论是普通对象还是函数对象)的时候,都有一个叫做proto的内置属性,用于指向创建它的函数对象的原型对象prototype。

有了上面概念的基础,接下来我们由代码对概念加以理解

<script type="text/javascript">      function Person(){      }      Person.prototype.name = "Nicholas";      Person.prototype.age = 29;      Person.prototype.job = "Software Enginner";        Person.prototype.sayName = function(){            alert(this.name);        };        var person1 = new Person();        person1.sayName();        var person2 = new Person();        person2.sayName();        alert(person1.sayName == person2.sayName);  </script>

这里写图片描述

由上图,我们可以得出:对于对象的构造函数来说,它有一个prototype属性指向原型对象,原型对象有一个constructor属性指向构造函数;对原型对象我们可以任意添加属性和方法;对于对象的实例而言它有一个proto的内部属性它指向原型对象,从而原型对象的属性和方法都被实例对象所继承。


注:当我们为实例添加属性值的时候,实际上如果我们添加的属性与原型对象的属性相同时,我们添加的那个属性会屏蔽原型对象中的属性;如果我们为实例添加的属性与原型对象不相同,它只会给实例添加属性对应的值,


这里写图片描述

当我们需要查找属性或者方法时候,js解析器会先到实例中去找,如果有的话就返回实例中属性或者方法;如果没有就继续往沿着原型链往原型对象中找,找到就返回,如果再没找到就继续沿着原型链往上搜索,直到Object对象的原型。如下图

这里写图片描述


看了以上文章,相信大家对原型与原型链有了进一步的了解。

0 0