`

js继承的实现

阅读更多
写道
js继承有5种实现方式:
1、继承第一种方式:对象冒充
function Parent(username){
this.username = username;
this.hello = function(){
alert(this.username);
}
}
function Child(username,password){
//通过以下3行实现将Parent的属性和方法追加到Child中,从而实现继承
//第一步:this.method是作为一个临时的属性,并且指向Parent所指向的对象,
//第二步:执行this.method方法,即执行Parent所指向的对象函数
//第三步:销毁this.method属性,即此时Child就已经拥有了Parent的所有属性和方法
this.method = Parent;
this.method(username);//最关键的一行
delete this.method;

this.password = password;
this.world = function(){
alert(this.password);
}
}
var parent = new Parent("zhangsan");
var child = new Child("lisi","123456");
parent.hello();
child.hello();
child.world();

2、继承第二种方式:call()方法方式
call方法是Function类中的方法
call方法的第一个参数的值赋值给类(即方法)中出现的this
call方法的第二个参数开始依次赋值给类(即方法)所接受的参数

function test(str){
alert(this.name + " " + str);
}
var object = new Object();
object.name = "zhangsan";
test.call(object,"langsin");//此时,第一个参数值object传递给了test类(即方法)中出现的this,而第二个参数"langsin"则赋值给了test类(即方法)的str

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

this.password = password;
this.world = function(){
alert(this.password);
}
}
var parent = new Parent("zhangsan");
var child = new Child("lisi","123456");
parent.hello();
child.hello();
child.world();

3、继承的第三种方式:apply()方法方式
apply方法接受2个参数,
A、第一个参数与call方法的第一个参数一样,即赋值给类(即方法)中出现的this
B、第二个参数为数组类型,这个数组中的每个元素依次赋值给类(即方法)所接受的参数

function Parent(username){
this.username = username;
this.hello = function(){
alert(this.username);
}
}
function Child(username,password){
Parent.apply(this,new Array(username));

this.password = password;
this.world = function(){
alert(this.password);
}
}
var parent = new Parent("zhangsan");
var child = new Child("lisi","123456");
parent.hello();
child.hello();
child.world();

4、继承的第四种方式:原型链方式,即子类通过prototype将所有在父类中通过prototype追加的属性和方法都追加到Child,从而实现了继承
function Person(){
}
Person.prototype.hello = "hello";
Person.prototype.sayHello = function(){
alert(this.hello);
}

function Child(){
}
Child.prototype = new Person();//这行的作用是:将Parent中将所有通过prototype追加的属性和方法都追加到Child,从而实现了继承
Child.prototype.world = "world";
Child.prototype.sayWorld = function(){
alert(this.world);
}

var c = new Child();
c.sayHello();
c.sayWorld();

5、继承的第五种方式:混合方式
混合了call方式、原型链方式

function Parent(hello){
this.hello = hello;
}
Parent.prototype.sayHello = function(){
alert(this.hello);
}

function Child(hello,world){
Parent.call(this,hello);//将父类的属性继承过来
this.world = world;//新增一些属性
}

Child.prototype = new Parent();//将父类的方法继承过来

Child.prototype.sayWorld = function(){//新增一些方法
alert(this.world);
}

var c = new Child("zhangsan","lisi");
c.sayHello();
c.sayWorld();
 
分享到:
评论

相关推荐

    js继承实现示例代码

    ### JavaScript继承实现示例 #### 知识点概述 在JavaScript中,继承是一种常见的对象间关系,它允许一个对象(子类)继承另一个对象(父类或超类)的属性和方法。通过继承,可以复用代码、提高程序的可维护性,并...

    13、JavaScript继承实现(二) —— zInherit、xbObjects

    zInherit是一种常用的JavaScript继承实现方式,它通过修改对象的`__proto__`属性来实现继承。`__proto__`指向父对象的原型,从而使得子对象能够访问父对象的属性和方法。但是,`__proto__`并不是所有浏览器都支持的...

    java script 继承的实现

    本文将深入探讨 JavaScript 中的继承实现方式,并结合提供的 "zinherit.js" 文件来解析相关知识点。 在 JavaScript 中,继承主要通过原型链(prototype chain)、构造函数继承、组合继承、原型式继承、寄生式继承、...

    javascript 原生态js类继承实现的方式

    而实例则是类的一个具体实现。 我们还知道,面向对象编程有三个重要的概念 - 封装、继承和多态。 但是在JavaScript的世界中,所有的这一切特性似乎都不存在。 因为JavaScript本身不是面向对象的语言,而是基于对象...

    javascript中如何实现封装,继承和多态

    javascript中如何实现封装,继承和多态

    JS继承的实现方式

    下面将详细介绍几种常见的继承实现方式,并探讨它们的特点与应用场景。 #### 一、原型链继承 **核心思想**: 将父类的实例设置为子类的原型。 **实现方式**: ```javascript function Animal(name) { this.name = ...

    详解Javascript继承的实现

    本文从以下四个方面展开话题: ...正因如此,我从没想过下次写继承的时候,我要换一种方式来写,直到今天晚上看了三生石上关于javascript继承系列的文章(出的很早,现在才看,真有点可惜),才发现在js里

    classy.js:一个简单的 Javascript 继承实现

    Classy 是一个 Javascript 继承实现。 这几乎就是你需要知道的一切。 您将获得一种在代码中实现 Javascript 类的简单方法以及一个有用的“包含”方法。 ##例子 ###Building.js Class ( "Building" , { //...

    javascript 继承实现方法

    JavaScript中的继承实现方法还有很多,例如ES6中的class关键字,背后其实也是通过原型链实现的。同时,基于JavaScript的动态特性,也允许我们实现更加灵活多变的继承方式,例如通过Object.create、Object.assign等...

    JavaScript实现继承的几种方式

    本篇文章将深入探讨JavaScript中实现继承的几种常见方式。 1. 原型链继承 JavaScript的原型(prototype)机制是实现继承的基础。每个函数都有一个prototype属性,这个属性指向一个对象,这个对象的属性和方法可以被...

    js继承.doc

    本文档将探讨JavaScript中的继承实现方式及其优缺点。 首先,我们需要理解JS中的对象与类的区别。在JS中,对象可以直接通过字面量语法创建,例如`var myObj = {...}`,这种对象不能通过`new`关键字实例化,因此它...

    【JavaScript的9种继承实现方式归纳】js实现继承的几种方式.pdf

    JavaScript 的 9 种继承实现方式归纳 JavaScript 中的继承方式是基于原型的,与基于类的编程语言,如 C++ 和 Java,截然不同。JavaScript 的灵活性使得其实现继承的方式非常多样化。本文将介绍 JavaScript 中的 9 ...

    JS继承实现方法及优缺点详解

    除此之外,JavaScript还提供了其他继承实现方式,如**组合继承**(结合了构造继承和原型链继承的优点,但存在两次调用父类构造函数的开销),**寄生组合继承**(通过寄生构造函数解决组合继承的重复调用问题),以及...

    Javascript 继承实现例子

    在真正的Web站点和应用程序中,几乎不可能创建名为ClassA和ClassB的类,更可能的是创建表示特定事物(如形状)的类。考虑本章开头所述的形状的例子,Polygon、Triangle和Rectangle类就构成了一组很好的探讨数据。

    JavaScript学习之三 — JavaScript实现继承的7种方式

    在JavaScript中,面向对象编程是实现复杂功能和代码复用的关键。继承是面向对象的核心特性之一,它...文章中的`inheritance.html`和`inheritance.js`文件可能包含示例代码,帮助你直观地了解每种继承方式的实现和使用。

    js继承的用法

    根据提供的文件信息,我们可以分析并总结出关于JavaScript继承的一些关键知识点。尽管提供的代码示例主要关注于使用jQuery插件初始化一个表格(grid),但这里我们将重点放在如何在JavaScript中实现继承这一主题上。...

    Javascript中3种实现继承的方法和代码实例_.docx

    本文将探讨三种主要的JavaScript继承实现方式:对象冒充、原型继承以及两者的混合。 ### 一、对象冒充 对象冒充是通过调用父类构造函数并利用`this`关键字来实现继承的一种方法。这种方法的核心在于,子类构造函数...

    js 实现类式继承

    在JavaScript中,实现类式继承是面向对象编程中的一个关键概念。JavaScript本身是一种基于原型的动态类型语言,但在ES6引入了`class`语法糖,使得类的概念更加清晰,但其实质仍然是基于原型的继承。下面我们将深入...

Global site tag (gtag.js) - Google Analytics