-
js 已有类型
number、string、boolean、null、undefined、symbol
let num: number = 1
let str: string = 'string'
let bool: boolean = false
let nul: null = null
let under: undefined = undefined
let sym: symbol = Symbol()
-
ts 新增类型
联合类型、自定义类型(类型别名)、接口、元祖、字面量类型、枚举、void、any等
数组类型
number[] 或 Array<number>
let arr1: number[] = [1, 2, 3];
let arr2: Array<number> = [1, 2, 3];
let arr3: (string | number)[] = [1, 'string', 2]
let arr4: Array<string | number> = [1, 'string', 3]
函数类型
单独指定参数、返回值的类型
function addNum(a: number, b: number): number {
return a + b
}
同时指定参数、返回值的类型
const addNum: (a:number) => number = (a) => {
return a
}
当返回值为 void 时表示没有返回值,或者不写返回值
// 参数名后面加上 ? 表示该参数可选
function addNum(a: number, b?: number): void {
if(b) {
console.log(a)
}
}
promise
interface promiseType {
// 接口表示该值是为一个函数 并且返回值为一个 Promise 函数,其 resolve 传递的是 字符串数组
fun: ()=> Promise<string[]>;
num: number;
}
// resolve 里传的是字符串数组
function promiseFun(): Promise<string[]> {
return new Promise( (resolve, reject) => {
resolve([
'1', '222', '333333'
])
})
}
function testFun(props: promiseType) {
const { fun, num } = props
fun().then( res => {
console.log(res)
})
}
onMounted(() => {
testFun({
fun: promiseFun,
num: 10
})
})
泛型
可以支持不特定的数据类型。 要求: 传入的参数和返回的参数一致
function test<T>(value: T): T {
return value
}
onMounted(()=> {
test<number>(1) // function test<number>(value: number): number
test<number>('str') //err
test<string>('str') // function test<string>(value: string): string
})
泛型接口
interface ConfigFn{
<T>(value:T):T;
}
let getData:ConfigFn = function<T>(value:T):T {
return value;
}
onMounted(()=> {
getData<number>(123); // let getData: ConfigFn <number>(value: number) => number
getData<number>('123'); // err
})
// 另一种方式
interface ConfigFn<T>{
(value:T):T;
}
function getData<T>(value:T):T{
return value;
}
let myGetData:ConfigFn<string> = getData;
myGetData('123');
myGetData(123);
类作为参数类型的泛型类
- 定义一个类
- 把类作为参数来约束数据传入的类型
/*
定义一个 User的类,这个类的作用就是映射数据库字段
然后定义一个 MysqlDb的类,这个类用于操作数据库
然后把User类作为参数传入到MysqlDb中
var user = new User({
username: '张三',
password: '123456'
});
var Db = new MysqlDb();
Db.add(user);
*/
class User {
username: string | undefined;
password: string | undefined;
}
class MysqlDb<T> {
add(info: T): boolean {
console.log(info);
return true;
}
}
var u = new User();
u.username = "李斯";
u.password = "1232123";
var Db = new MysqlDb<User>();
Db.add(u); // User {username: '李斯', password: '1232123'}
never
never 表示一个无法被观测的类型,
never 类型便为空类型和底部类型。never 类型的变量无法被赋值,与其他类型求交集为自身,求并集不参与运算。
unknown
unknown 指的是不可预先定义的类型,在很多场景下,它可以替代any的功能同时保留静态检查的能力。
unknown 的作用就跟 any 高度类似了,你可以把它转化成任何类型,不同的地方是,在静态编译的时候,unknown 不能调用任何方法,而 any 可以。
const foo: unknown = 'string';
foo.substr(1); // Error: 静态检查不通过报错
const bar: any = 10;
bar.substr(1);
any
当值为 any 类型时,可以对该值进行任意操作,并且不会有代码提示