typescript基礎(chǔ)知識

定義

  • JavaScript的超級類型,包含
    ES6;
  • 靜態(tài)類型語言,類型檢查,接口、oop非常完善;
  • 可以編譯成JavaScript在瀏覽器運(yùn)行

安裝

npm i typescript -g

tsc常用命令

  • tsc --init 初始化項目
  • tsc ./src/xxx.ts 編譯某個文件
  • tsc -w 檢測變化并編譯

tsconfig.json修改

{
  "compilerOptions": {
     "outDir": "./dist",         // 輸出目錄
    "rootDir": "./src",         //源文件目錄
}}

ts常見類型

  • boolean布爾類型
    let b:boolean=true;
  • number數(shù)字
    let num:number = 18;
  • string字符串
    let str:string = "我愛中國";
  • 數(shù)組
    let arr:number[] =[1,2,3,4];
    let arr2:Array<string> = ['我','喜','歡','你'];
    let arr3:any[]=["abc",456];
  • 對象object
let obj:Object={
    name:"安其拉",
    age:8
}
    
  • 任意any
    let notSure:any[]=["123","abc",456];
  • 沒有返回void
    function fun():void{};
  • null類型只能是null
    let n:null = null
  • undefined沒有定義
    let u:undefined =undefined

接口

  • 1.接口
    定義:
interface Person{
name:string,
age:number
}

實現(xiàn)接口:

let user  :Person = {
name:"含",
age:18
}

使用:

function fun(p:Person){
console.log(p);
}
fun(user);
  • 2.可選接口
    定義:
interface Person{
name?:string,
age?:number
}
  • 3.只讀接口
    定義:
interface Person{
readonle x:number,
readonle y:number
}

函數(shù)

  • 函數(shù)返回值
    function fun():void{}
    無返回值
    function fun():string{}
    返回字符串類型
    [一旦定義了返回類,在函數(shù)內(nèi)部必須要返回該類型]

  • 參數(shù)
    參數(shù)指定類型
    function add(a:number,b:number):number{xxxxx}
    參數(shù)可選
    function add(a:number,b?:number):number{xxxxx}
    參數(shù)默認(rèn)值
    function add(a:number,b:number=10):number{xxxxx}
    箭頭函數(shù)
    let add(a:number,b:number):number=>a+b

類--和ES6一致

  • 訪問修飾關(guān)鍵詞
    1.修飾詞既可以修飾屬性,也可以修飾方法
    public name:string;
    constructor(name:string){
        this.name = name;
    }

1.簡寫

class Animal{
    constructor(public name:string){
        this.name = name;
        private  sayHi(){xxx}
    }

3.public默認(rèn)修飾符,代表公開的
①class內(nèi)部可以訪問
②子類可以訪問
③實例也可以訪問

4.private私有的
①class內(nèi)部可以訪問
②子類不會繼承(不能訪問)
③實例不能訪問

5.protected保護(hù)的
①class內(nèi)部可以訪問
②子類會繼承,也可以訪問
③實例不能訪問

6.存儲器
[在設(shè)置或者訪問對象某個屬性時,可以做一些額外操作
實現(xiàn)的封裝,私有變量的隱藏]
步驟
①定義私有變量
private _age:number;
② 設(shè)置set
set age(val:number){ this._age = val; //可以寫其他邏輯 }
當(dāng)去實例age=xxx時候會被調(diào)用這個方法
③獲取get

get age():number{
return this._age;
}
當(dāng)執(zhí)行實例age時被調(diào)用

④實例化訪問設(shè)置屬性

let c = new Cat("花花",2);
c.age;  //get方法被調(diào)用
c.age=19;  //set方法被調(diào)用
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容