js如何实现继承(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();

时间: 2024-10-20 10:11:29

js如何实现继承(js实现继承的五种方式)的相关文章

js数组拍平(数组扁平化)的五种方式

1.数组拍平也称数组扁平化,就是将数组里面的数组打开,最后合并为一个数组 2.实现 var arr = [1,2,[3,4,5,[6,7,8],9],10,[11,12]]; a:递归实现 function fn(arr){ let arr1 = [] arr.forEach((val)=>{ if(val instanceof Array){ arr1 = arr1.concat(fn(val)) }else{ arr1.push(val) } }) return arr1 } b:reduc

继承关系中的第三种方式:利用<union-subclass>(补充)

继承关系中的第三种方式:利用<union-subclass>   代码:   映射文件(其他的代码和其他继承关系相同)   Person.hbm.xml   <?xml version="1.0"?> <!DOCTYPE hibernate-mapping PUBLIC "-//Hibernate/Hibernate Mapping DTD 3.0//EN" "http://hibernate.sourceforge.net/

js中构造函数的原型添加成员的两种方式

首先,js中给原型对象添加属性和方法. 方式一:对象的动态特效 给原型对象添加成员 语法:构造函数.prototype.方法名=function (){ } 方式二:替换原型对象(不是覆盖,而是替换,把原先的同名的直接替换成现在的) 语法:构造函数.prototype.方法名={ } tips:方式二不常用,因为这样会修改了原型本身 搜索:JS中通过构造函数添加成员方法和通过原型法添加成员方法的区别 参考网址  http://blog.csdn.net/xxmzumeng/article/det

javascritp继承的五种方式

今天要介绍的是,对象之间的"继承"的五种方法. 比如,现在有一个"动物"对象的构造函数. function Animal(){ this.species = "动物"; } 还有一个"猫"对象的构造函数. function Cat(name,color){ this.name = name; this.color = color; } 使用apply或则call把父对象的构造函数绑定在子对象上 eg:   function C

继承的五种方式

1.混入式继承 var obj1 = {} var obj2 = { name: 'ys', age: 18 } for(var k in obj2){ obj1[k] = obj2[k] } 2.原型继承 // 方法一: function Person() { }; var obj1 = {} var obj2 = { name: 'ys', age:18 } obj2 = new Person Person.prototype = obj2 // 方法二: function Person()

js对url进行编码和解码(三种方式区别)

*** 只有 0-9[a-Z] $ - _ . + ! * ' ( ) , 以及某些保留字,才能不经过编码直接用于 URL. ***例如:搜索的中文关键字,复制网址之后再粘贴就会发现该URL已经被转码. 1)escape 和 unescape 原理:对除ASCII字母.数字.标点符号 @ * _ + - . / 以外的其他字符进行编码. 编码: eg:escape('http://[email protected]@jie&order=你好') res:"http%3A//www.bai

js实现继承的5种方式

js是门灵活的语言,实现一种功能往往有多种做法,ECMAScript没有明确的继承机制,而是通过模仿实现的,根据js语言的本身的特性,js实现继承有以下通用的几种方式1.使用对象冒充实现继承(该种实现方式可以实现多继承)实现原理:让父类的构造函数成为子类的方法,然后调用该子类的方法,通过this关键字给所有的属性和方法赋值 Js代码   function Parent(firstname) { this.fname=firstname; this.age=40; this.sayAge=func

五种js判断是否为整数(转)

五种js判断是否为整数类型方式 作者:snandy 这篇文章主要介绍了五种JavaScript判断是否为整数类型方式,需要的朋友可以参考下 这篇看看如何判断为整数类型(Integer),JavaScript中不区分整数和浮点数,所有数字内部都采用64位浮点格式表示,和Java的double类型一样.但实际操作中比如数组索引.位操作则是基于32位整数.方式一.使用取余运算符判断任何整数都会被1整除,即余数是0.利用这个规则来判断是否是整数. ? 1 2 3 4 5 function isInteg

javascript 模拟java 实现继承的5种方式

1.继承第一种方式:对象冒充 function Parent(username){ this.username = username; this.hello = function(){ alert(this.username); } } function Child(username,password){ //通过以下3行实现将Parent的属性和方法追加到Child中,从而实现继承 //第一步:this.method是作为一个临时的属性,并且指向Parent所指向的对象, //第二步:执行th