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. Maven系列学习(二)Maven使用入门

    Maven使用入门 通过上一节的学习,我们已经了解和配置好了Maven,接下来需要编写代码了 1.POM(Project Object Model,项目对象模型) 和Make的Makefile类似,M ...

  2. HttpUrlConnection工具类

    package com.ligotop.core.utils; import com.ligotop.core.exceptions.BusinessException; import java.io ...

  3. Newtonsoft.Json 转Json字符串为空不序列化

    原文:Newtonsoft.Json 转Json字符串为空不序列化 版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 本文链接:https://bl ...

  4. 攻防世界--getit

    测试文件:https://adworld.xctf.org.cn/media/task/attachments/8ef2f7ef55c240418f84b3c514a7a28a 准备 得知 64位文件 ...

  5. CSS-06 外部JS,CSS文件的寻址问题

    如果js.css外部文件有使用到相对路径,其相对路径的基准是不一样的 当一个index.html中引入外部的JS和CSS文件时: 在index.css文件中,相对路径的写法是以css文件相对于img图 ...

  6. 【记录】使用Navicat将表设计导出数据库设计文档

    INFORMATION_SCHEMA. Tables -- 表信息 INFORMATION_SCHEMA. COLUMNS -- 列信息 参考文章地址:https://blog.csdn.net/cx ...

  7. 330-支持PXIE带FMC接口的Xilinx FPGA XC7K325T PCIeX8 接口卡平台

    支持PXIE带FMC接口的Xilinx FPGA XC7K325T PCIeX8 接口卡平台 一.板卡概述     本板卡基于Xilinx公司的FPGAXC7K325T-2FFG900 芯片,pin_ ...

  8. DB count check for TABLES VIEWS PROCEDURES TRIGGERS

    SELECT DISTINCT(TABLESPACE_NAME) FROM ALL_TABLES; SELECT COUNT(*) FROM ALL_TABLES where TABLESPACE_N ...

  9. Sass函数:数学函数-abs函数

    abs( ) 函数会返回一个数的绝对值. >> abs(10) 10 >> abs(-10) 10 >> abs(-10px) 10px >> abs( ...

  10. Sass-@for

    在制作网格系统的时候,大家应该对 .col1~.col12 这样的印象较深.在 CSS 中你需要一个一个去书写,但在 Sass 中,可以使用 @for 循环来完成.在 Sass 的 @for 循环中有 ...