中文網(wǎng):https://www.tslang.cn/
官網(wǎng):http://www.typescriptlang.org/
目錄:
- Typescript 學習筆記一:介紹、安裝地粪、編譯
- Typescript 學習筆記二:數(shù)據(jù)類型
- Typescript 學習筆記三:函數(shù)
- Typescript 學習筆記四:回憶Es5 中的類
- Typescript 學習筆記五:類
- Typescript 學習筆記六:接口
- Typescript 學習筆記七:泛型
最簡單的類
function Person (name, age) { // 構造函數(shù)
this.name = name; // 屬性
this.age = age;
}
var p = new Person('張三', 25); // 實例化對象,p 為 Person 的一個實例
console.log(p.name);
函數(shù)名首字母大寫宰译,函數(shù)內用 this 處理的函數(shù)稱為構造函數(shù)檐蚜。
用 new 關鍵字實例化構造函數(shù)的變量是該構造函數(shù)的實例。
類定義屬性和方法
可以在構造函數(shù)和原型鏈上定義屬性和方法沿侈。
function Person (name, age) {
// 構造函數(shù)內定義屬性和方法
this.name = name; // 實例屬性
this.age = age;
this.run = function () { // 實例方法
console.log(this.name + '在運動');
}
}
// 原型鏈上定義屬性和方法
Person.prototype.sex = '男';
Person.prototype.work = function () {
console.log(this.name + '在工作');
}
var p = new Person('張三', 25);
p.run(); // 調用實例方法
p.work();
原型鏈上面的屬性會被多個實例共享闯第,構造函數(shù)里的屬性不會
類的靜態(tài)屬性和方法
直接給構造函數(shù)設置屬性和方法,不需要實例化即可獲得的缀拭。
構造函數(shù)內的屬性和方法咳短,原型鏈上的屬性和方法都需要實例化之后才可獲得。
function Person (name, age) {
// 構造函數(shù)內定義屬性和方法
this.name = name; // 屬性
this.age = age;
this.run = function () { // 方法
console.log(this.name + '在運動');
}
}
// 靜態(tài)屬性蛛淋、方法
Person.address = 'xxx';
Person.getInfo = function () {
console.log('靜態(tài)方法');
}
// 調用
console.log(Person.address);
Person.getInfo();
Person.run(); // 錯誤咙好,只有實例對象才可調用
var p = new Person();
p.run();
繼承:對象冒充實現(xiàn)
對象冒充可以繼承構造函數(shù)里面的屬性和方法,但是沒法繼承原型鏈上面的屬性和方法
// 父類
function Person (name, age) {
this.name = name;
this.age = age;
this.run = function () {
console.log(this.name + '在運動');
}
}
Person.prototype.sex = '男';
Person.prototype.work = function () {
console.log(this.name + '在工作');
}
// 子類繼承父類
function Child () {
Person.call(this); // 對象冒充實現(xiàn)繼承
}
var c = new Child('張三', 25);
c.run();
c.work(); // 錯誤褐荷,沒有 work 方法
繼承:原型鏈實現(xiàn)
原型鏈繼承:可以繼承構造函數(shù)里面的屬性和方法勾效,也可以繼承原型鏈上面的屬性和方法。但是實例化子類的時候沒法給父類傳參叛甫。
// 父類
function Person (name, age) {
this.name = name;
this.age = age;
this.run = function () {
console.log(this.name + '在運動');
}
}
Person.prototype.sex = '男';
Person.prototype.work = function () {
console.log(this.name + '在工作');
}
// 子類繼承父類
function Child (name, age) {
}
Child.prototype = new Person(); // 原型鏈實現(xiàn)繼承
var c = new Child('張三', 25);
c.run(); // undefined 在運動
c.work(); // undefined 在工作
繼承:原型鏈+對象冒充的組合繼承模式
原型鏈繼承:可以繼承構造函數(shù)里面的屬性和方法层宫,也可以繼承原型鏈上面的屬性和方法。但是實例化子類的時候沒法給父類傳參合溺。
// 父類
function Person (name, age) {
this.name = name;
this.age = age;
this.run = function () {
console.log(this.name + '在運動');
}
}
Person.prototype.sex = '男';
Person.prototype.work = function () {
console.log(this.name + '在工作');
}
// 子類繼承父類
function Child (name, age) {
Person.call(this, name, age); // 對象冒充繼承卒密,實例化子類可以給父類傳參
}
Child.prototype = new Person(); // 原型鏈實現(xiàn)繼承,繼承原型鏈上的屬性和方法
// 或者
// Child.prototype = Person.prototype; // 原型鏈實現(xiàn)繼承棠赛,繼承原型鏈上的屬性和方法
var c = new Child('張三', 25);
c.run(); // 張三在運動
c.work(); // 張三在工作