文章目錄

• • TS基礎1（類型定義、接口）-學習筆記
  • • 什么是TS

TS基礎1（類型定義、接口）-學習筆記

什么是TS

//ts用法var n:number = 10;let str:string = '10';let str2:string = 'abc';let str3:string = `hello ${str2}`;let flag:boolean = true;let u:undefined = undefined;let nu:null = null;//類型定義后，不允許類型改變var a:string = '10';// a = 10; error//任意值(Any) 用來表示允許賦 值為任意類型var a2:any = '10';a2 = 10;a2 = true;//變量如果在聲明的時候，未指定其類型，會被識別為任意值var a3;a3 = 'abc';a3 = 10;// 10, '10' //聯合類型 可以為多種類型中的一種var a4:string | number;a4 = 10;a4 = '10';//注意！！！！ 訪問的是聯合屬性共有的屬性中方法function getLength(str:string | number): number{return str.length};getLength(a4)//正確的寫法// function getLength2(str:string | number[]): number{// return str.length// };// getLength2([1,2,3])//數組 有多種定義方式//最簡單的方式 類型+方括號 來表示數組var arr:number[] = [1,2,3,9];var arr2:string[] = ['a','b','c'];var arr3:any[] = ['a',2,true,[1,2]];//對象的類型 —— 接口//接口（Interfaces）可以用于對「對象的形狀（Shape）」進行描述。//規范//接口首字母大寫interface Person {name: string;age: number;};//對象受到接口的約束var tom: Person = {name:'tom',age:20};//定義的變量比接口少了屬性是否允許 ——不允許var tom2: Person = {name:'tom'};//定義的變量比接口多了屬性是否允許 ——不允許var tom3: Person = {name:'tom',age:20,sex:'男'};//可選屬性 希望接口中有可選屬性interface Person2 {name: string;age?: number; //age屬性是可選屬性}var tom4: Person2 = {name:'tom'};var tom5: Person2 = {name:'tom',age:20};//可選屬性只針對于當前設置的屬性，仍然不能添加其它屬性// var tom6: Person2 = {// name:'tom',// age:20,// sex:'男'// };//任意屬性 接口中添加一個任意的屬性interface Person3 {name: string; //age?: number; //age屬性是可選屬性[propName: string]: any; //任意屬性 }//注意：寫入了任意屬性[propName: string] 那么確定屬性和可選屬性必須是它的子屬性var tom7: Person3 = {name:'tom',age:20,sex:'男',};//函數類型 輸入和輸出的約束//函數聲明function f1(x: number,y: number): number{ //(x: number,y: number) 輸入約束 : number 輸出的約束return x+y}f1(1,1);//函數表達式var f2 = function(x: number,y: number): number{return x+y};//能否允許傳多、少參數--不允許function f3(x: number,y: number): number{ return x+y}//f3(1,1,5);//f3(1);//參數默認值function f4(x: number= 5,y: number): number{ return x+y};//參數可選 //注意！！！ 可選參數必須接在必需參數后面//換句話說：可選 參數后面不允許再出現必需參數function f5(x: number= 5,y?: number): number{ if(y){return x+y;}else {return x;}};f5(10);//f5(10,10); //OK

補充：

//類型別名 typetype n = number;function f(i:n): n{return i};let n2: n = 100;//聯合類型別名type a = string | number[];var x1:a = [2];var x2:a = '111';//var x3:a = 222; //error

總結

以上是生活随笔為你收集整理的TS基础1（类型定义、接口）-学习笔记的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。