JS中继承方式的实现有多种方法,下面是比较推荐的方法,其它继承方式可做了解:

function object(o) {
function F() {}
F.prototype = o;
return new F();
} function inheritPrototype(subType, superType) {
var newObj = object(superType.prototype);
newObj.constructor = subType;
subType.prototype = newObj;
} function People() {
this.cls = 'people';
} People.prototype.say = function(name) {
name = name || this.cls;
console.log('My class is '+ name);
} function Student() {
People.call(this);
this.type = 'student';
} inheritPrototype(Student, People); Student.prototype.goToSchool = function() {
console.log('I go to school every day.');
} // 测试
var stu = new Student(); console.log('class: ' + stu.cls); // class: people
console.log('type: ' + stu.type); // type: student
stu.say(); // My class is people
stu.goToSchool (); // I go to school every day.

其实,javascript 已经提供了更简单的实现方法,没必要在这造轮子,而且方法不完善,MDN 例子:

// Shape - 父类(superclass)
function Shape() {
this.x = 0;
this.y = 0;
} // 父类的方法
Shape.prototype.move = function(x, y) {
this.x += x;
this.y += y;
console.info('Shape moved.');
}; // Rectangle - 子类(subclass)
function Rectangle() {
Shape.call(this); // call super constructor.
} // 子类续承父类
Rectangle.prototype = Object.create(Shape.prototype);
Rectangle.prototype.constructor = Rectangle; var rect = new Rectangle(); console.log('Is rect an instance of Rectangle?',
rect instanceof Rectangle); // true
console.log('Is rect an instance of Shape?',
rect instanceof Shape); // true
rect.move(1, 1); // Outputs, 'Shape moved.'

如果你希望能继承到多个对象,则可以使用混入的方式:

function MyClass() {
SuperClass.call(this);
OtherSuperClass.call(this);
} // 继承一个类
MyClass.prototype = Object.create(SuperClass.prototype);
// 混合其它
Object.assign(MyClass.prototype, OtherSuperClass.prototype);
// 重新指定constructor
MyClass.prototype.constructor = MyClass; MyClass.prototype.myMethod = function() {
// do a thing
};

JS继承 实现方式的更多相关文章

  1. js继承的方式及其优缺点

    js继承方法 前因:ECMAScript不支持接口继承,只支持实现继承 一.原型链 概念:每个构造函数都有一个原型对象,原型对象都包含一个指向构造函数的指针,而实例都包含一个指向原型对象的内部指针,让 ...

  2. js继承的方式

    深入理解继承的实现方式不仅仅有利于自己去造轮子,封装插件,更有利于我们去阅读一些框架的源码, 以下记录几种常见的继承方式 1. 原型链实现继承 function Father(){ this.name ...

  3. js 继承的方式

    //定义object的继承方法 Object.extend = function(destination, source) { for(property in source) { destinatio ...

  4. js面向对象编程(第2版)——js继承多种方式

    附带书籍地址: js面向对象编程(第2版)

  5. JS继承的原理、方式和应用

    概要: 一.继承的原理 二.继承的几种方式 三.继承的应用场景 什么是继承? 继承:子类可以使用父类的所有功能,并且对这些功能进行扩展.继承的过程,就是从一般到特殊的过程.要了解JS继承必须首先要了解 ...

  6. JS类继承常用方式发展史

    JS类继承常用方式发展史 涉及知识点 构造函数方式继承 1-继承单个对象 1.1 多步走初始版 1.2 多步走优化版 1.3 Object.create()方式 2-继承多个对象 2.1 遍历 Obj ...

  7. JS继承以及继承的几种实现方式总结

    传统面向对象语言:继承是类与类之间的关系. 而在js中由于es6之前没有类的概念,所以继承是对象与对象之间的关系. 在js中,继承就是指使一个对象有权去访问另一个对象的能力. 比如:比如对象a能够访问 ...

  8. js 继承的几种方式

    JS继承的实现方式: 既然要实现继承,那么首先我们得有一个父类,代码如下: function Animal(name) { // 属性 this.name = name || '小白'; // 实例方 ...

  9. js对象的几种创建方式和js实现继承的方式[转]

    一.js对象的创建方式 1. 使用Object构造函数来创建一个对象,下面代码创建了一个person对象,并用两种方式打印出了Name的属性值. var person = new Object(); ...

随机推荐

  1. Content-Based Recommender System

    Content-Based Recommender System是基于产品(商品.网页)的内容.属性.关键字,以及目标用户的喜好.行为,这两部分数据来联合计算出,该为目标用户推荐其可能最感兴趣的产品. ...

  2. vmware内部错误

    今天不知道怎么回事 wmware workstation重启的时候总是报内部错误 差点重装了 幸亏找到了这个 原来只要以管理员的身份运行vwware就ok了 http://www.xiaoluobok ...

  3. securecrt(CRT)导入会话

    securecrt是个非常流行的远程管理维护工具,支持fssh.ssh2.telnet等多种协议,也支持中文.设备管理多了,自行手工添加也是很累的活.偷下懒,从别人那复制下文件,倒入到自己的secur ...

  4. Junit测试错误:### Error building SqlSession

    错误代码: org.apache.ibatis.exceptions.PersistenceException: ### Error building SqlSession.### The error ...

  5. 前端webpack & vue

    地址 : https://blog.csdn.net/jiang7701037

  6. BFS+打印路径

    题目是给你起点sx,和终点gx:牛在起点可以进行下面两个操作: 步行:John花一分钟由任意点X移动到点X-1或点X+1. 瞬移:John花一分钟由任意点X移动到点2*X. 你要输出最短步数及打印路径 ...

  7. C#设计模式:原型模式(Prototype Pattern)

    一,原型模式:通过将一个原型对象传给那个要发动创建的对象,这个要发动创建的对象通过请求原型对象拷贝它们自己来实施创建.(包含深度克隆和浅克隆) 主要面对的问题是:“某些结构复杂的对象”的创建工作:由于 ...

  8. javascript的继承模式

    在javascript里面看到javascript的继承模式和传统的继承模式是有区别的,就想查资料看一下到底有区别,就看到了这篇文章,觉得讲得还可以,暂时先放上来,以后有别的东西再补充: http:/ ...

  9. elasticsearch 基础 —— _mget取回多个文档及_bulk批量操作

    取回多个文档 Elasticsearch 的速度已经很快了,但甚至能更快. 将多个请求合并成一个,避免单独处理每个请求花费的网络延时和开销. 如果你需要从 Elasticsearch 检索很多文档,那 ...

  10. openstack stein部署手册 1. 准备

    # 控制节点与计算节点,分别指定静态解析 /etc/hosts 192.168.123.201 controller 192.168.123.202 compute01 # 控制节点与计算节点,分别安 ...