javascript 继承实现方法
1. [代码][JavaScript]代码
//1、对象冒充
//说明:构造函数使用this关键字给所有属性和方法赋值(即采用类声明的构造函数方式)。因为构造函数只是一个函数,所以可使ClassA的构造函数成为ClassB的方法,然后调用它。ClassB就会收到ClassA的构造函数中定义的属性和方法。
function ClassA(sColor) {
this.color = sColor;
this.showColor = function() {
alert(this.color);
};
}
function ClassB(sColor, sName) {
this.newMethod = ClassA;
this.newMethod(sColor);
delete this.newMethod;
this.name = sName;
this.showName = function() {
alert(this.name);
};
}
var oa = new ClassA("RED");
var ob = new ClassB("blue", "red");
oa.showColor();
// RED
ob.showColor();
// blue
ob.showName();
// red
2. [代码][JavaScript]代码
//2、call()方法
//说明:这是与经典的对象冒充方法最相似的方法。它的第一个参数用作this的对象。其他参数都都直接传递给函数自身。其实就相当于前一个是对象,后一个是普通的参数一样。
function showColor(sPrefix, sSuffix) {
alert(sPrefix + this.color + sSuffix);
};
var obj = new Object();
obj.color = "red";
// the color is red ,a very nice color indeed
showColor.call(obj, "the color is ", " ,a very nice color indeed");
function ClassA(sColor) {
this.color = sColor;
this.showColor = function() {
alert(this.color);
};
}
function ClassB(sColor, sName) {
ClassA.call(this, sColor);
this.name = sName;
this.showName = function() {
alert(this.name);
};
}
var ob = new ClassB("red", "ooo");
ob.showColor();
// red
ob.showName();
// ooo
3. [代码][JavaScript]代码
//3、apply()方法
//说明:有两个参数,用作this的对象和要传递给函数的参数的数组。
function showColor(sPrefix, sSuffix) {
alert(sPrefix + this.color + sSuffix);
};http://www.huiyi8.com/jiaoben/
var obj = new Object();
obj.color = "green";
// the color is green ,a very nice color indeed
showColor.apply(obj, new Array("the color is ", " ,a very nice color indeed"));
function ClassA(sColor) {
this.color = sColor;
this.showColor = function() {
alert(this.color);
};
}
function ClassB(sColor, sName) {
ClassA.apply(this, arguments);
this.name = sName;
this.showName = function() {
alert(this.name);
};
}
var ob = new ClassB("red", "ooo");
ob.showColor();
// red
ob.showName();
// ooo
4. [代码][JavaScript]代码
//4、原型链
// 说明:原型链扩展了类的原型定义方式。prototype对象是个模板,要实例化的对象都以这个模板为基础。prototype对象的任何属性和方法都被传递给那个类的所有实例。原型链利用这种功能来实现继承机制。原型链的弊端是不支持多重继承。记住,原型链会用另一种类型的对象重写类的prototype属性。因此子类的所有属性和方法必须出现在prototype属性被赋值以后。
// 原型链方式对应原型方式
function ClassA() {
}
ClassA.prototype.color = "red";
ClassA.prototype.showColor = function() {
alert(this.color);
};
function ClassB() {
}
ClassB.prototype = new ClassA();
ClassB.prototype.name = "redred";
ClassB.prototype.showName = function() {
alert(this.name);
};
var objA = new ClassA();
var objB = new ClassB();
objA.color = "blue";
objA.showColor();
// blue
objB.color = "green";
objB.name = "dodo";
objB.showColor();
// green
objB.showName();
// dodo
alert( objB instanceof ClassA);
// true
alert( objB instanceof ClassB);
// true
5. [代码][JavaScript]代码
//5、混合方式
//说明:与定义类时同样的方式,即利用构造函数方式定义属性,用原型方式定义方法。而在继承机制中,可以用对象冒充继承构造函数的属性,用原型链继承prototype对象的方法。
function ClassA(sColor) {
this.color = sColor;
}
ClassA.prototype.showColor = function() {
alert(this.color);
};
function ClassB(sColor, sName) {
ClassA.call(this, sColor);
this.name = sName;
}
ClassB.prototype = new ClassA();
ClassB.prototype.showName = function() {
alert(this.name);
};广告代码
var objA = new ClassA("BLUE");
objA.showColor();
// BLUE
var objB = new ClassB("red", "baba");
objB.showColor();
// red
objB.showName();
// baba
javascript 继承实现方法的更多相关文章
- 面向对象之继承-5种JavaScript继承的方法
今天我们讨论一下常用的几种继承方法:首先我们创建一个动物函数Animal: function Animal () { this.species = '动物' }再写准备名叫猫咪的函数Cat: func ...
- JS学习笔记——JavaScript继承的6种方法(原型链、借用构造函数、组合、原型式、寄生式、寄生组合式)
JavaScript继承的6种方法 1,原型链继承 2,借用构造函数继承 3,组合继承(原型+借用构造) 4,原型式继承 5,寄生式继承 6,寄生组合式继承 1.原型链继承. <script t ...
- JavaScript 继承——三种继承方法及其优劣
原文地址 本文内容 目的 继承的第一步--最简单的继承 私有变量/成员和原型 三种继承方式及其优劣 基本的原型继承 Yahoo JavaScript 模块模式 创建闭包的构造函数 三种方法的代码执 ...
- Javascript中,实现类与继承的方法和优缺点分析
Javascript是一种弱类型语言,不存在类的概念,但在js中可以模仿类似于JAVA中的类,实现类与继承 第一种方法:利用Javascript中的原型链 //首先定义一个父类 function An ...
- 作为前端,你需要懂得javascript实现继承的方法
在ES6之前,javascript不跟其他语言一样,有直接继承的方法,它需要借助于构造函数+原型对象模拟实现继承.现在我们可以利用ES6的extends方法实现继承,如果想了解更多有关ES6实现的继承 ...
- javascript继承的三种模式
javascript继承一般有三种模式:组合继承,原型式继承和寄生式继承: 1组合继承:javascript最为广泛的继承方式通过原型链实现对原型属性和方法的继承,通过构造函数实现对实例属性的继承,同 ...
- javascript继承机制的设计思想(ryf)
我一直很难理解Javascript语言的继承机制. 它没有"子类"和"父类"的概念,也没有"类"(class)和"实例" ...
- 【读书笔记】javascript 继承
在JavaScript中继承不像C#那么直接,C#中子类继承父类之后马上获得了父类的属性和方法,但JavaScript需要分步进行. 让Brid 继承 Animal,并扩展自己fly的方法. func ...
- 关于JavaScript继承的那些事
在JavaScript中,对象的创建可以脱离类型(class free),通过字面量的方式可以很方便的创建出自定义对象. 另外,JavaScript中拥有原型这个强大的概念,当对象进行属性查找的时候, ...
随机推荐
- chef cookbook 实战
在Workstation中创建cookbook,并且上传到Chef server,以及其他与Chef相关的工作. 安装chef client命令 knife bootstrap 10.6.1.207 ...
- Elasticsearch 禁止Body覆盖URL中的参数
以通过设置参数rest.action.multi.allow_explicit_index为false来关闭覆盖功能. 这个设置会对所有的节点起作用,设置方法如下: 在config/elasticse ...
- CSS参数介绍
原文发布时间为:2008-08-03 -- 来源于本人的百度文章 [由搬家工具导入] 行高 line-height: 16px 宽度 (具体位置)-width: 16px 文字 ...
- Android 之 下拉框(Spinner)的使用-转
下拉列表 Spinner. Spinner的使用,可以极大提高用户的体验性.当需要用户选择的时候,可以提供一个下拉列表将所有可选的项列出来.供用户选择. Demo如下,可以留作参考 一.使用数组作为数 ...
- AC日记——凌乱的yyy 洛谷 P1803
题目背景 快noip了,yyy很紧张! 题目描述 现在各大oj上有n个比赛,每个比赛的开始.结束的时间点是知道的. yyy认为,参加越多的比赛,noip就能考的越好(假的) 所以,他想知道他最多能参加 ...
- python实现显示安装进度条
一直很好奇那种安装进度条,或者启动程序时候显示的进度条是怎么实现的,学习了python之后,sys模块中有个方法可以实现,代码如下: 1 2 3 4 5 6 import sys,time ...
- TCP/IP 协议栈
TCP(传输控制协议) 传输控制协议(Transmission Control Protocol,TCP)是一种面向连接的.可靠的.基于字节流的传输层通信协议,由IETF的RFC 793定义. 在因特 ...
- 动态规划—最长回文子串LEETCODE第5题深度剖析
动态规划对于笔者来说有很重要的意义 一.题目如下: 对于此类题目,笔者常用的的办法是先做个暴力解题思路,然后再对暴力法进行优化. 二.暴力法 //字串遍历 public static String l ...
- 设计模式之装饰(Decorator)模式
设计模式之装饰(Decorator)模式 (一)什么是装饰(Decorator)模式 装饰模式,又称为包装模式,它以对客户端透明的方式扩张对象的功能,是继承关系的替代方案之一. 装饰模式可以在不使用创 ...
- 【spring boot Mybatis】报错:org.apache.ibatis.binding.BindingException: Invalid bound statement (not found): com.newhope.interview.dao.UserMapper.add
报错如下: org.apache.ibatis.binding.BindingException: Invalid bound statement (not found): com.newhope.i ...