ES5 中的面向对象编程前传 之 深刻理解原型链(prototype)

来源:互联网 发布:热设计软件 编辑:程序博客网 时间:2024/05/01 11:21

JavaScript 中的原型链是非常关键的概念,理解它是掌握整个 JavaScript 体系结构的关键,原型链不仅用于定义对象的公用方法,还用于实现继承体系。JavaScript 中的面向对象涉及的各种名字非常容易使人混淆,请记住一点,C++ 中类和对象的概念,对应于 JavaScript 中的对象和对象实例,这可能有点难以理解,暂时先记住吧。

原型与原型链


原型是一个对象,维持着对象的所有实例的公用方法,原型链自不必说,就是各级对象包含的原型构成的链,每个对象都有一个特殊的属性:__proto__,它是一个指针,指向父对象的原型(prototype),父对象还是有这个属性,指向父对象的父对象,就这样,一直延伸到处于金字塔顶端的 Object,而 Object 也是对象,它指向了 null。

new 干了些什么


new 关键字用于创建对象实例,使用 function 关键字实现自定义函数,使用 new 关键字调用函数,执行结果返回一个对象实例。new 做这件事的过程如下,前两部维持继承体系,最后一步将 this 变量赋值给新对象,那么 this 所引用的属性和函数都传递给了新对象:

  1. 建立空对象;
  2. 对象 _proto_ 属性指向函数的 prototype;
  3. 在对象上调用函数。

结合例子:

function Human (name, age) {    this.name = name;    this.age = age;    this.getName = function () {        return this.name;    }}var tom = new Human('tom', 25);

以上的对象实例创建过程如下:

  1. var tom = {};
  2. tom._proto_ = Human.prototype;
  3. Human.call(tom);

JS 内置原型链继承体系


注: 这里讲的是原型链的继承关系,并不是说 Function 是 Object 的下一级,只是在原型链方面这么说。Function 和 Object,以及其他 JavaScript 内置对象之间的关系,请看上一篇文章:ES5的面向对象编程实现 http://blog.csdn.net/qingyafan/article/details/52276792

对象实例是特定函数 new 的结果 ,特定函数继承于 Function 对象, Function 对象继承于 Object,Object 继承于 null,是的你没有看错!因为 null 也是对象,可以通过 typeof null 测试。这个继承体系是由原型链维持的,每个对象都有一个 __proto__注意两头都是双下划线)属性指向父对象,最顶端的 Object 的 __proto__ 指向 null。图:

js内置继承体系

总结


你懂了原型链了吗?原型链就是对象的 __proto__ 指针属性连接的对象继承链。既然 JavaScript 本身可以这么做,那为什么我们不可以这样做呢?我们也可以利用这种模式实现继承,但是这种继承只能继承父对象 prototype 中的属性和方法,由各个实例共享,那你是不是突然想起我们上一篇文章讲的函数构造作用域?结合文章中 new 操作符的作用及其执行过程,我们可以使用“构造函数”实现对象中属性和方法的继承,结合这两种方法,就是我们在 JavaScript 中面向对象编程的常用模式!!

下次再讲定义类和继承 ??!!

1 0
原创粉丝点击