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. HDU 1269 迷宫城堡 (Kosaraju)

    题目链接:HDU 1269 Problem Description 为了训练小希的方向感,Gardon建立了一座大城堡,里面有N个房间(N<=10000)和M条通道(M<=100000), ...

  2. LeetCode 129. Sum Root to Leaf Numbers 动态演示

    树的数值为[0, 9], 每一条从根到叶子的路径都构成一个整数,(根的数字为首位),求所有构成的所有整数的和 深度优先搜索,通过一个参数累加整数 class Solution { public: vo ...

  3. [LeetCode] 4. Median of Two Sorted Arrays(想法题/求第k小的数)

    传送门 Description There are two sorted arrays nums1 and nums2 of size m and n respectively. Find the m ...

  4. word中迅速将表格一分为二 拆分表格快捷键ctrl+shift+enter 重复上一个命令快捷键f4

    这里说的是将一个表格拆分为两个表格 选择要拆分的行,快捷键ctrl+shift+enter,就拆分为两个表格了,是不是很快! 在多个表格需要拆分的时候,做一次这样的操作,然后不停的移动.F4,就可以了 ...

  5. Codeforces 1110E (差分)

    题面 传送门 分析 一开始考虑贪心和DP,发现不行 考虑差分: 设d[i]=c[i+1]-c[i] (i<n) 那么一次操作会如何影响差分数组呢? \(c[i]'=c[i+1]+c[i-1]-c ...

  6. python中bytes和str

    1.python中bytes和str Python3 最重要的新特性大概要算是对文本(text)和二进制数据(binary data)作了更为清晰的区分 (1)Python 3.0使用文本和(二进制) ...

  7. SQL server 连接 查询

    在sql server中,我们经常能用到连接,今天总结一下连接的基础知识.连接的分类: 交叉连接CROSS JOIN 内连接INNER JOIN 外连接{左外连接LEFT [OUTER] JOIN : ...

  8. shell 脚本规范

    shell 脚本规范 一.背景 1.使用哪一种shell? 必须使用bash shell 2.什么时候使用shell? 数量相对较少的操作 脚本文件少于100行 3.脚本文件扩展名是什么? shell ...

  9. vue简单的v-for - - 路由跳转

    前几天写了一个特特特简单的小图片页面,主要用到的就是v-for遍历以及路由跳转到详情页.路由跳转需要在router文件夹下index.js引入. 导航栏(element ui导航栏为模板): < ...

  10. 本机ip地址怎么查

     转自:https://www.192ly.com/basic/local-ip-address-lookup-method.html 百度搜索一下[IP],你就可以轻松看到你的IP地址了,百度出来的 ...