typeScript

yarn init --yes//创建
yarn add typescript --dev //安装
yarn tsc 01-typescript.ts
yarn tsc --init //配置文件
标准库是内置对象所对应的声明文件
ts 变量作用域问题,不同的文件相同的变量名称,

(function(){
//把内容放到这个立即执行函数中
})()
或者使用  export {}

Object 类型

 // 以下用ts来表示typeScript
// 在ts中 Object类型泛指 所有的非原始类型也就是对象、数组、函数
// Object类型
export{}//输出成一个模块 确保和其他没有冲突

//注意这里的object是纯小写的,这里的object类型不单单代表对象类型
const foo:object = {}//[]//function(){}
//如果我们需要一个普通的对象类型
const faa:{foo:number,bar:string} = {foo:123,bar:'123'}
//更好的定义对象类型的方式是使用接口

数组类型

//数组类型
export{}
//在ts中有俩种方式定义数组类型
const arr1:Array<number> = [1,23,4]
const arr2:number[] = [12,35,5]
//------------------------------------------------------在这里插入代码片
//在没有类型注解的时候,我们需要判断传入的参数是否是数字
function sum(...args:number[]){
    return args.reduce((prev,current)=>prev+current,0)
}
sum(1,2,45)

Tuple元组类型

//元组类型
export{}
//固定长度的数组
const tuple:[number,string] = [12,'12']
//可以通过下标来获取
const a =tuple[0]
//通过数组解构方式获取
const [age,bar] = tuple
console.log(age,bar)

枚举类型

//枚举类型 Enum
export {}
// enum PostStatus {
//     Draft=0,
//     Unpublished=1,
//     Published=2,
// }
// 如果是数字型枚举会自增长
// enum PostStatus {
//     Draft=6,
//     Unpublished,
//     Published,
// }
//字符串枚举,不能自增长,所以需要全部定义
// enum PostStatus {
//     Draft='212',
//     Unpublished='1',
//     Published=1,
// }
//枚举类型会影响我们编译后的代码  建议使用常量枚举
const enum PostStatus {
    Draft='212',
    Unpublished='1',
    Published=1,
}
// 这里的status是一个固定切换的值,js中并没有这种对象,一般都是模拟一个对象来使用,在ts中有专门的枚举类型来处理这种情况
const con = {
    title:'122121',
    content:'11111111111111111111111111111111111111111222222222222222',
    status:PostStatus.Draft//2//1//0
}

函数类型

export {}
//函数类型

//声明式函数
// 参数的类型放到参数后面,返回值类型放到参数括号之后
// function fun1(a:number,b:number):string{
//     return 'fun1'
// }
// fun1(100,200)//这里参数的个数也是固定的,类型必须是数字
// 也可以通过参数后面加问号变成可选参数,或者设置参数默认值  但是必须放到参数的最后
// function fun1(a:number,b?:number):string{
//     return 'fun1'
// }
// function fun1(a:number,b:number=1):string{
//     return 'fun1'
// }
// 如果要接收任意个数的参数  可以使用es6 rest操作符
function fun1(a:number,b:number=1,...rest:number[]):string{
    return 'fun1'
}
//-----------------------------------------
// 函数表达式  
// 利用以下方法定义变量的类型
const fun2:(a: number, b?: number, ...rest: number[]) => string = function(a:number,b:number=1,...rest:number[]):string{
    return 'fun1'
}

Any类型

export {}
//任意类型   弱类型
function aaa(value:any){
    return JSON.stringify(value)
}
aaa(100)
aaa('stri')
aaa(null)
// 这里any类型可以接收任意类型。语法上都不会报错
//any类型不安全

隐式类型推断

export{}
let a = 18//number
// a='111'//会报错
let foo
foo ='11'
foo =11
// 虽然隐式类型推断可以帮我们省略一部分代码,但是为了代码的可阅读性尽量在添加类型注解

接口

//接口
export{}
//这里使用分号(;)分隔 可省略
interface Post{
    title:string
    content:string
    subtitle?:string//加问号代表可选
    readonly summary:string// 只读 成员

}
function foo(post:Post){
    console.log(post.title)
    console.log(post.content)
}
// foo({
//     title:'111111111',
//     content:'hhhhhhhhhhhhhhhhhhhhhhhh'
// })
//编译后 并不会出现接口的定义,只是为约束有结构的数据类型做的
//*------------------------------------
// 动态成员
interface hhh{
    [key:string]:string
}
const abc:hhh = {}
abc.f = '111'
abc.b = '222'

class 类和类的修饰符

export{}
class person {
    //可以在这里给赋值默认值,也可在执行器中动态赋值二选一不然报错
    public name:string //='swh'  public代表公有成员 默认值
    private age:number //private 代表私有属性
    protected readonly gened:boolean //protected 代表受保护的 只允许在子类中访问 readonly代表只读属性,如果已有修饰符,需要放到修饰符之后
    constructor(name:string,age:number){
        //使用前必须先声明
        this.name = name
        this.age = age
        this.gened =true
    }
    sayHi(msg:string):void{
        console.log(`${this.name},${msg}`)
        console.log(this.age)
    }
}
class student extends person{
    private constructor(name:string,age:number){//关于构造函数的修饰符
        super(name,age)
        // console.log(this.age)//不能访问age属性
        console.log(this.gened)//可以访问
    }
    static yoo(name:string,age:number){
        return new student(name,age)
    }
}
const aaa = new person('swh',19)
console.log(aaa.name)
// console.log(aaa.gened)
// console.log(aaa.age)//在外部访问私有属性会报错
// const bbb =new student()//报错访问不到
const bbb = student.yoo('swh',12)

类与接口

export{}
//类与接口
interface eat{
    eat(food:string):void
}
interface run{
    run(distance:string):void
}
class ren implements eat{
    eat(food:string):void{
        console.log(`吃${food}`)
    }   
    run(distance:string):void{
        console.log(`怎么跑?${distance}`)
    }
}
class dongwu implements eat,run{
    eat(food:string):void{
        console.log(`吃${food}`)
    }   
    run(distance:string):void{
        console.log(`怎么爬?${distance}`)
    }
}

抽象类

 export {}
abstract class Animal {//定义抽象类的关键词  abstract
    eat(food:string):void{
        console.log(`hhh${food}`)
    }
    abstract run(distance:number):void
}
// const dongwu =new Animal()//抽象类之后不能直接创建
class Dog extends Animal{
    run(distance: number): void {
        console.log('跑跑跑',distance)
    }

}
const dog =new Dog()
dog.eat('mian')
dog.run(20)

泛型

//泛型
//在创建的时候不去指定类型,在使用的时候在指定
function arr(length:number,value:number):number[]{
    // const arr1 = Array(length).fill(value)//这里的Array就是一个泛型需要在使用的时候指定类型
    const arr1 = Array<number>(length).fill(value)
    return arr1
}
const res = arr(5,100)//这样只能创建 一个全是数字的数组
// 如果我们需要创建一个字符串的数组 最笨就是复制一个,但是这样 代码会有冗余
function arr2(length:number,value:string):string[]{
    const arr3 = Array<string>(length).fill(value)
    return arr3
}
//-------------------------------------
function arrall<T>(length:number,value:T):T[]{
    const arr3 = Array<T>(length).fill(value)
    return arr3
}
const all = arrall<string>(5,'100')
const all2 = arrall<number>(5,50)
console.log(all,all2)
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值