TypeScript學習筆記二 -- 類、介面、模組
阿新 • • 發佈:2018-11-03
類
class Person {
name;
eat() {
console.log('im eating');
}
}
var p1 = new Person(); // 類的例項化
p1.name = 'batman';
p1.eat(); // im eating
訪問控制符:
- public(預設): public的屬性和方法在類的內部和外部都可以被訪問到
- private: 在類的內部可以訪問,但是在類的外部不能被訪問到
類的構造方法
class Person {
constructor() { // 類的構造方法,只有在例項化的時候才會被呼叫一次
console.log('haha');
}
name;
eat() {
console.log(im eating);
}
}
var p1 = new Person();
// 構造方法裡面可以規範類例項化時的傳參等
class Person {
constructor(name: String) { // 類的構造方法,只有在例項化的時候才會被呼叫,並且只會呼叫一次
console.log('haha');
}
name;
eat() {
console.log (im eating);
}
}
var p2 = new Person(); // 報錯,例項化必須傳入name引數
var p2 = new Person('batman');
類的繼承
class Employee extends Person {
constructor(name: String, code: String) { // 例項化時必須傳進來兩個引數
super(name); // 子類的建構函式必須要呼叫父類的建構函式
this.code = code;
}
code: String;
work() {
super .eat(); // 通過super呼叫父類的eat方法
this.doWork(); // 呼叫當前類的work方法
}
private doWork() { // 將doWork方法宣告為私有方法,外部不能呼叫
console.log('im working');
}
}
// super關鍵字用來呼叫父類的建構函式
var el = new Employee('name', '1');
var el2 = new Employee('dby', '234');
el2.work();
// im eating
// im working
el2.doWork(); // 報錯,外部不能訪問doWork私有方法
==note: 子類的建構函式必須要呼叫父類的建構函式(super)==
泛型(generic)
引數化的型別,一般用來限制集合的內容
var workers: Array<Person> = [];
// 尖括號中的Person型別就是這個陣列的泛型,規定了陣列中只能放Person型別
workers[0] = new Person('zhangsan');
workers[1] = new Person('lisi');
workers[2] = 1; // 報錯
介面(Interface)
用來建立某種程式碼約定,使得其他開發者在呼叫某個方法或建立新的類時必須遵守介面所定義的程式碼約定
介面使用方式:
- 宣告一個介面
// 宣告一個介面
interface Iperson{
name: string,
age: number,
}
class Person {
constructor(public config: Iperson) { // 在例項化Person類的時候,必須傳入一個滿足介面型別的引數
}
}
var p1 = new Person({
name: 'zhangsan', // 滿足介面宣告屬性要求
age: 23,
});
- 介面用來申明方法
interface Animal { // 動物介面
eat() {
}
}
class Sheep implements Animal { // implements宣告sheep類實現Animal介面
// 當一個類實現一個介面時必須實現介面中宣告的方法,否則報錯
eat() {
console.log('sheep實現animal介面');
}
}
==note: 當一個類實現一個介面時必須實現介面中宣告的方法==
模組
模組將程式碼分割成可重用的單元,開發者可以自行決定將模組中的哪些資源(類、方法、變數)暴露出去供外部使用,哪些資源只在模組內部使用。
- export: 對外暴露
// a.ts
export var prop1; // 對外暴露prop1屬性
var prop2; // 不對外暴露
export function func1() {} // 對外暴露func1方法
function func2() {}
export class Clazz1 {}
class Clazz2 {}
// b.ts
import {prop1, func1} from './a';
console.log(prop1);
func1(); // 呼叫a.ts模組中對外暴露的方法
一個模組既可以通過export對外暴露自己的屬性和方法,也可以通過import引入其他模組的屬性和方法
註解
註解為程式的元素(類、方法、變數)加上更直觀明瞭的說明,這些說明資訊與業務邏輯無關,而是供指定的工具或框架使用的。
型別定義檔案(*.d.ts)
型別定義檔案用來幫助開發者在TypeScript中使用已有的Js工具包,如jquery
工具: https://github.com/typings/typings
用來安裝.d.ts檔案