系列文章导航：

JavaScript学习笔记一——数据类型

JavaScript学习笔记二——函数

JavaScript学习笔记三——作用域

JavaScript学习笔记四——Eval函数

JavaScript学习笔记五——类和对象

JavaScript学习笔记六：prototype的提出

Javascript学习笔记七——原型链的原理

Javascript学习笔记八——用JSON做原型

Javascript学习笔记九——prototype封装继承

Javascript学习笔记十——网页运行原理

Javascript学习笔记十一——包装DOM对象

Javascript学习笔记十三——关于响应事件

Javascript学习笔记十二——Ajax入门

在上文中，我利用prototype的原理做了一个封装的New，然后我就想到，我是否可以用prototype的原理进一步封装面向对象的一些基本特征呢？比如继承。

好，那就让我们一步步打造，首先让我们来看下继承原本的写法：

    <script>        var Person = function(name, age) {            this.name = name;            this.age = age;        }        Person.prototype.SayHello = function () {            alert(this.name + "," + this.age);        };        var Programmer = function (name, age, salary) {            Person.call(this, name, age);            this.salary = salary;        };        Programmer.prototype = new Person();        var pro = new Programmer("kym", 21, 500);        pro.SayHello();    script>

我们看到，在实际上，继承的根本就在于这一步Programmer.prototype=new Person()。也就是说把Person加到原型链上。这一点在Javascript学习笔记7——原型链的原理 已经有过比较详尽的解释。

那也就是说，我们实现的关键就在于原型链的打造。

在上文中，我们用JSON来打造了一个原型，其原型链是p.__proto__=Person。那么我们希望在这个上封装继承，那么原型链应该是p.__proto__.__proto__=SuperClass，也就是说Person.__proto__=SuperClass。但是按照我们上面代码的继承方法，原型链关系是Person.__proto__=SuperClass.prototype。

这个和我们在上文中一样，我们的办法就是借助一个辅助函数，将原来的函数内的属性赋给X，然后令X.prototype=SuperClass即可，也就是说我们将子原型进行一个封装。

好，就按照这个思路，我们来实现利用原型链的继承关系的封装。

    <script>        var Factory = {            Create: function (className, params) {                var temp = function () {                    className.Create.apply(this, params);                };                temp.prototype = className;                var result = new temp();                return result;            },            CreateBaseClass: function (baseClass, subClass) {                var temp = function () {                    for (var member in subClass) {                        this[member] = subClass[member];                    }                };                temp.prototype = baseClass;                return new temp();            }        };        var People = {            Create: function (name, age) {                this.name = name;                this.age = age;            },            SayHello: function () {                alert("Hello,My name is " + this.name + ".I am " + this.age);            }        };        var Temp = {            Create: function (name, age, salary) {                People.Create.call(this, name, age);                this.salary = salary;            },            Introduce: function () {                alert(this.name + "$" + this.age + "$" + this.salary);            }        };        var Programmer = Factory.CreateBaseClass(People, Temp);        var pro = Factory.Create(Programmer, ["kym", 21, 500]);        pro.SayHello();    script>

这样就完成了我们对继承关系的封装。当然，我们也可以不单独写一个变量：

var Programmer = Factory.CreateBaseClass(People, {    Create: function (name, age, salary) {        People.Create.call(this, name, age);        this.salary = salary;    },    Introduce: function () {        alert(this.name + "$" + this.age + "$" + this.salary);    }});

当然，这全凭个人爱好了，个人认为第一种办法相对更清晰一些，但是第二种办法则更优雅。

it知识库：Javascript学习笔记九——prototype封装继承，转载需保留来源！

郑重声明：本文版权归原作者所有，转载文章仅为传播更多信息之目的，如作者信息标记有误，请第一时间联系我们修改或删除，多谢。