「 推荐一个学习 ts 基础的专栏,满满的干货:typeScript 」
1、为什么推荐使用 TypeScript
【】ts 是 js 的超集,包含 js 的所有元素
【】ts 通过对代码进行类型检查,可以帮助我们避免在编写 js 时经常遇到令人痛苦的错误
【】强大的类型系统,包括泛型
【】支持静态类型及类型检查
【】面向对象的语言,提供所有标准的 OOP 功能,如类、接口和模块
【】ts 代码可以按照ES5和ES6标准编译,以支持最新的浏览器
2、TS 中的类型有哪些
【】number、string、boolean、void、null、undefined、enum、any、class、interface、array、tuple(元组)、object、never
3、命名空间与模块的理解
【】命名空间:解决重名问题,命名空间定义了标识符的可见范围,一个标识符可在命名空间中定义,它在不同命名空间中的含义是互不相干的
【】任何包含顶级 import 或者 export 的文件都被当成一个模块。如果一个文件不带有顶级的 import 或者 export 声明,那么它的内容被视为全局可见的
【】区别:
- 命名空间是位于全局命名空间下的一个普通的带有名字的 JavaScript 对象,使用起来十分容易。但就像其它的全局命名空间污染一样,它很难去识别组件之间的依赖关系,尤其是在大型的应用中
- 像命名空间一样,模块可以包含代码和声明。 不同的是模块可以声明它的依赖
- 在正常的TS项目开发过程中并不建议用命名空间,但通常在通过 d.ts 文件标记 js 库类型的时候使用命名空间,主要作用是给编译器编写代码的时候参考使用
4、什么是枚举
【】枚举是 TypeScipt 数据类型,它允许我们定义一组命名常量。它是相关值的集合,可以是数字值或字符串值
【】枚举类型分为:数字枚举、字符串枚举、异构枚举
【】枚举是可以合并的
5、什么是装饰器
【】装饰器是一种特殊类型的声明,它能过被附加到类声明,方法,属性或者参数上,可以修改类的行为
【】通俗的来说就是一个方法,可以注入到类,方法,属性参数上来扩展类,属性,方法,参数的功能
【】装饰器的分类: 类装饰器、属性装饰器、方法装饰器、参数装饰器
6、TS 中的类是什么
【】类表示一组相关对象的共享行为和属性
【】类之间可以通过 extend 实现继承,被继承类称为基类,继承的类称为派生类
【】一个类包括构造器、属性、方法。拥有四个特性:继承、封装、多态、抽象
7、TS 中的泛型是什么
【】 在 ts 中,定义函数,接口或者类的时候,不预先定义好具体的类型,而在使用的时候在指定类型的一种特性
【】泛型约束:<T extends xx>
的方式实现 约束泛型
【】索引类型
keyof T
把传入的对象的属性类型取出生成一个联合类型
8、const 和 readonly 的区别是什么
【】const用于变量,readonly用于属性
【】const在运行时检查,readonly在编译时检查
【】使用const变量保存的数组,可以使用push,pop等方法。但是如果使用Readonly Array声明的数组不能使用push,pop等方法
9、Omit 类型 和 Pick 类型对比
【】Omit 以一个类型为基础支持剔除某些属性,然后返回一个新类型
Omit<Type, Keys>
【】Pick 以一个类型为基础支持选择某些属性,然后返回一个新类型
interface Todo {
title: string
description: string
completed: boolean
createdAt: number
}
type Ex = "title" | "description"
type TodoPreview = Omit<Todo, "description">
type TodoPreview1 = Pick<Todo, Ex>
10、ts 中高级类型有哪些
【】交叉类型、联合类型、类型别名、类型索引、类型约束、映射类型、条件类型
【】映射类型:通过 in 关键字做类型的映射,遍历已有接口的 key 或者是遍历联合类型
type Readonly<T> = {
//P in keyof T 等同于 p in 'a' | 'b',相当于执行了一次 forEach 的逻辑,遍历 'a' | 'b'
readonly [P in keyof T]: T[P];
};
interface Obj {
a: string
b: string
}
type ReadOnlyObj = Readonly<Obj>
【】条件类型:条件类型的语法规则和三元表达式一致,经常用于一些类型不确定的情况
//如果 T 是 U 的子集,就是类型 X,否则为类型 Y
T extends U ? X : Y
11、interface 和 type 区别
【】相同点:
- 都可以描述对象或者函数
- 都允许扩展(extends)
【】不同点:
- 类型别名可以为任何类型引入名称,例如基本类型,联合类型等
- 类型别名不支持继承
- 类型别名不会创建一个类型的名字
- 类型别名无法被实现implements,而接口可以被派生类实现
- 类型别名重名会抛出错误,接口重名是会产生合并
12、interface给 Function/Array/Class 做声明
interface Say {
(name: string): void;
}
let say: Say = (name: string): void => {};
interface NumberArray {
[index: number]: number;
}
let fibonacci: NumberArray = [1, 2, 3, 4];
interface Person {
name: string;
sayHi(name: string): string;
}
13、获取枚举类型的 key
enum Str {
A, B, C
}
type strUnion = keyof typeof str; // 'A' | 'B' | 'C'
14、declare, declare global是什么
【】declare是用来定义全局变量、全局函数、全局命名空间、js modules、class等
【】declare global 为全局对象 window 增加的新属性
declare global {
interface Window {
csrf: string;
}
}