手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >JS继承 笔记
JS继承 笔记
摘要:JS继承JavaScript中没有类的概念,与类相关的继承的概念更是无从谈起,但是我们可以通过特殊的语法来模拟面向对象语言中的继承。在JS中...

JS继承

JavaScript中没有类的概念,与类相关的继承的概念更是无从谈起,但是我们可以通过特殊的语法来

模拟面向对象语言中的继承。

在JS中模拟继承有多种方式,其中寄生组合模式是一种比较容易简单的模拟继承模式,下面我们就来

介绍一下用寄生组合模式模拟继承。

JS的继承包括属性的继承和方法的继承,他们分别通过不同的方法来实现。

1属性的继承

属性的继承通过改变函数的执行环境来实现的。而改变函数的执行环境可以使用call()和apply()两种

方法来实现。

我们首先创建一个Animal“类”(因为JS中没有类的概念,这里只是一个模拟,它实际上只是一个

Function函数对象)。

复制代码 代码如下:

function Animal(name){

this.name=name;

}

再创建一个Lion“类”,“继承”于Animal

复制代码 代码如下:

function Lion(){

Animal.apply(this, ["狮子"]);

}

这里使用了Animal的apply方法,把Animal的执行环境改成Lion被调用时的执行环境。

这里要解释一下,我们要想使用Lion这个“类”,通常需要new一个Lion。如:

var l = new Lion();

而new关键字是十分伟大的,在上段代码中,new关键字完成了以下几项工作:

1)开辟堆空间,以准备存储Lion对象

2)修改Lion对象本身的执行环境,使得Lion函数的this指向了Lion函数对象本身。

3)调用Lion“类”的“构造函数”,创建Lion对象

4)将Lion函数对象的堆地址赋值给变量l,这个时候l就指向了这个Lion函数对象

所以经过new关键字以后Animal.apply(this, ["狮子"])中的this已经指向了Lion函数对象本身了,所

以这段代码就将Animal函数的执行环境改变成了Lion函数中,相当于以下代码:

复制代码 代码如下:

function Lion(){

function Animal(name){

this.name=name;

}

}

而此时的this已经是Lion函数对象了所以上段代码进一步相当于:

复制代码 代码如下:

function Lion(){

this.name=name;

}

这样就给Lion函数对象添加了name属性,也模拟了Lion函数继承于Animal函数的效果。

2方法的继承

在JS中每一个“类”(即函数,注意不是函数对象)都有一个prototype属性,prototype表示该函数

的原型,也表示一个类的成员的集合(通常是方法的集合)。我们可以通过函数的prototype属性来实现方

法的继承。

我们同样首先创建一个Animal“类”:

复制代码 代码如下:

function Animal(name){

this.name=name;

}

给Animal的原型中加入一个eat方法:

复制代码 代码如下:

Animal.prototype.eat=function(){

alter("我能吃!~");

}

创建一个Lion“类”,同时完成对Animal“类”的属性的继承

复制代码 代码如下:

function Lion(){

Animal.apply(this, ["狮子"]);

}

注意下面的代码,我们马上要完成方法的继承了

Lion.prototype=new Animal();

这样就把一个Animal函数对象储存在了Lion的原型中了,Lion也就包含了Animal中的方法了(其实也

包含了属性)。这样就模拟了Lion函数对Animal的继承。

【JS继承 笔记】相关文章:

JavaScript数据结构与算法之链表

javascript学习笔记(十) js对象 继承

jQuery异步上传文件插件ajaxFileUpload详细介绍

Node.js开发者必须了解的4个JS要点

JavaScript版代码高亮

详解Wondows下Node.js使用MongoDB的环境配置

JavaScript中substring()方法的使用

jQuery使用zTree插件实现树形菜单和异步加载

JavaScript高级程序设计 阅读笔记(十四) js继承机制的实现

JavaScript操作Cookie方法实例分析

精品推荐
分类导航