TypeScript中的数据类型enum type interface基础用法示例
作者：艾艾
这篇文章主要为大家介绍了TypeScript中的数据类型enum type interface基础用法示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
一. enum，何时去使用enum
enum用于映射，以下是基本用法
enum A {
todo = 0, // 表示todo等于0，往下依次增加
done,
archived,
deleted,
}
let orderStatus = 0;
orderStatus = A.todo;
orderStatus = A.done;
console.log(orderStatus);通过位运算和enums做权限控制
enum Permission {
None = 0, // 0000
Read = 1 << 0, // 0001
Write = 1 << 1, // 0010
Delete = 1 << 2, // 0100
Manage = Read | Write | Delete, // 二进制的或 // 0111
}
type User = {
permission: Permission;
};
const user: User = {
permission: 0b0111,
}; // 这个值应该是从后台获取
// 用二进制表示权限，若user.permission&Permission.Write === Permission.Write 则user.permission有Permission.Write的所有1
if ((user.permission & Permission.Write) === Permission.Write) {
console.log('拥有写权限');
}二. 什么时候用enum会显得很呆
// 以下这种场景就很呆，不如用type+并集
enum Fruit {
apple = 'apple',
banana = 'banana',
pineapple = 'pineapple',
watermelon = 'watermelon',
}
let f: Fruit = Fruit.apple;
f = Fruit.watermelon;
console.log(f);
对比直接用type+并集的方式
// 用type加并集 type Fruit = 'apple' | 'banana' | 'watermelon' | 'pineapple'; let f: Fruit = 'banana'; f = 'watermelon'; console.log(f);
总结: number + enum 不错，string 和 混用的情况都不太合适，如果没有enum在js中我们可以用map来替代
三. type和interface的区别
什么时候用type？
几乎没有不能用type的场景，它的官方名称应该叫做类型别名(Type Aliases)，也就是给其它类型取一个名字
type Name = string;
const a: Name = 'hi';
type FalseLike = 0 | '' | null | undefined | false;
// 比较特殊的带有属性的函数的声明方式
type FnWithProp = {
(a: number, b: number): number;
prop: string;
};
const f: FnWithProp = (x, y) => {
return x + y;
};
f.prop = 'hello';为什么叫做类型别名
type A = string; type B = A; // B 实际上的类型还是string，不是A，也就是说type声明的是一个类型的别名，没有产生新的类型
什么时候用interface
接口interface是面向对象里面的概念，它表示class需要有的一些功能，ts中的功能不仅能描述功能也能描述对象的属性
type A1 = Array<string> & {
name: string;
} & X;
interface X {
age: number;
}
// interface就是用面向对象的黑话，把type能做的事情再描述一遍
interface A2 extends Array<string>, X {
name: string;
}interface描述函数
interface Fn {
(a: number, b: number): number;
xxx: number;
}
const f: Fn = (x, y) => {
return x + y;
};
f.xxx = 1;
console.log(f);描述日期对象
interface D extends Date {
}
const d: D = new Date();
console.log(d);
type和interface的范围
type也能描述对象，是不是就不需要interface? 我感觉并非如此，主要有两点。第一点，其实interface这个特性的出现迎合了面向对象的粉丝的需要，有助于typescript这门语言的推广传播。 第二点之后我会细说。
区别
- interface只描述对象，type则描述所有区别
- type 只是别名interface则是类型声明
四. type和interface的第三个区别
type的重要特性: type不可以重新赋值，这样的好处计算非常快，但是缺点就是type不好扩展
type A = number;
interface可以自动合并，所以可以被扩展
interface X {
name: string;
}
interface X {
age: number;
}
const a: X = {
name: 'frank',
age: 18,
};interface扩展的例子
// 扩展axios
import {AxiosRequestConfig} from 'axios'
declare module 'axios' {
export interface AxiosRequestConfig {
_autoLoading?: boolean;
_mock?: string;
}
}
// 扩展string
interface String {
padZero(length: number): string;
}
const s = 'hello';
s.padZero(1);总结
对外API尽量使用interface，方便扩展，对内API尽量用type，防止代码分散
以上就是TypeScript中的数据类型enum type interface基础用法示例的详细内容，更多关于TypeScript数据类型enum type interface的资料请关注脚本之家其它相关文章！