首頁 web前端 js教程 javascript面向对象之Javascript 继承_js面向对象

javascript面向对象之Javascript 继承_js面向对象

May 16, 2016 pm 06:28 PM
javascript 繼承 物件導向

上几节讲了 JavaScript 面向对象之命名空间 、 javascript 面向对象的JavaScript类 、 JavaScript 面向对象的之私有成员和公开成员Javascript 面向对象之重载,大家可以先看上面的再继续往下看。

在JavaScript中实现继承可以有多种方法,下面说两种常见的。

  一,call 继承,先看代码:
  先定义一个“人”类

复制代码 代码如下:

//人类
Person=function(){
this.name="草泥马";
this.eat=function(){
alert("我要吃饭");
}
this.sleep=function(){
alert("我要睡觉");
}
}

  再定义一个学生类,让它继承于Person
复制代码 代码如下:

//学生类
Student=function(){
Person.call(this);//继承Person类
this.doHomework=function(){
alert("老师来了,作业借我抄下");
}
}

  关键看 Person.call(this)这句,其中this代表当前对象,即Student ,这很容易理解,而Person.call(this)的意思是:将Person类的所有的公开成员“附加”给Student类,让Student也具有了Person的所有功能。
  和高级语言一样,如果子类中出现了和父类中同名的成员,则会将其覆盖,也就是所谓的“重写”了。
  同样的,我们再定义一个女孩类 :
复制代码 代码如下:

//女孩类
Girl=function(){
Person.call(this);//继承Person类
this.sex="女";
}

  JavaScript是可以实现多重继承的,请看下面的Master(硕士)类,这个Master 自然是个学生,但同时又是个漂亮MM,于是有了下面的代码:
复制代码 代码如下:

//硕士类
Master=function(){
Student.call(this);//继承Student类
Girl.call(this);//继承Girl类
this.degree="硕士";//学历

}

  我们可以测试一下:
复制代码 代码如下:

var master=new Master();
master.name="凤姐";
master.eat();
master.doHomework();
alert("偶是名字叫:"+master.name);
alert("偶的性别是:"+master.sex);

  多重继承时要注意顺序,如果两个类中有相同名称的成员,那么后一个将覆盖前一个,也就是说当前类只会继承后一个类中的成员。
  call 方法继承就说到这,如果大家对call方法不清楚,就请去问问谷歌兄,我就不赘述了,网上转载得不要太多。下面说下另外一种继承方式。
  二,prototype 原型继承:
  我们再定义一个班长类:
复制代码 代码如下:

//班长类
SquadLeader=function (){
//打招呼
this.hi=function(){
alert("同学们好,我现在是班长了");
}
}

  上面定义了一个硕士类,现在这个硕士被提升为班长了,所以这个Master要继承SquadLeader了,这次我们用prototype 来实现,请看下面代码:
复制代码 代码如下:

Master.prototype=new SquadLeader();//prototype 属性指向一个对象
//或者
//Master.prototype=SquadLeader.prototype;
  这样Master就继承了SquadLeader类,就这么一句话,这里有两种形式,其实原理是一样的。意思是:将SquadLeader的“灵魂”拷贝给了Master,于是从此SquadLeader能做的事,Master都可以做了。
  测试一下:
var master=new Master();
master.hi()//输出“同学们好,我现在是班长了”  


  我个人比较喜欢用第一种方案(call 继承)来实现继承,所有代码都包在一个“{}”内,一目了然,在书写风格上较之于第二种更接近于C#。prototype 属性我一般用来对已有的类做扩展。

  JavaScript是门非常灵活的语言,实现继承可能还有其他更好的方式,大家可以去研究挖掘,我在这就当是抛了块砖头, 希望能引出华美的玉石!
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
2 週前 By 尊渡假赌尊渡假赌尊渡假赌
倉庫:如何復興隊友
4 週前 By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒險:如何獲得巨型種子
3 週前 By 尊渡假赌尊渡假赌尊渡假赌

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

C++ 函式繼承詳解:如何在繼承中使用「基底類別指標」和「衍生類別指標」? C++ 函式繼承詳解:如何在繼承中使用「基底類別指標」和「衍生類別指標」? May 01, 2024 pm 10:27 PM

C++ 函式繼承詳解:如何在繼承中使用「基底類別指標」和「衍生類別指標」?

C++ 中繼承和多態性如何影響類別的耦合度? C++ 中繼承和多態性如何影響類別的耦合度? Jun 05, 2024 pm 02:33 PM

C++ 中繼承和多態性如何影響類別的耦合度?

C++ 函式繼承詳解:如何偵錯繼承中出現的錯誤? C++ 函式繼承詳解:如何偵錯繼承中出現的錯誤? May 02, 2024 am 09:54 AM

C++ 函式繼承詳解:如何偵錯繼承中出現的錯誤?

探索Go語言中的物件導向編程 探索Go語言中的物件導向編程 Apr 04, 2024 am 10:39 AM

探索Go語言中的物件導向編程

PHP高階特性:物件導向程式設計的最佳實踐 PHP高階特性:物件導向程式設計的最佳實踐 Jun 05, 2024 pm 09:39 PM

PHP高階特性:物件導向程式設計的最佳實踐

Go語言的物件導向特性解析 Go語言的物件導向特性解析 Apr 04, 2024 am 11:18 AM

Go語言的物件導向特性解析

C++ 函式繼承詳解:什麼時候不該使用繼承? C++ 函式繼承詳解:什麼時候不該使用繼承? May 04, 2024 pm 12:18 PM

C++ 函式繼承詳解:什麼時候不該使用繼承?

Golang中有類似類別的物件導向特性嗎? Golang中有類似類別的物件導向特性嗎? Mar 19, 2024 pm 02:51 PM

Golang中有類似類別的物件導向特性嗎?

See all articles