Javascript类继承浅析

Jochen 发布于2019-08-21 12:32 / 2021人阅读

摘要：推荐高级程序设计，对类继承有详细介绍。书中涉及继承方式多达数种，意味着继承的灵活性。假设类和类不同公司有不同的公司信息，而同一公司内的员工则需要继承相同的公司信息。组合继承组合继承可以认为是以上两种组合实现。

前言

高级语言基本上都有类的概念，而javascript因为各种原因相对比较特别，并没有明确的class类声明方式（ES6暂不涉及），而是通过构造函数变相实现。推荐《javascript高级程序设计》，对类继承有详细介绍。书中涉及继承方式多达数种，意味着继承的灵活性。但灵活性，有时也意味着复杂性。总结来说，继承方案本文介绍两种即可覆盖大部分场景。

关于原型链

关于原型链，花了很久才搞明白。javascript的世界，可以认为变量皆对象。当声明一个普通变量，即可调用多种方法。

love = ["one", "two", "three"]
["one", "two", "three"]
love.slice(1,2)
["two"]
Object.keys(love)
["0", "1", "2"]

这里声明一个数组，即可调用slice方法。既然未手工定义slice方法，为么能够使用，就需要需要提到原型继承。

对象可访问变量由两部分构成，属性和原型对象。属性优先级高于原型对象，如上所述，love数组的属性为"0", "1", "2"，当调用slice方法时，会先在属性里面寻找slice键对应的值，此例中显然不存在。未找到，则到原型对象中寻找。love变量的原型对象即为Array.prototype，键命中，所以不会undefined。注意的一点，原型对象也是对象，即原型对象可能也存在原型对象，在原型对象中匹配键时，也遵循先属性，后原型的法则。这样的匹配方式就实现了原型链。

属性继承

某些场合中，不同类具备相同的属性，而没有需要共享的原型。举例来说，基于Person类实现Female类。假设Person属性为name,age；而Female类也需要有name,age属性，但是多个sex属性，既可以如下实现：

function Person(name, age) {
    this.name = name;
    this.age = age;
};

function Female(name, age) {
    this.name = name;
    this.age = age;
    this.sex = "female";
};

function Female(name, age) {
    Person.call(this, name, age);
    this.sex = "female";
};

两种Female具备共有的属性定义，主要功能是为了省代码。从一定意义上来说，Female, Person处于同一层级，并不符合继承字面义。

原型继承

某些场合中，子类与超类需要共享信息，就需要原型继承出场。假设organization类和employee类,不同公司有不同的公司信息，而同一公司内的员工则需要继承相同的公司信息。

function Organization(boss, belief) {
    this.boss = boss;
    this.belief = belief;
};

function Employee(name, age) {
    this.name = name;
    this.age = age;
};

让不同的员工共享相同的公司信息可以如下实现：

// first solution
Employee.prototype = new Organization("bruce wayen", "make business easy");
Employee.prototype.constructor = Employee;

// second solution
Employee.prototype.boss = "bruce wayen";
Employee.prototype.belief = "make business easy";

值得注意的点在于，如果Organization不是某一超类的子类的话，两种方式没有任何差异。两种prototype具备相同的三个属性，且__proto__指针都指向Function.prototype。

如果Organization是Group的子类，那么第一种方式，

function Group() {
    this.label = "Group";
};

function Organization(boss, belief) {
    this.boss = boss;
    this.belief = belief;
};

Organization.prototype = new Group();
Organization.prototype.constructor = Organization;

function Employee(name) {
    this.name = name;
};

Employee.prototype = new Organization("bruce wayen", "make business easy");
Employee.prototype.constructor = Employee;

Employee同时具备访问Group内部变量的能力，此时原型对象__proto__指针指向Group.prototype。那么所有的employee.label即为Group。

从一定意义上来说，这种处理方式，Employee比Organization更高一级，可访问变量出自身属性外，还包含Organization可访问的所有键值，比较符合继承的字面意。

组合继承

组合继承可以认为是以上两种组合实现。组合继承从一定程度上来说，就是类之间的深拷贝，两者具有完全相同的原型对象，也存在一些共有的属性，依旧拿Person, Female举例：

function Person(name, age) {
    this.name = name;
    this.age = age;
};

function Female(name, age) {
    Person.call(this, name, age);
    this.sex = "female";
};

Female.prototype = Person.prototype;
Female.prototype.constructor = Female;

如果你使用Nodejs的话，会不会觉得Female的定义有点熟悉，看下面代码：

var Orchestrator = require("orchestrator");

function Gulp() {
  Orchestrator.call(this);
}
util.inherits(Gulp, Orchestrator);

上面继承属性，下面继承原型。

总结

记录比较零散，如有机会，阅读《javascript高级程序设计》可以收获更多，暂且记录到这里。

云服务器 GPU云服务器继承类类继承类继承问题继承Thread类

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/87647.html

JavaScript系列--浅析原型链与继承

摘要：综上所述有原型链继承，构造函数继承经典继承，组合继承，寄生继承，寄生组合继承五种方法，寄生组合式继承，集寄生式继承和组合继承的优点于一身是实现基于类型继承的最有效方法。一、前言继承是面向对象（OOP）语言中的一个最为人津津乐道的概念。许多面对对象（OOP）语言都支持两种继承方式:：接口继承和实现继承。接口继承只继承方法签名,而实现继承则继承实际的方法。由于js中方法没有签名...

draveness 2019-08-23 18:06 评论0 收藏0
浅析ES6新特性 —— Class

摘要：如下示例构造函数实例化对象新特性使用类实例化对象引入了类这一概念，可以通过关键字，定义类。否则报错，这是类和构造函数的一个主要区别。其实，的类，可以看作是构造函数的另外一种写法。前言类语法是ES6中新增的一个亮点特性，下文简单对类的使用进行简要说明（仅作为个人层面的理解） js传统模式实例化对象方法——prototype 在JavaScript中，实例化一个对象的传统使用方法是通过...

LiveVideoStack 2019-08-22 15:21 评论0 收藏0
浅析Node与Element

摘要：坑当然，也有可能会遇到踩坑的现象。与的关系至于与的关系，从继承方面讲可能为清晰很多。总结是节点，其中包含不同类型的节点，只是节点的一种。继承与，可以调用的方法。起因起因有二：在看winter老师的分享：《一个前端的自我修养》时，有注意到这么一幅图，里面有写childNode和children属性。showImg(https://segmentfault.com/img/remo...

U2FsdGVkX1x 2019-08-01 17:03 评论0 收藏0
LinkedList源码浅析

摘要：重要方法在链尾添加元素除了这个方法以外，还提供了等一些方法，都是为实现和方法服务的，因为双向链表的原因，这些实现都很简单。类声明 LinkedList类声明如下： public class LinkedList extends AbstractSequentialList implements List, Deque, Cloneable, java.io.Seria...

DC_er 2019-08-14 12:25 评论0 收藏0