`
wangdongsong
  • 浏览: 35254 次
  • 性别: Icon_minigender_1
  • 来自: 武汉
社区版块
存档分类
最新评论

JavaScript面向对象的继承的几种方式

 
阅读更多

看了一些资料和视频,有五种方式实现继承,代码如下:

 

/**
 * 继承的五种方法
 * @author wangds
 *
 *
 * 1.call方法
 * call方法是Function对象中的方法,因此我们定义的每一个函数都拥有该方法。
 * 可以通过函数名来调用call方法,call方法的第一个参数会被传递函数中的this
 * 从第二个参数开始,逐一赋值给函数中的参数
 * @param {Object} username
 */
function Parent(username){
	this.username = username;
	this.sayHello = function(){
		alert(this.username);
	}
}

function Child(username, password){
	Parent.call(this,username);
	this.password = password;
	
	this.sayWorld = function(){
		alert(this.password);
	}
}

var parent = new Parent("wds");
var child = new Child("zzh","you amd me");

parent.sayHello();

child.sayWorld();
child.sayHello();

/**
 * 2.apply
 */
function ParentApply(username){
	this.username = username;
	this.sayHello = function(){
		alert("ParentApply.sayHello:" + this.username);
	}
}
function ChildApply(username, password){
	ParentApply.apply(this, new Array(username));
	this.password = password;
	
	this.sayWorld = function(){
		alert("ChildApply.sayWorld:" + this.password);
	}
}
var p = new ParentApply("wds");
var c = new ChildApply("zzh", "pass");
p.sayHello();

c.sayWorld();
c.sayHello();

/**
 * 3.原型链
 */
function ParentProto(){}

ParentProto.prototype.hello = "Wds Hello";
ParentProto.prototype.sayHello = function(){
	alert(this.hello);
}

function ChildProto(){}

ChildProto.prototype = new ParentProto();
ChildProto.prototype.world = "wrp World";
ChildProto.prototype.sayWorld = function(){
	alert(this.world);
}

var child = new ChildProto();
child.sayHello();
child.sayWorld();

/**
 * 4.混合式
 */
function ParentMix(hello){
	this.hello = hello;
}
ParentMix.prototype.sayHello = function(){
	alert(this.hello);
}

function ChildMix(hello, world){
	ParentMix.call(this, hello);
	this.world = world;
}
ChildMix.prototype.sayWorld = function(){
	alert(this.world);
}

var childMix = new Child("Hello Mix", "World Mix");
childMix.sayHello();
childMix.sayWorld();

/**
 * 5.对象冒充
 */
function ParentFirst(username){
	this.username = username;
	
	this.sayHello = function(){
		alert(this.username);
	}
}

function ChildFirst(username, password){
	this.method = ParentFirst;
	this.method(username);
	delete this.method;
	
	this.password = password;
	
	this.sayWorld = function(){
		alert(this.password);	
	}
}

var firstParent = new ParentFirst("first Parent");
var firstChild = new ChildFirst("firstChild","firstPassword");

firstParent.sayHello();

firstChild.sayHello();
firstChild.sayWorld();

 

分享到:
评论

相关推荐

    JavaScript面向对象编程指南(第2版)

    1.本书是唯一一本介绍JavaScript面向对象编程的图书。, 2.本书作者是知名的Web开发人员和作者。受到国内众多前端开发人员,如淘宝UED团队的推崇和推荐。 Stoyan Stefanov:Facebook公司工程师、作家、演说家。他经常...

    javascript面向对象之Javascript 继承

    上几节讲了 JavaScript 面向对象之命名空间 、 javascript 面向对象的JavaScript类 、 JavaScript 面向对象的之私有成员和公开成员 与 Javascript 面向对象之重载,大家可以先看上面的再继续往下看。在JavaScript...

    Javascript中的几种继承方式对比分析

    这种说法原因一般都是觉得javascript作为一门弱类型语言与类似java或c#之类的强型语言的继承方式有很大的区别,因而默认它就是非主流的面向对象方式,甚至竟有很多书将其描述为’非完全面向对象’语言。其实个人觉得...

    Javascript编程中几种继承方式比较分析

    本文实例分析了Javascript编程中几种继承方式比较。分享给大家供大家参考,具体如下: 开篇 从’严格’意义上说,javascript并不是一门真正的面向对象语言。这种说法原因一般都是觉得javascript作为一门弱类型语言与...

    CKevens#-#05-02.面向对象:类的定义和继承的几种方式1

    前言类与实例:类的声明生成实例类与继承:如何实现继承:继承的本质就是原型链继承的几种方式类的定义、实例化类的定义/类的声明方式一:用构造函数模拟类(传统写法)/

    haoyi2015#Web-1#05-02.面向对象:类的定义和继承的几种方式1

    前言类与实例:类的声明生成实例类与继承:如何实现继承:继承的本质就是原型链继承的几种方式类的定义、实例化类的定义/类的声明方式一:用构造函数模拟类(传统写法)/

    javascript 面向对象封装与继承

    整理一下js面向对象中的封装和继承。 1.封装  js中封装有很多种实现方式,这里列出常用的几种。 1.1 原始模式生成对象  直接将我们的成员写入对象中,用函数返回。 缺点:很难看出是一个模式出来的实例。 代码: ...

    JavaScript面向对象的程序设计(犯迷糊的小羊)

    本章开始进入JavaScript核心知识点的高级部分——面向对象的程序设计,这一部分的内容将会对对象这一数据类型做进一步的深化理解,并且讲述几种创建对象的设计模式以及JavaScript独特的继承机制; 1.理解对象和面向...

    JavaScript定义类的几种方式总结

    提起面向对象我们就能想到类,对象,封装,继承,多态。在《javaScript高级程序设计》(人民邮电出版社,曹力、张欣译。英文名字是:Professional JavaScript for Web Developers)这本书中描述的还算比较详细。我们...

    javascript 面向对象全新理练之数据的封装

    它是面向对象程序设计的三要素之首,其它两个是继承和多态,关于它们的内容在后面再讨论。 关于数据封装的实现,在 C++、Java、C# 等语言中是通过 public、private、static 等关键字实现的。在 JavaScript 则采用了...

    JavaScript继承模式粗探

    真正意义上来说Javascript并不是一门面向对象的语言,没有提供传统的继承方式,但是它提供了一种原型继承的方式,利用自身提供的原型属性来实现继承。Javascript原型继承是一个被说烂掉了的话题,但是自己对于这个...

    JavaScript定义类或函数的几种方式小结

    提起面向对象我们就能想到类,对象,封装,继承,多态。在《javaScript高级程序设计》(人民邮电出版社,曹力、张欣译。英文名字是:Professional JavaScript for Web Developers)这本书中描述的还算比较详细。我们...

    JavaScript设计模式 (美)哈梅斯(Harmes,R), (美)迪亚斯(Diaz,D)著 源码+PDF

    第一部分给出了实现具体设计模式所需要的面向对象特性的基础知识,主要包括接口、封装和信息隐藏、继承、单体模式等内容。第二部分则专注于各种具体的设计模式及其在JavaScript语言中的应用,主要介绍了工厂模式、...

    Pro_JavaScript_Design_Patterns

    第一部分给出了实现具体设计模式所需要的面向对象特性的基础知识,主要包括接口、封装和信息隐藏、继承、单体模式等内容。第二部分则专注于各种具体的设计模式及其在JavaScript语言中的应用,主要介绍了工厂模式、...

    JavaScript继承学习笔记【新手必看】

    JavaScript作为一个面向对象语言(JS是基于对象的),可以实现继承是必不可少的,但是由于本身并没有类的概念,所以不会像真正的面向对象编程语言通过类实现继承,但可以通过其他方法实现继承。实现继承的方法很多,...

    算法实践(JavaScript & Java),排序,查找、树、两指针、动态规划等.zip

    面向对象: Java是一种纯粹的面向对象编程语言,支持封装、继承和多态等面向对象的概念。这使得Java编写的代码更加模块化、可维护和可扩展。 多线程支持: Java内置了对多线程的支持,允许程序同时执行多个任务。这...

    JavaScript类的写法

    早期的javascript需求都很简单,基本都是写成函数的,然后是面向过程的写法,后来慢慢的引入面向对象开发思想,再后来就慢慢写成类。 在js中,写成类的本质基本都是 构造函数+原型。下面,就讨论一下js类的几种写法...

    Java语言基础下载

    线程中断/恢复的几种方式 178 创建线程的两种方式 179 线程的控制 180 实例分析 182 内容总结 189 独立实践 190 第十二章:高级I/O流 192 学习目标 192 I/O基础知识 193 字节流 193 字符流 194 节点流 194 过程流 ...

    javaScript中封装的各种写法示例(推荐)

    今天,我就来谈谈js写法,我在开发过程中,也写了几种。对于性能方面,如果代码结构或逻辑写的不好,会造成计算机CPU的运算加大,运行性能降低,js的写法对性能的影响也是至关重要的。 通常写js组件开发的,都会用到...

Global site tag (gtag.js) - Google Analytics