JavaScript类继承
- 和其他功能一样,ECMAScript 实现继承的方式不止一种。这是因为 JavaScript 中的继承机制并不是明确规定的,而是通过模仿实现的。这意味着所有的继承细节并非完全由解释程序处理。作为开发者,你有权决定最适用的继承方式。
- 创建的子类将继承超类的所有属性和方法,包括构造函数及方法的实现。记住,所有属性和方法都是公用的,因此子类可直接访问这些方法。子类还可添加超类中没有的新属性和方法,也可以覆盖超类的属性和方法。
- 继承的方式:
- 对象冒充方式方式一
/*被继承类*/
function Animal_1(name) {
this.name = name;
this.printName = function () {
console.log(this.name);
}
}
function Person_1(name,age) {
this.method1 = Animal_1;
this.method1(name);
this.age = age;
this.printAge = function () {
console.log(this.age);
}
}
var o1 = new Person_1("ysw",18);
var o2 = new Animal_1("ysw");
console.log(o1);
console.log(o2);
console.log(o1 instanceof Animal_1);
console.log(o1 instanceof Person_1);
console.log(o2 instanceof Animal_1);
console.log(o2 instanceof Person_1);
- 对象冒充方式方式二:利用call方法和apply方法
function Animal_2(name) {
this.name = name;
this.printName = function () {
console.log(this.name);
}
}
function Person_2(name,age) {
Animal_2.call(this,name);
// Animal_2.apply(this,new Array(name));
this.age = age;
this.printAge = function () {
console.log(this.age);
}
}
o1 = new Person_2("ysw",18);
o2 = new Animal_2("ysw");
console.log(o1);
console.log(o2);
console.log(o1 instanceof Animal_2);
console.log(o1 instanceof Person_2);
console.log(o2 instanceof Animal_2);
console.log(o2 instanceof Person_2);
- 原型链方式
/*被继承类*/
function Animal_3() {
}
Animal_3.prototype.name = "ysw";
Animal_3.prototype.printName = function () {
console.log(this.name);
};
function Person_3() {
}
Person_3.prototype = new Animal_3();
Person_3.prototype.age = 18;
Person_3.prototype.printAge = function () {
console.log(this.age);
};
o1 = new Person_3();
o2 = new Animal_3();
console.log(o1);
console.log(o2);
console.log(o1 instanceof Animal_3);
console.log(o1 instanceof Person_3);
console.log(o2 instanceof Animal_3);
console.log(o2 instanceof Person_3);
- 混合方式
/*被继承类*/
function Animal_4(name) {
this.name = name;
}
Animal_4.prototype.printName = function () {
console.log(this.name);
};
function Person_4(name,age) {
Animal_4.call(this,name);
this.age = age;
}
Person_4.prototype = new Animal_4();
Person_4.prototype.printAge = function () {
console.log(this.age);
};
o1 = new Person_4("晏沈威",22);
o2 = new Animal_4("晏沈威");
console.log(o1);
console.log(o2);
console.log(o1 instanceof Animal_4);
console.log(o1 instanceof Person_4);
console.log(o2 instanceof Animal_4);
console.log(o2 instanceof Person_4);
- ES6语法 class extends继承
/*被继承类*/
class Animal_5 {
constructor(name){
this.name = name;
}
printName(){
console.log(this.name);
}
}
class Person_5 extends Animal_5{
constructor(name,age){
super(name);
this.age = age;
}
printAge() {
console.log(this.age);
};
}
o1 = new Person_5("晏沈威",22);
o2 = new Animal_5("晏沈威");
console.log(o1);
console.log(o2);
console.log(o1 instanceof Animal_5);
console.log(o1 instanceof Person_5);
console.log(o2 instanceof Animal_5);
console.log(o2 instanceof Person_5);
JavaScript类继承的更多相关文章
- JavaScript类继承, 用什么方法好
JavaScript类继承, 用什么方法好 一个实例: 基类Car: function Car(color, year) { this.name = "car"; this.col ...
- Javascript类继承-机制-代码Demo【原创】
最近看到<Javascript设计模式>,对js模拟的”继承方式“有了更深一步的了解,虽然之前也总是用到prototype.new ,但只是知其然不知所以然,现在将类继承的方法整理如下,暂 ...
- javascript类继承的一些实验
其实一开始编js没怎么用过对象,一般都用func,func,func···但是用多了,感觉代码一点都不美观,还要这里包一个函数,那里包一个函数,或者一直都是函数调用,不好看,而且一些重用的都要重写的话 ...
- Javascript 类继承
Js继承 JavaScript并不是真正面向对象的语言,是基于对象的,没有类的概念. 要想实现继承,可以用js的原型prototype机制或者用apply和call方法去实现 /** 声明一个基础父类 ...
- javascript类继承系列五(其他方式继承)
除了前面学习的三种继承外,还有另外三种:原型继承寄生继承,寄生组合继承都是以: function object(o) { function F() { } F.prototype = o; retur ...
- javascript类继承系列二(原型链)
原型链是采用最主要的继承方式,原理:每一个类(构造器,js中的function)都有一个原型属性(prototype)指向一个原型对象,原型对象有一个构造器(constructor),它又指回到fun ...
- javascript类继承系列四(组合继承)
原理: 结合了原型链和对象伪装各自优点的方式,基本思路是:使用原型链继承原型上的属性和方法,使用对象伪装继承实例属性,通过定义原型方法,允许函数复用,并运行每个实例拥有自己的属性 function B ...
- javascript类继承系列三(对象伪装)
原理:在子类的构造器上调用超类构造器(父类构造器中的this指向子类实例),js提供了apply()和call()函数,可以实现这种调用 function baseClass() { this.col ...
- javascript类继承系列一
js中没有提供类(class,抽象类,接口等高级的抽象),可以用new,但new的function的对象,构造器 但在js中可以通过function来模拟类的一些特性function fun_name ...
随机推荐
- Android studio提速配置
1. C:\Program Files\Android\Android Studio\bin studio64.exe.vmoptions 2.创建 gradle.properties 配置文件
- 安装Intellij IDEA(ideaIU-2017.2.3)并完成Intellij IDEA的简单配置
一.Intellij IDEA的简介 Intellij IDEA是java语言的集成开发环境,与Eclipse相比,它的功能更多.更强大.更智能,Eclipse更适合刚学习java语言的初学者,它操作 ...
- unbuntu14.04下的串口软件monicom的使用
上篇文章写到了将esp-idf中的examples里的helloworld烧写进了esp32的flash里面,本文就讲讲这个例子的测试和一个项目工程的建立. 首先为了得到esp32输出的信息,需要一个 ...
- Itween的代码使用方法 - 01
BB:Itween是真心不好用! - 透明度动画 void Start () { //键值对儿的形式保存iTween所用到的参数 Hashtable args = new Hashtable(); / ...
- 文件描述符fd、文件指针fp和vfork()
1. fd:在形式上是一个非负整数.实际上他是一个索引值.指向kernal为每一个进程所维护的该进程打开文件的记录表. 当程序打开一个文件或者创建一个新文件的时候kernal向进程返回一个文件描述符. ...
- [算法专题] 深度优先搜索&回溯剪枝
1. Palindrome Partitioning https://leetcode.com/problems/palindrome-partitioning/ Given a string s, ...
- unicode 编解码记录
unicode 万国码.世界上所有的符号都有对应的Unicode code point.一般是2个字节. 这个字节可以通过任意中方式编码为二进制,例如用来保存到文件.一般通过UTF-x(例如utf-8 ...
- ReactNative学习笔记(六)集成视频播放
概述 视频播放可以自己写原生代码实现,然后注入JS.如果对视频播放没有特殊要求的话,可以直接使用现成插件. 到官方推荐的插件网站搜索找到下载量第一的插件:react-native-video. 安装 ...
- spring 原理1:java 模拟springIOC容器
本篇博客主要是使用java代码模拟spring的IOC容器,实现依赖注入:当然只是模拟spring容器中简单的一点实现原理而已,加深一些自己对spring框架的底层原理的理解: 使用的技术:dom4j ...
- Linux - history命令的常用方法
history命令 打印所有命令记录:history 打印最近10条记录:history 10 执行第123条命令记录:!123 重复执行上一条命令:!! 执行最后一次以ls开头的命令:!ls 逐屏列 ...