JS继承 实现方式
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继承 实现方式的更多相关文章
- js继承的方式及其优缺点
js继承方法 前因:ECMAScript不支持接口继承,只支持实现继承 一.原型链 概念:每个构造函数都有一个原型对象,原型对象都包含一个指向构造函数的指针,而实例都包含一个指向原型对象的内部指针,让 ...
- js继承的方式
深入理解继承的实现方式不仅仅有利于自己去造轮子,封装插件,更有利于我们去阅读一些框架的源码, 以下记录几种常见的继承方式 1. 原型链实现继承 function Father(){ this.name ...
- js 继承的方式
//定义object的继承方法 Object.extend = function(destination, source) { for(property in source) { destinatio ...
- js面向对象编程(第2版)——js继承多种方式
附带书籍地址: js面向对象编程(第2版)
- JS继承的原理、方式和应用
概要: 一.继承的原理 二.继承的几种方式 三.继承的应用场景 什么是继承? 继承:子类可以使用父类的所有功能,并且对这些功能进行扩展.继承的过程,就是从一般到特殊的过程.要了解JS继承必须首先要了解 ...
- JS类继承常用方式发展史
JS类继承常用方式发展史 涉及知识点 构造函数方式继承 1-继承单个对象 1.1 多步走初始版 1.2 多步走优化版 1.3 Object.create()方式 2-继承多个对象 2.1 遍历 Obj ...
- JS继承以及继承的几种实现方式总结
传统面向对象语言:继承是类与类之间的关系. 而在js中由于es6之前没有类的概念,所以继承是对象与对象之间的关系. 在js中,继承就是指使一个对象有权去访问另一个对象的能力. 比如:比如对象a能够访问 ...
- js 继承的几种方式
JS继承的实现方式: 既然要实现继承,那么首先我们得有一个父类,代码如下: function Animal(name) { // 属性 this.name = name || '小白'; // 实例方 ...
- js对象的几种创建方式和js实现继承的方式[转]
一.js对象的创建方式 1. 使用Object构造函数来创建一个对象,下面代码创建了一个person对象,并用两种方式打印出了Name的属性值. var person = new Object(); ...
随机推荐
- HDU 1269 迷宫城堡 (Kosaraju)
题目链接:HDU 1269 Problem Description 为了训练小希的方向感,Gardon建立了一座大城堡,里面有N个房间(N<=10000)和M条通道(M<=100000), ...
- LeetCode 129. Sum Root to Leaf Numbers 动态演示
树的数值为[0, 9], 每一条从根到叶子的路径都构成一个整数,(根的数字为首位),求所有构成的所有整数的和 深度优先搜索,通过一个参数累加整数 class Solution { public: vo ...
- [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 ...
- word中迅速将表格一分为二 拆分表格快捷键ctrl+shift+enter 重复上一个命令快捷键f4
这里说的是将一个表格拆分为两个表格 选择要拆分的行,快捷键ctrl+shift+enter,就拆分为两个表格了,是不是很快! 在多个表格需要拆分的时候,做一次这样的操作,然后不停的移动.F4,就可以了 ...
- Codeforces 1110E (差分)
题面 传送门 分析 一开始考虑贪心和DP,发现不行 考虑差分: 设d[i]=c[i+1]-c[i] (i<n) 那么一次操作会如何影响差分数组呢? \(c[i]'=c[i+1]+c[i-1]-c ...
- python中bytes和str
1.python中bytes和str Python3 最重要的新特性大概要算是对文本(text)和二进制数据(binary data)作了更为清晰的区分 (1)Python 3.0使用文本和(二进制) ...
- SQL server 连接 查询
在sql server中,我们经常能用到连接,今天总结一下连接的基础知识.连接的分类: 交叉连接CROSS JOIN 内连接INNER JOIN 外连接{左外连接LEFT [OUTER] JOIN : ...
- shell 脚本规范
shell 脚本规范 一.背景 1.使用哪一种shell? 必须使用bash shell 2.什么时候使用shell? 数量相对较少的操作 脚本文件少于100行 3.脚本文件扩展名是什么? shell ...
- vue简单的v-for - - 路由跳转
前几天写了一个特特特简单的小图片页面,主要用到的就是v-for遍历以及路由跳转到详情页.路由跳转需要在router文件夹下index.js引入. 导航栏(element ui导航栏为模板): < ...
- 本机ip地址怎么查
转自:https://www.192ly.com/basic/local-ip-address-lookup-method.html 百度搜索一下[IP],你就可以轻松看到你的IP地址了,百度出来的 ...