1.利用原型对象实现继承
<html>
<head>
</head>
<body>
<script language="javascript" type="text/javascript">
<!--
//每个函数对象都具有prototype属性,这个属性保存了函数对象的原型对象的引用.而函数对象的所有属性和方法都"继承自这个原型对象".同样,构造函数也具有prototype属性.
function Person(name,sex) {
this.name=name;
this.sex=sex;
}
Person.prototype.sayHello=function (){
document.write("大家好,我的名字是"+this.name+".<br>");
}
//定义Student类,构造函数为空
function Student(){
}
Student.prototype=new Person("张三","男");
var student=new Student();
Student.prototype.grade="三年级";
Student.prototype.introduce=function(){
document.write("我是"+this.grade+"的学生............");
}
student.sayHello();
student.introduce();
//删除对象的属性和方法有两种方式:1是delete person.speak; 2是person.name="underfined;"
//-->
</script>
</body>
\</html>
2.通过构造函数实现继承
<html>
<head>
</head>
<body>
<script language="javascript" type="text/javascript">
<!--
//通过构造函数调用实现继承
//this关键字引用的是当前构造函数所创建的对象实例,当类B的构造函数作为类A的方法并在类A的构造函数中调用时,this引用的就是类A的构造函数所创建的实例,这样类A的实例就拥有了类B的属性和方法
function ClassA(name,age){
//将ClassB作为函数定义为ClassA的函数tempMthod
this.tempMethod=ClassB;
//调用tempMthod
this.tempMethod(name);
//删除tempMethod方法
delete this.tempMethod;
this.age=age;
this.sayHello=function(){
document.write("你好,我的名字叫"+this.name+",我今年"+this.age+"岁了!!!!<br>");
}
}
function ClassB(name){
this.name=name;
this.sayHello=function(){
document.write("我是不会告诉你我的名字叫"+this.name+"的!!!!!<br>");
}
}s
var classB =new ClassB("张三");
classB.sayHello();
var classA=new ClassA("李四",34);
classA.sayHello();
//删除对象的属性和方法有两种方式:1是delete person.speak; 2是person.name="underfined;"
//-->
</script>
</body>
</html>
3.使用call方法和apply方法实现继承
<html>
<head>
</head>
<body>
<script language="javascript" type="text/javascript">
<!--
//使用call方法和apply方法实现继承
//这两个方法可以将函数绑定到其他对象上执行
//可以将类B的构造函数绑定到类A的对象实例上执行,达到类A继承类B的目的
function Animal(color,age){
this.color=color;
this.age=age;
this.cry=function(){
document.write("Hi,我是"+this.color+"色的. 我今年"+this.age+"岁了!!<br>");
}
}
function Dog(color ,age){
Animal.call(this,color,age);
//使用call方法将Animal函数绑定到Dog实例上执行
}
function Cat(color ,age){
Animal.apply(this,[color,age]);
//使用apply方法将Animal函数绑定到Cat实例上执行
}
var animal=new Animal("绿",33);
animal.cry();
var dog=new Dog("黑",11);
dog.cry();
var cat =new Cat("白",4);
cat.cry();
//-->
</script>
</body>
\</html>
分享到：
相关推荐
JavaScript中的几种继承方法示例 1.原型链继承 原理: 子类原型指向父类实例对象实现原型共享,即Son.prototype = new Father()。 这里先简单介绍下原型 js中每个对象都有一个__proto__属性，这个属性指向的...
23、java 中实现多态的机制是什么？ ......................................................................... 17 24、abstract class 和 interface 有什么区别? ...............................................
javascript 中的继承实例详解 阅读目录 原型链继承 借用构造函数 组合继承 寄生组合式继承 后记 继承有两种方式：接口继承和实现继承。接口继承只继承方法签名，而实现继承则继承实际的方法。 由于函数没有签名...
1.原型链继承 原理: 子类原型指向父类实例对象实现原型共享,即Son.prototype = new Father()。 这里先简单介绍下原型 js中每个对象都有一个__proto__属性，这个属性指向的就是该对象的原型。js中每个函数都有一个...
下面我给出几种常用的方法: 1 .对象冒充 原理: 构造函数使用this关键字给所有属性和方法赋值, 因为构造函数只是一个函数,所以可以使ClassA的构造函数成为classB的方法,然后调用它.这样classB就会收到classA的构造...
从“原始值和引用值类型及区别”到“EventLoop事件循环&宏任务和微任务 ”，整理了Javascript学习和面试中遇到的一些基础和常见的问题。 总共包含33个问答，部分问题带有代码解答。 1. 原始值和引用值类型及区别 2. ...
10.2 几个视觉效果库简介 10.3 视觉盛宴 10.3.1 MOO式的CSS属性修改 10.3.2 通过Script.aculo.us实现视觉效果 10.3.3 通过Moo.fx实现逼真的运动效果 10.3.4 圆角效果 10.3.5 其他...
Javascript原型继承是一个被说烂掉了的话题，但是自己对于这个问题一直没有彻底理解，今天花了点时间又看了一遍《Javascript模式》中关于原型实现继承的几种方法，下面来谈谈JS中比较简单的继承方法，如果大家有不同...
主要介绍了详述JavaScript实现继承的几种方式(推荐)的相关资料,需要的朋友可以参考下
本文实例讲述了JavaScript中的类与实例实现方法。分享给大家供大家参考。具体如下： JavaScript 中没有父类, 子类的概念, 也没有class 和 instance 的概念, 全靠 prototype chain来实现继承. 当查找一个对象的属性时...
在JavaScript中实现继承可以有多种方法，下面说两种常见的。 一，call 继承，先看代码： 先定义一个“人”类 代码如下: //人类 Person=function(){ this.name=”草泥马”; this.eat=function(){ alert(“我要...
依次介绍了JavaScript的发展历史、基础性话题（变量、数据类型、数组、循环以及条件表达式）、函数、对象、原型、继承的实现、BOM和DOM等。附录部分包括了学习JavaScript编程常用的参考资源。尤其值得一提的是，本书...
所以我好几次都用了丧心病狂的数组继承去实现，下面给大家分享下。 在 JavaScript 中，数组也属于 Object 的一种，它也可以继承。任何两个对象本身就可以有继承关系，数组也不例外。于是我们让一个树的任何一个...
1.原型链继承：构造函数、原型和实例的关系：每个构造函数都有一个原型对象，原型对象都包含一个指向构造函数的指针，而实例都包含一个指向原型对象的内部指针。确认原型和实例之间的关系用instanceof。 原型链继承...
深入学习javascript继承之前,先了解下面的几个概念: 父类:被继承的类 子类:由继承得来的类 超类:也就是父类 抽象类:一般不用来实例化的类,它的用途是用来给其他类继承. 基类:提供给其他类可以继承的类 派生类:由基类...
10.2 几个视觉效果库简介 10.3 视觉盛宴 10.3.1 MOO式的CSS属性修改 10.3.2 通过Script.aculo.us实现视觉效果 10.3.3 通过Moo.fx实现逼真的运动效果 10.3.4 圆角效果 10.3.5 其他...
10.2 几个视觉效果库简介 10.3 视觉盛宴 10.3.1 MOO式的CSS属性修改 10.3.2 通过Script.aculo.us实现视觉效果 10.3.3 通过Moo.fx实现逼真的运动效果 10.3.4 圆角效果 10.3.5 其他...
9.36 使用JavaScript向表格中写入数据 9.37 类C# GridView的编辑效果（一） 9.38 类C# GridView的编辑效果（二） 第10章 单选框和复选框 10.1 选择了哪一个单选框 10.2 单击文字实现单选框的选定 10.3 被选中的复选...