ts

TypeScript

// string number boolean null undefined void
// let const var 
let str:string = '小满'

// any 任意类型 unknown 不知道类型
// 1 top type 
// 2 Object(支持所有类型) object(支持引用类型 函数)  {}(支持所有类型,但是不能修改,不建议使用)
// 3 Number String Boolean
// 4 number string boolean
// 5 1 '小满' false
// 6 never 
// unknown 只能赋值给自身或者 any
// unknown 没有办法读任何属性,方法也不可以调用
// unknown 比 any 更加安全

// 不能多属性 也不能少属性 
// 重名 重合
// 任意 key
// ? 
// readonly 不允许修改 常用于对应数据库ID
// 接口继承 extends 
// 定义函数类型
// interface
// object
interface Axxsxs {
    name:string
    age?:number // 下面可以有 可以没有
}
let a:Axxsxs = {
    name="小满"
}

// number[]
// Array<boolean>
// 定义对象数组使用interface

// 二维数组
// number[][]
// Array<Array<boolean>>

// 大杂烩数组
// any[]

let arr:number[] = [1,2,3]

function a(...args:any){

}
a(1,2,3)

函数

function add(a:number,b:number) :number{
    return a+b
}
consr add = (a:number,b:number) :number => a+b

// ts 可以定义 this 的类型  在js中无法使用  必须是第一个参数定义this的类型
interface Obj {
    user:number[]
    add:(this:Obj,num:number)=>void
}
let obj:Obj{
    user:[1,2,3]
    add(this:Obj,num:number){
        this.user,push(num)
    }
}
obj.add(4)

// 函数重载
let user:number[] = [1,2,3]

function findNum(add:number[]):number[] //传数组就添加
function findNum(id:number):number[]    //传id就是单个查询
function findNum():number[] // 查询去啊不
function findNum(ids:number | number[]):number[] {
    if(typeof ids == 'number'){
        return user.filter(v=>v == ids)
    }
    else if (Array.isArray(ids)){
        user.push(...ids)
        return user
    }else{
        return user
    }
}

联合类型 交叉类型 类型断言

// let phone:number|string = 12138

let fn = function (type:number | boolean) boolean{
    return !!type
}

// 类型断言
let num:number
num as string  // 第一种用法 as
<string>num    // 第二种用法 <>

内置对象

let num:Number = new Number(1)
let date:Date = new Date()
let xhr:XMLHttpRequest = new XMLHttpRequest()

// html(元素名称)element HTMLElement Element

泛型

// 相当于动态类型
function xiaoman<T>(a:T,b:t):array<T>{
    return [a,b]
}
xiaoman(1,2)
xiaoman("apple","banana")
xiaoman(false,true)

错误总结

1.无法识别vue declare
需要创建shims-vue.d.ts 文件 添加
 
2.无法识别request.js 
tsconfig.ts 添加下面的
allowjs = false
// export 导出

3.自定义路径 tsconfig.ts
compieroptions里面
"paths":{
    "@/*":[
        "src/*"
    ]
}