TypeScript和JavaScript的区别是什么?
- 语法:TypeScript是JavaScript的超集。
- 执行环境:JavaScript是脚本语言,可以直接在浏览器/nodejs环境执行。TypeScript是编译语言,不能直接执行。
- 编译:TypeScript有编译阶段,JavaScript没有编译阶段,只有转译阶段(将高版本转译成更低版本)和lint阶段)。
- 编写:TypeScript更难编写,但类型更安全。
- 文档:TypeScript的代码写出来就是文档,ide可以完美提示。JavaScript的代码提示来自于TypeScript的贡献。
any / unknown / never的区别是什么?
这个题目不太好回答,抽象题目可以通过举例来具体回答。
any vs unknown:
两者都是顶级类型(top type),任何类型都可以赋值给顶级类型。
let a: any = 123; // 不报错
let b: unknown = 456; // 不报错
但unknown比any的类型检查更严格,any不做检查,unknown要求先收窄类型。
let value: unknow = 'abc';
let stringA: string = value;
// 报错
let stringB: string = value as string; // 类型收窄,不报错
如果类型是any,则都不会报错。
never:
never是底类型,表示不应该出现这种类型。
type和interface的区别是什么?
官方文档给出的区别:
- 组合方式:interface可以通过extends实现继承,type可以通过&实现交叉类型。
- 扩展方式:interface可以通过多次声明进行扩展(不会覆盖),type只能声明一次。
- 范围:type适用于基本类型,interface一般不可用于基本类型。
- 命名方式:interface会创建新的类型,type会创建类型别名而不会创建新的类型。
实际操作中,简单来说,一般基本类型我会使用type,复杂类型我会使用interface。
工具类型的作用和实现
TypeScript的工具类型及使用场景:
Partial(部分类型):
比如在用户注册的情景下,一个User类型需要id和name,但用户在注册时还没有id,这时我们在使用user时,就可以用到Partial,避免没有id导致的报错。
interface User {
id: int,
name: string
}
const user: Partial<User> = {
name: 'Chypre'
}
Required(必填类型):
Partial的反向操作。
Readonly(只读类型):
略。
Pick(选择类型):
在已有的类型对象(interface)中,通过key,选择几个类型。
const user: Pick<User, 'name'> = {
name: 'Chypre'
}
Omit(忽略类型):
Pick的反向操作。
const user: Omit<User, 'id'> = {
name: 'Chypre'
}
Exclude(排除类型):
在已有的非对象类型中直接排除几个类型。
const dir = 'east' | 'west' | 'south' | 'north';
const myDir = Exclude<dir, 'north'>;
Extract(提炼类型):
Exclude的反向操作。
如果Extract的值并不包含于总的类型之中,会报错吗?讲道理,应该要报错,但实践发现,ts并不会进行检查。但有的情景下,为了代码逻辑的关联性,我还是会选择使用Extract。
ReturnType(返回值类型):
function f(a: number, b: number){
return a+b;
}
type A = ReturnType<typeof f>; // number