TypeScript基础01

TypeScript

类型

类型的顺序

• 顶级类型(top type) ==> any、unknow
• Object
• Number String Boolean
• 1 "str" false
• never

基础类型

• 1. 基础类

/* 
常用变量类型：
number、string、boolean、null、undefined
*/
let value:类型=值

/* 
void类型：
表示没有返回值，一般用于函数
*/

function Fn():void{
    // 没有返回值，函数不能有return值
}

• 2. Object类型

/* 大写Object类型包含所有类型 */
let obj:Object=1213
/* 小写object 支持引用类型，非原始类型 */
// let ob:object="1213"  error
// let ob:object= 6666 error
// let ob:object=false error
let ob:object=[] // [] ,{} ,()=>{} 引用类
/* 字面量{} */
// 但是对于字面量定义的对象，属性无法增加和删除，相当于定义了一个常量
let nn:{}="" // 字面量类型支持所有类型

任意类型

/* any 任意类型 */
let a:any=[];
a=1;
a="jjjj";

/* unknow 未知类型 */
let b:unknow=5
let c:str="pp"
// 1. unknow 只能赋值给自身或者any
// c=b  error
// 2. unknow 类型不可读取任何属性，方法也不可调用
let k:unknow={
    key:'66',
    fn:()=>console.log(333)
}
// k.key key.fn()  error
// 3. unknow 比any对象更安全

接口和对象

1. 对象类型

/* interface */
// 1. 重名会重合
interface Aaaa{
    name:string
    age:number
}
interface Aaaa{
    isIkun:boolean
}
// 2. 任意key 索引签名

interface Bbbb{
    [propName:string]:any  // 类型不能写死，不然会对所有其他属性进行校验
}
// 3. ？ readonly

interface Cccc{
    type?:number // 可选参数
    readonly cb:()=>boolean  // readonly只读修饰符
}

// 4. 接口继承

interface Dddd extend Cccc{
    name:string
    // 继承得来
    type?:number // 可选参数
    readonly cb:()=>boolean  // readonly只读修饰符
}

// 5. 定义函数类型

interface Fn{
    (name:striing):number[]
}
const fn:Fn=function(name:string){
    return [1,2,3]
}



let a:Aaaa={
    name:"type",
    age:16,
    isIkun:true,
}

2. 数组类型

// 1. 普通类型
let a:string[]=['1','21']
let a1:number[]=[1,2,3]
// 2. 泛型
let b:Array<boolean>=[true,false]
// 3. interface
interface Ar{
    name:string
}
let c:Ar[]=[{name:"Nihao"}]
// 4. 多维数组
let d:number[][]=[[1],[2]]
let e:Array<Array<number>>=[[1],[2]] // 泛型
let f:any[]=[1,[2],"555"], // any
let g:[number,string,boolean]=[1,"555",true], // 元组

// 5.数组在函数中使用
function (...args:any[]){
    // arguments 类数组
    let a:IArguments=arguments
    /* 原理 */
    // 利用interface实现的
    /* 
        interface IArguments{
            callee:Function,
            length:number,
            [index:number]:any
        }
    
    */
}

3. 函数的用法

// 1. 函数定义参数和返回值
function add(a:number ,b:number):number{
    return a+b
}
const add1=(a:number ,b:number):number=>a+b
// 2. 默认值
// 可选参数和默认值不能一起使用
function add2(a:number=10 ,b?:number):number{
    return a+b
}
// 3. 参数是一个对象
interface User{
    name:string,
    age:number 
}
function U(user:User):User{
    return user
}
// 4. 函数this类型
interface Obj{
    user:number[],
    add:(this:Obj,num:number)=>void
}
//ts 可以定义this的类型，在js之中无法使用，必须第一个参数定义this的类型
let obj:Obj={
    user:[1,2,3],
    add(this:Obj,num:number){
        this.user.push(num)
    }
}
// 5. 函数重载

/* 一个函数实现增删改查 */
let user:number=[1,2,3]

// 如果没有传入，查询全部
function FindUserList():number[]
// 如果传入id，进行单个查询
function FindUserList(id:number):number[]
// 如果传入一组数据进行添加操作
function FindUserList(ids:number[]):number[]

// 函数更具参数进行判断
function FindUserList(ids?:number | number[]):number[]{
    if(typeof ids === 'number'){
        return user.find(i=>i=ids)
    }else if(Array.isArray(ids)){
        user.push(ids)
        return user
    }else{
        return user
    }
}