17. JavaScript中的继承。
1） 对象冒充
<html>
<head>
<script type="text/javascript">
function Parent(username) {
this.username = username;
this.sayHello = function() {
alert(this.username);
}
}
function Child(username, password) {
//下面三行代码时重点
this.method = Parent;
this.method(username);
delete this.method;
this.password = password;
this.sayWorld = function() {
alert(this.password);
}
}
var parent = new Parent("zhangsan");
var child = new Child("lisi", "123");
parent.sayHello();
child.sayHello();
child.sayWorld();
</script>
</head>
<body>
</body>
</html>
parent中的this已经被child替换，所以才可以实现这个功能。
2） call方法方式。
call方法是Function对象中的方法，因此我们定义的每个函数都拥有该方法。可以通过函数名来调用call方法，call方法的第一个参数会被传递给函数中的this，从第2个参数开始，逐一赋值给函数中的参数。
<html>
<head>
<script type="text/javascript">
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("zhangsan");
var child = new Child("lisi", "123");
parent.sayHello();
child.sayHello();
child.sayWorld();
</script>
</head>
<body>
</body>
</html>
3） apply方法方式
下面这个就相当于call的简化写法，它把参数都放在了数组里面。
<html>
<head>
<script type="text/javascript">
function Parent(username) {
this.username = username;
this.sayHello = function() {
alert(this.username);
}
}
function Child(username, password) {
Parent.apply(this, new Array(username));
this.password = password;
this.sayWorld = function() {
alert(this.password);
}
}
var parent = new Parent("zhangsan");
var child = new Child("lisi", "123");
parent.sayHello();
child.sayHello();
child.sayWorld();
</script>
</head>
<body>
</body>
</html>
4）原型链方式（无法给构造函数传参数）
<html>
<head>
<script type="text/javascript">
function Parent() {
}
Parent.prototype.hello = "hello";
Parent.prototype.sayHello = function() {
alert(this.hello);
}
function Child(username, password) {
}
Child.prototype = new Parent();
Child.prototype.world = "world";
Child.prototype.sayWorld = function() {
alert(this.world);
}
var child = new Child();
child.sayHello();
child.sayWorld();
</script>
</head>
<body>
</body>
</html>
5）混合方式（推荐）
下面方法的好处是，即不共享变量，同时使用的还是同一个函数。
<html>
<head>
<script type="text/javascript">
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 child = new Child("hello", "world");
child.sayHello();
child.sayWorld();
</script>
</head>
<body>
</body>
</html>
分享到：
相关推荐
本篇文章将深入探讨JavaScript中实现继承的几种常见方式。 1. 原型链继承 JavaScript的原型（prototype）机制是实现继承的基础。每个函数都有一个prototype属性，这个属性指向一个对象，这个对象的属性和方法可以被...
本篇文章将深入探讨JavaScript实现继承的七种常见方式，帮助你更好地理解和运用这一概念。 1. 原型链继承（Prototype Chain Inheritance） 原型链是JavaScript实现继承的基础。每个函数都有一个`prototype`属性，这...
除了传统的原型链继承，JavaScript还支持其他继承模式，如组合继承（组合使用构造函数和原型链）、寄生继承（通过创建父类副本改进继承）、原型式继承（使用`Object.create()`）、寄生组合式继承（被认为是最有效的...
在这个主题中，“javascript控件开发之继承关系”主要探讨的是如何利用JavaScript的面向对象特性来构建和组织控件的层次结构，以及如何通过继承来实现代码的复用和模块化。 在JavaScript中，继承是基于原型...
在本文中，我们将深入探讨JavaScript继承机制的实现方式，并对基于原型的继承、构造函数方式继承、组合继承、寄生式继承等继承机制进行了总结归纳和分析。 基于原型的继承 JavaScript是一门基于原型的语言，它不像...
Javascript原型继承是一个被说烂掉了的话题，但是自己对于这个问题一直没有彻底理解，今天花了点时间又看了一遍《Javascript模式》中关于原型实现继承的几种方法，下面来一一说明下，在最后我根据自己的理解提出了一...
JavaScript继承机制探讨及其应用 JavaScript是一门弱类型语言，具有函数式编程和面向对象编程的特点。随着近几年JavaScript生态圈的发展和成熟，项目的编码量和复杂度也在呈几何级数增长。JavaScript面向对象编程中...
### JavaScript原型继承工作原理及实例详解 #### 一、引言 JavaScript作为一种广泛使用的脚本语言，在Web开发中扮演着重要角色。其独特的面向对象机制是通过原型继承来实现的，这种机制使得JavaScript能够灵活地...
在深入探讨JavaScript的原型继承之前，首先要明确的是JavaScript中并没有类似其他编程语言中的类继承的概念。虽然有传言JavaScript 2.0将加入类继承机制，但考虑到要让所有浏览器支持新特性可能需要很长时间，因此...
JavaScript的继承机制主要基于原型链，本文将深入探讨JavaScript的继承与多继承，并通过实例进行分析。 1. **JavaScript继承** - **原理**：JavaScript的继承主要是通过原型链（prototype chain）来实现的。每个...
JavaScript中的继承机制是其面向对象特性的重要组成部分。与其他支持继承的语言不同，JavaScript并没有内置的`extend`等方法，而是依赖于构造函数和原型链的概念来实现继承。在JavaScript中，一个对象的属性和方法...
在JavaScript的世界里，原型继承不仅是实现对象功能共享的核心机制，也是其面向对象编程风格的基础。本文将深入探讨JavaScript原型继承的工作原理、实现方式以及在现代Web开发中的应用。 JavaScript的原型继承是一种...
javascript原型继承机制参考.pdf
javascript原型继承机制归类.pdf
JavaScript开发工具JSEditorPro v10.0是一款专为JavaScript编程设计的强大开发环境，它集成了多种功能，旨在提升开发者的工作效率，使JavaScript编写过程更加流畅。这款工具的核心特性包括语法高亮显示，代码编译...
JavaScript中的继承是面向对象编程的重要概念，它允许一个对象（子对象）获取另一个对象（父对象）的属性和方法，从而实现代码复用和多态性。JavaScript支持多种继承实现方式，包括以下四种： 1. **构造函数继承**...
JavaScript原型继承是面向对象编程在JavaScript中的实现方式之一，它基于原型（Prototype）和对象的特性，使得一个对象可以继承另一个对象的属性和方法。在JavaScript中，每个对象都有一个特殊的内部属性`[...
JavaScript的原型继承是其面向对象编程的一大特性，它基于原型链机制实现，允许一个对象可以从另一个对象继承属性和方法。这种继承方式不同于类继承，而是通过将子类的原型对象设置为父类的一个实例来实现。 在...
javascript原型继承工作原理和实例详解.doc
javascript实现继承的4种方法总结.doc