1、TypeScript 類
一闷游、類的基本構(gòu)成
類里面有有兩個部分 1峻汉、屬性 ? 2、方法
//class 定義一個 City 類
class City{
1脐往、聲明實例屬性
name: string;
clevel: number;
在屬性前使用 static 關(guān)鍵字定義類屬性(靜態(tài)屬性)
static country = "中國";
在屬性前面加上readonly休吠,屬性會變成只讀屬性,只能讀取不能修改业簿。
readonly provice = "湖南";
//constructor 構(gòu)造函數(shù)
//構(gòu)造函數(shù)會在對象創(chuàng)建時調(diào)用
constructor(name: string, clevel: number){
this.name = name;
this.clevel = clevel;
}
//一般方法
about(){
//about方法放在了哪里? -類的原型對象 上瘤礁,供實例使用
//about中的this就是Person實例
consloe.log(this)
console.log(`歡迎來到${this.name},長沙是${this.clevel}級城市`);
}
static hello(){
console.log("你好,長沙梅尤。")
}
}
創(chuàng)建對象的實例
const c1 = new City("長沙", 1);
console.log(c1.name);
console.log(c1.provice);
c1.about();
//class中的方法默認開啟了局部的嚴格模式柜思,所以about中的this為undefined
const quanju = c1.about;
quanju();
console.log(City.country);
City.hello();
1.1、定義屬性
直接定義的屬性是實例屬性克饶,需要通過對象的實例去訪問
const c1 = new City("長沙", 1);
c1.name;
在屬性前使用 static 關(guān)鍵字定義類屬性(靜態(tài)屬性),直接通過類訪問酝蜒。
City.country;
1.1、定義方法
直接定義的方法是實例方法矾湃,需要通過對象的實例去訪問
const c1 = new City("長沙", 1);
c1.about();
在屬性前使用 static 關(guān)鍵字定義類方法(靜態(tài)方法),直接通過類訪問亡脑。
City.hello();
二、類的繼承簡介(extends)和 super關(guān)鍵字
(function(){
// 定義一個動物的類
class Animal{
name: string;
age: number;
constructor(name: string, age: number){
this.name = name;
this.age = age;
}
say(){
console.log("動物在叫");
}
}
/**
* class Dog extends Animal
* 此時 Animal 被稱為父類邀跃,Dog 被稱為子類
* 繼承父類后霉咨,子類會擁有父類所有的屬性和方法
* 通過繼承我們可以把多個類中共有的代碼寫在一個父類中
* 這樣只需要寫一次就能讓所有的子類擁有父類的屬性和方法
*/
// 定義一個狗類
// 使 Dog 類繼承 Animal 類
class Dog extends Animal{
height: number;
width: number;
constructor(name: string, age: number, height: number, width: number){
/**
* 在子類中寫了構(gòu)造函數(shù),則在子類的構(gòu)造函數(shù)中必須調(diào)用 父類 的構(gòu)造函數(shù)(通過super調(diào)用)
*/
super(name, age);//調(diào)用父類的構(gòu)造函數(shù)
this.height = height;
this.width = width;
}
run(){
console.log(`${this.name},在愉快的奔跑拍屑。`);
super.say();//調(diào)用父類的方法
};
/**
* 如果子類中添加了和父類相同的方法途戒,則子類的方法會覆蓋父類的方法
* 這種子類覆蓋掉父類的形式,我們稱之為方法的重寫
*/
say(){
console.log("汪汪汪---")
};
}
// 定義一個貓類
// 使 Cat 類繼承 Animal 類
class Cat extends Animal{
say(){
console.log("喵喵喵---")
};
}
let dog = new Dog("旺財", 4, 80, 100);
console.log(dog);
dog.say();
dog.run();
let cat = new Cat("菲菲", 3);
console.log(cat);
cat.say();
})();
三僵驰、抽象類
(function(){
// 定義一個動物的類
/**
* 以 abstract 開頭的類就是抽象類
* 抽象類和其他的類差別不大喷斋,只是不能用來創(chuàng)建對象
* 抽象類就是專門用來繼承的類
* 抽象類中可以添加抽象方法
*/
abstract class Animal{
name: string;
age: number;
constructor(name: string, age: number){
this.name = name;
this.age = age;
}
/**
* 定義一個抽象方法
* 抽象方法使用 abstract 開頭,沒有方法體
* 抽象方法只能定義在抽象類中蒜茴,子類必須對抽象方法進行重寫
*/
abstract say(): void;
}
// 定義一個狗類
class Dog extends Animal{
height: number;
width: number;
constructor(name: string, age: number, height: number, width: number){
super(name, age);//調(diào)用父類的構(gòu)造函數(shù)
this.height = height;
this.width = width;
}
say(){
console.log("汪汪汪---")
};
}
let dog = new Dog("旺財", 4, 80, 100);
console.log(dog);
dog.say();
})();
四星爪、接口
(function(){
/**
* 接口用來定義一個類結(jié)構(gòu),用來定義一個類中應(yīng)包含那些屬性和方法
* 接口定義類的時候限制了類的結(jié)構(gòu)
* 屬性: 接口中所有的屬性都不能有實際的值
* 接口只定義對象的結(jié)構(gòu)粉私,而不考慮實際值
* 方法: 接口中所有的方法都是抽象方法
*/
interface myInter{
name: string;
say(): void;
}
/**
* 定義類時可以實現(xiàn)接口
* 實現(xiàn)接口就是使類滿足接口 定義的類結(jié)構(gòu)
*/
class MyClass implements myInter{
name: string;
constructor(name: string){
this.name = name;
}
say(): void{
console.log("大家好M缣凇!诺核!")
}
}
})();
五抄肖、屬性的封裝
(function(){
// 定義一個人類
class Person{
/**
* TS 可以在屬性前添加屬性修飾符
* public 修飾的屬性可以在任意位置訪問(修改) 默認值
* private 私有屬性久信,只能在類內(nèi)部進行訪問(修改)
* 通過在類中添加方法,使得私有屬性可被外部訪問
* protected 受保護的屬性漓摩,只能在當(dāng)前類和當(dāng)前類的子類中訪問(修改)
*/
private _name: string;
private _age: number;
protected height: number
constructor(name: string, age: number, height: number){
this._name = name;
this._age = age;
this.height = height;
}
// 定義一個方法,用來獲取 age 屬性
getAge(){
return this._age;
}
// 定義一個方法,用來設(shè)置 age 屬性
setAge(age: number){
if(age >= 0){
this._age = age;
}
}
// TS中 getter 的方式獲取屬性
get name(){
return this._name;
}
// TS中 setter 的方式獲取屬性
set name(name: string){
this._name = name;
}
}
class Students extends Person{
getHeight(){
return this.height;
}
}
let stu = new Students("學(xué)生", 18, 176);
console.log(stu.getHeight())
/**
* 現(xiàn)在屬性值是在對象中設(shè)置的裙士,屬性值可以任意的的被修改
* 屬性值可以任意被修改將會導(dǎo)致對象中的數(shù)據(jù)非常不安全
*/
let per = new Person("LBipanda", 18, 178)
console.log(per);
per.getAge();
per.setAge(22);
console.log(per.name);
console.log(per.name = "wudi");
})();