typeScript常用的12个知识点
今天初步学习了解了下TS的语法
1.静态类型 也可以通过 interface 的方式自定义一个类型
let one: String = '1'; interface type1 { name:String, age:number, arr?:a[], } type a ={ name:string, age:number } let two: type1 = { name:'haahh', age:1, }; 复制代码
2.基础静态类型 和 对象 数组 静态类型 函数类型
let jingtai: number = 1; let duixiang :{name :string} = {name:'1'}; let shuzu : string [] = ['1','2']; // 表示 数组中的每一项必须是一个string类型 let hanshu :()=>string = ()=>{return '1'}; // 表示 需要一个方法 方法中必须return出一个string类型 复制代码
3.类型注解 类型判断
any表示任何类型 function getTotal (one, two ){ return one + two; } 复制代码
4.函数参数 和 返回类型的注解
function getTotal1 (one:number, two:number ):Number{ return one + two; //表示函数的返回类型是 number } const total = getTotal(1,2); // void表示 没有返回值 // never 死循环 执行不完的返回值 function number1 ({one}:{one:number}){ return one } const number2 = number1({one:1}) // 方法中的对象定义类型 {one}:{one:number}; 复制代码
5.数组类型的注解
let numberArr:number[] = [1,2,3]; let strNumArr:(number | string)[] = [1,'2']; // type name 类型别名 可以用type来定义一个类型 type Lady = {name:string , age:number}; let objArr:Lady[] = [{name:'小龙',age:20}]; 复制代码
6.元组的使用(不常用)
let yuanzu:[number,string,number] = [1,'2',3] ; 复制代码
7.接口 interface 的使用
伪原创工具 SEO网站优化 https://www.237it.com/
interface leixing { name:string, age:number, sex?:string, //加个问号表示 sex这个key可有可无 [propname:string]:any, //表示我可以添加任意一项 key是string类型 value是任何类型的 } let leixin1:leixing = { name:'小龙', age:18, }; function leixin2(leixin1){ console.log(`${leixin1.name}今年${leixin1.age}岁了`); } // implements属性 用于限制类的类型 class ren implements leixing { name = '小龙'; age = 18; } // extends 用于继承某一个类型 interface teacher extends leixing{ zhiye:string } 复制代码
8.类的概念和使用
class nanren { name = 'xiaolong'; say(){ return `我叫${this.name}` } } // 类的继承 class nuren extends nanren{ sex='女' }; // 类的重写 super关键字 class nuren1 extends nanren{ name = super.name + '啊' }; let nanren1 = new nanren(); console.log(nanren1.say()) // 类的访问类型 class Pessom { public name:string; //内外都可以使用 private age = 18; //表示私有类只可以在类的里边使用 也不允许继承里边使用的 protected sex(){ //不可以在类的外部使用 可以在继承的类里边调用 return 'nan'; } } let Pessom1 = new Pessom(); Pessom1.name = 'xiaolong' //表示类的外边使用 // 类的构造函数 class ren2{ // name:string; // constructor(name:string){ //constructor表示构造函数 需要在new的时候传个参数 // this.name = name; // } constructor(public name:string){}; //等同于上侧代码 } let ren2class = new ren2("xiaolong") // 子类继承父类里边的构造函数 class teacher1 extends ren2{ constructor(public age:number){ super('xiaolong') //子类继承父类的构造函数需要用 super('name') } } // 类的Get Set 类里边定义的私有key可以在外边访问 class renmen{ constructor(private _age:number){} get age(){ return this._age //可以在里边进行操作 } set age (age:number){ this._age = age //可以在里边进行操作不用return } } // 类的静态类 static 可以不用new直接在外边输出 class renmen1 { static name1:string = 'xiaolong' } console.log(renmen1.name1); //类的只读属性 readonly 表示类里边的属性只可以赋值一次 class renmen2 { readonly name:string; constructor(name:string){ this.name = name; } } let ren5 = new renmen2('小龙'); // ren5.name = 'hahah' 再赋值的时候就会报错 // 抽象类 abstract abstract class chouxian{ abstract ren(); //因为是抽象类所以里边不用写任何方法,但是在子类继承的时候 需要写ren这个方法 } class zichouxian extends chouxian{ ren(){ console.log('你是个人') } } 复制代码
9.联合类型和类型保护
interface lianhe1{ sex:string } interface lianhe2{ age:number } function lianhe(data:lianhe1 | lianhe2){ //这个便是联合类型 // 类型保护便是里边的判断方法 } 复制代码
10.Enum枚举类型 数据中的下标是从0开始的
enum data{ diyibu, //如果想要改变里边的默认下标需要 dayibu = 1,之后的下标依次类推 dierbu, disanbu } console.log(data.diyibu) //0 复制代码
11.泛型 一般用T来表示
function fangfa<fanxing>(one:fanxing , two:fanxing){ return `${one}${two}` } fangfa<number>(1,2); // 调用的时候 number === fanxiang function fanxingArr<T>(params:T[]){ console.log(params) }; fanxingArr<string>(['1']); //调用的时候传string就是数组中的每一项必须是string类型的 // 类中使用泛型 泛型也可以继承 interface one1{ name:string } class leifanxing<T extends one1> { //泛型T继承于one1所以给girls传值的时候只能传one1类型的参数 constructor (private girls:T[]){}; getGirls(index:number):string{ return this.girls[index].name } } const girlsArr = new leifanxing([{name:'xiaolong'},{name:'xiaohong'}]); girlsArr.getGirls(1); 复制代码
12.ts的命名空间 模块化
namespace home{ class one{ } class two{ } class three{ } export class big{ constructor(){ new one(); new two(); new three() } } } // 变成home中私有的类 不会全局污染
作者:wh1e3
链接:https://juejin.cn/post/7034508542102994974