TypeScript笔记

24 篇文章 0 订阅
2 篇文章 0 订阅

1.联合类型


let a: "male" | "female"
a="male"

let b:number | string
b=123
b="aaa"

2.any与unknown

let a:any
let b:unknown
let s:string

a=10
s=a
b="sdsdsd"
//unknown实际上就是一个类型安全的any
//unknown类型的变量不能直接赋值给其他变量,需要先经过类型判断,或者类型断言
if(typeof b==="string"){
    s=b
}
//断言,可以用来告诉解析器变量的实际类型
s=b as string
s=<string>b

3.never

//never 永远没有返回结果
function fn():never{
    throw new Error("error")
}

3.函数与对象类型

let o:{name : string,[propName : string]:string}
o={name : "123",str : "sddfff"}

let f:(a:number,b:number)=>number
f=function(n1:number,n2:number){
    return n1+n2
}

4.数组类型

let a:string[]
a=["a","cc","dd","dd"]
let c:Array<string>
c=["a","bbb"]

5.元组类型

元组即固定长度的数组

let a:[string,number]=["ss",123]

6.枚举

enum Gender{
    male=0,
    female=1
}

let i:{name:string,gender:Gender}
i={
    name: "aa",
    gender:Gender.female
}

console.log(i.gender===Gender.male);

7.与类型

let a:{name : string} & {age:number}
a={name : "aaa",age : 123}

8.类型别名

type myType=1|2|3|4|5

let a:myType=2
let b:myType=5

9.自动编译

当前目录下建立tsconfig.json

{}

命令行:tsc -w,当前目录及所有子目录内所有ts文件热编译

10.编译选项

{
    //指定哪些文件需要被编译,1个*代表任意文件,2个*代表任意目录
    // "include": [
    //     "./src/**/*"
    // ],
    //不需要被编译的目录,默认值:["node_modules","bower_components","jspm_packages"]
    "exclude": [
        "./src/test/**/*"
    ],
    //要继承的配置文件
    //"extends": "./config/base",   
    //指定被编译的文件列表,只要需要编译的文件较少时才会用到
    //"files": ["a.ts","b.ts","c.ts"],
    //编译选项是配置文件中非常重要也比较复杂的配置选项
    "compilerOptions": {
        //设置ts代码编译的目标版本,可选值:ES3,ES5,ES6/ES2015...
        "target": "ES5",
        //指定编译后要使用的模块化的规范
        "module": "system",
        //指定项目中要使用的库,一般不需要配置
        //"lib": ["DOM"]
        //编译后文件所在的目录
        "outDir": "./dist",
        //将全局作用域中的代码合并到同一个文件中
        "outFile": "./dist/app.js"
        //是否允许编译js文件
        "allowJs": true,
        //检查js文件语法是否符合ts规则
        "checkJs": true,
        //是否移除注释
        "removeComments": false,
        //是否生产编译文件,用于只检查ts语法
        "noEmit": false,
        //有错误时不编译
        "noEmitOnError": true,
        //所以严格检查总开关
        "strict": true,
        //编译后是否是严格模式
        "alwaysStrict": true,
        //不允许隐式any类型
        "noImplicitAny": true,
        //不允许不明确类型的this
        "noImplicitThis": false,
        //严格检查空值
        "strictNullChecks": false
    }
}

11.抽象类,接口

abstract class Movie{
    name:string

     constructor(name:string){
        this.name=name
     }

    abstract getPlayers():void
}

class War extends Movie{
    age:number

    constructor(name:string,age:number){
        super(name)
        this.age=age
    }

    getPlayers(){
        console.log(`${this.name}`);
    }
}

let dkek=new War("敦刻尔克",4)
dkek.getPlayers()

//接口的所有属性都是抽象属性,所有方法都是抽象方法
interface MyMovie{
    name:string
    age:number

    getPlayers():void
}

class MyLike implements MyMovie{

    name:string
    age:number

    constructor(name:string,age:number){
        this.name=name
        this.age=age
    }

    getPlayers(){
        console.log("喜欢的电影");
        
    }
}

const gqs=new MyLike("钢琴师",5)

gqs.getPlayers()

12.泛型



function fn<T>(a:T):T{
    return a
}

let s1=fn(10)

console.log(fn<string>("ssss"));

//可以同时指定多个泛型
function fn2<T,K>(a:T,b:K):T{
    console.log(b);
    
    return a
}

let s3=fn2("流浪地球",true)

interface Inter{
    length:number
}

//泛型T必须是Inter的实现类或者子类
function fn3<T extends Inter>(a:T):number{
    return a.length
}

let s4=fn3({a:333,length:341})
console.log(s4);

class MyClass<T>{
    name:T
    constructor(name:T){
        this.name=name
    }
}

let s5=new MyClass<string>("1900")

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

y_w_x_k

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值