溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章主要為大家展示了JavaScript如何使用prototype屬性實現繼承，內容簡而易懂，希望大家可以學習一下，學習完之后肯定會有收獲的，下面讓小編帶大家一起來看看吧。
JS并沒有顯式的繼承語法,在JS中所有的對象都是Object的子類實現, 因而對象之間是平等關系.
盡管如此我們可以通過特殊的方法達到繼承的效果.
當然JS也不能直接定義類, 我們通過定義函數可以得到一個同名的類 , 同時這個函數就是這個類的構造器,
在定義函數時以this修飾的變量就是定義的 類的實例中的屬性,當這個屬性時函數時, 就可以認為這個屬性變成了一個實例方法
//定義一個Person類
function Person(name , age)
{
this.name=name;
this.age=age;
//定義一個info函數
this.info=function()
{
document.writeln("年齡"+this.age+"姓名"+this.name);
}
}
//創建Person類的實例對象
var p1= new Person('xiaoming',20);
//調用p1的info方法
p1.info();
var p2= new Person('wang',22);
p2.info();這種在類內(函數內)定義函數的方式是有弊端的:
為了避免這兩種情況, 通常不建議在類定義時為類定義方法,而是采用prototype屬性:
JS中所有類(函數)都有一個prototype屬性, 為該屬性增加屬性方法可以視為對類的拓展,
也就是增加了prototype屬性的類繼承了原有的類 , 這也就是JS所提供的偽繼承機制
//定義一個Person類
function Person(name , age)
{
this.name=name;
this.age=age;
//定義一個info函數
this.info=function()
{
document.writeln("年齡"+this.age+"姓名"+this.name);
}
}
//創建Person類的實例對象
var p1= new Person('xiaoming',20);
//調用p1的info方法
p1.info();
//為Person類增加walk方法
Person.prototype.walk=function()
{
document.writeln(this.name+'正在走<br/>');
}
var p2=new Person('xiaohong',20);
//p2可以調用Person中的方法
p2.info();
//也可以調用prototype屬性增加的方法
p2.walk();
//JS允許為類動態增加方法和屬性,這里p1也可以調用walk
p1.walk();上例為prototype屬性增加了方法可以認為是為Person類動態地增加了方法,
這種方式增加的方法會讓所有實例共享一個walk方法, 可以注意到是Person.prototype類的屬性,并非實例
walk方法不在Person函數內,因此不會產生閉包,
這種為類動態地增加屬性和方法可以被當作一種偽繼承,
但這種偽繼承并非產生 了新的子類而是修改了原有的類
別著急,prototype屬性還有另一種方式實現繼承:
prototype屬性代表該類原型對象, 即默認是一個Object對象, 將類prototype設為父類實例可以實現繼承
function Person(name,age)
{
this.name=name;
this.age=age;
}
Person.prototype.say=function()
{
console.log(this.name+'說話了');
}
var per = new Person('小明',20);
per.say();
//再定義一個student類,欲意繼承Person
function Student (grade)
{
this.grade=grade;
}
//將student的prototype設為Person對象
Student.prototype =new Person('小紅',22);
//為Student添加方法
Student.prototype.intro= function()
{
console.log(this.name+'是'+this.grade+'年級學生');
}
var stu=new Student(3);
stu.name="小剛";
console.log(stu instanceof Person&& stu instanceof Student);//true
stu.say();//小剛說話了
stu.intro();//小剛是3年級學生上例定義了Person類,增加了say()方法
又定義了Student類, 并將Student類的prototype屬性設為Person對象, 表明Student原型是Person對象,
也就是Student繼承了Person, 會得到其方法和屬性
以上就是關于JavaScript如何使用prototype屬性實現繼承的內容，如果你們有學習到知識或者技能，可以把它分享出去讓更多的人看到。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
