Typescript面试题
# typescript
1、ts与js相比较有哪些优势？
概述： TS是JS的超集(TypeScript 是一种给 JavaScript 添加特性的语言扩展。)，JS有的Ts都有，Ts是微软开发的开源编程语言，遵循Es6、Es5规范，设计目标是开发大型应用，可以在任何浏览器、计算机、操作系统上运行。本质上向JS中添加了可选的静态类型和基于类的面向对象编程。
区别： JS变量是没有类型的，即age=18，age可以是任何类型的，可以继续给age赋值为age=”aaa” Ts有明确的类型(即：变量名:number(数值类型)) eg：let age: number = 18
TS优势
-
类型化思维方式，使开发更严谨，提前发现错误，减少改Bug时间
-
类型系统提高了代码可读性，维护和重构代码更加容易
-
补充了接口、枚举等开发大型应用时JS缺失的功能
JS的类型系统存在"先天缺陷"，绝大部分错误都是类型错误(Uncaught TypeError)
2、TypeScript 中的原始类型有哪些 ？
TypeScript的原始类型包括: boolean、number、string、void、undefined、null、symbol、bigint。
-
布尔类型：boolean
-
数字类型：number
-
字符串类型：string
-
空值：void
-
Null 和 Undefined：null 和 undefined
-
Symbol 类型：symbol
-
BigInt 大数整数类型：bigint
2.1、TypeScript 中的基本类型有哪些 ?
类型：
| 类型 | 例子 | 描述 |
|---|---|---|
| number | 1, -33, 2.5 | 任意数字 |
| string | 'hi', "hi" | 任意字符串 |
| boolean | true、false | 布尔值true或false |
| 字面量 | 其本身 | 限制变量的值就是该字面量的值 |
| any | * | 任意类型 |
| unknown | * | 类型安全的any |
| void | 空值（undefined） | 没有值（或undefined） |
| never | 没有值 | 不能是任何值 |
| object | {name:"孙悟空"} | 任意的JS对象 |
| array | [1, 2, 3] | 任意JS数组 |
| tuple（元组） | [4, 5] | 元素，TS新增类型，固定长度数组 |
| enum | enum(A, B) | 枚举, TS中新增类型 |
3、说说数组在 TypeScript 中是如何工作的 ？
我们使用数组来存储相同类型的值，数组是有序和索引的值集合
索引从 0 开始，即第一个元素的索引为 0，第二个元素的索引为 1，依此类推
4、什么是 any 类型，何时使用 ？
any类型
-
可以赋值任意类型的数据
-
声明一个变量为任意值之后，对它的任何操作，返回的内容的类型都是任意值。
当一个变量需要赋值的数据类型不确定时，就使用any类型，它可以赋值任意数据类型
5、什么是void，什么时候使用void类型 ？
void 用来表示空, 以函数为例, 就表示没有返回值的函数或返回值为undefind
void返回值是空(undefind)，但是不能将类型“null”分配给类型“void”。
因为没有返回值的函数总是返回 undefined，而 void 总是在 JavaScript 中返回 undefined，TypeScript 中的void 是一个正确的类型，告诉开发人员这个函数返回 undefined
6、TypeScript 中声明变量有哪些不同的关键字？
-
type 只能声明一次
-
interface 可以声明多次
-
enum
-
let const var
7、如何书写带有类型注释的函数 ？
函数是执行特定代码的代码块
函数可以有选择地接受一个或多个参数，处理它们，并有选择地返回一个值。
function greet(name: string): string {
return `Hello,${name}`
}
let greeting = greet("string字符串")
8、如何在 TypeScript 中创建对象 ？
对象是类似字典的keys和values的集合，key 必须是唯一的。它们类似于数组，有时也称为关联数组
但是，数组使用数字来索引值，而对象允许使用任何其他类型作为键
let obj: {x: number; y: string} = {
x: 10,
y: "hello"
}
9、如何在 TypeScript 中指定可选属性 ？
通过添加 ？对象类型可以具有零个或多个可选属性，在属性名称之后
let obj: {x: number; y: string; z?: number} = {
x: 10,
y: "hello"
}
// z可以加可以不加
10、说说枚举在 TypeScript 中是如何工作的 ？
枚举允许我们创建命名常量，这是一种为数字常量值赋予更友好名称的简单方法
枚举由关键字 enum 定义，后跟其名称和成员
// 在js的标准中是没有枚举这一说的，但在typescript中是有这个类型的。枚举的意思是把所有相关的子数据，都收集起来。例如一个星期里的每一天：
// 枚举允许开发者定义一组命名的常量。使用枚举可以使其更容易记录意图，或创建一组不同的情况。TypeScript提供了基于数字和字符串的枚举。
// 数字枚举
enum Weekday {
Monday,
Tuseday,
Wednesday=6, // 默认从0开始，但到这里，从6开始
Thursday,
Friday,
Saturday,
Sunday
}
// 然后直接通过Weekday.Monday就可以获取到对应的值，默认情况下，第一个枚举值是0，然后每个后续值依次递增 1。
// 数字枚举如果没有初始化，默认初始化值为0，每项+1
// 如果有初始化，则在初始化值的基础上，每项+1
// 如果某项被赋值（可以是负数或负数），那么之后的项在此基础上+1
// 如果未手动赋值的枚举项与手动赋值的重复了，如例4，TypeScript 是不会察觉到这一点的，但建议尽量避免
// 字符串枚举:声ming必须
enum Direction {
Up = "UP",
Down = "DOWN",
Left = "LEFT",
Right = "RIGHT",
}
// 很好地 "序列化"
11、说说TypeScript 中 for 循环的不同变体
TypeScript 提供了以下三种循环集合的方法
// for 循环
let values = [10,"foo",true];
for(let i = 0; i < values.length; i++){
console.log(values[i])
}
// forEach函数
let values = [10,"foo",true];
values.forEach( val =>{
console.log(val)
})
// for..of 声明
let values = [10,"foo",true];
for(let val of values) {
console.log(val)
}
12、类型注解和类型别名有什么区别？
类型别名为现有类型提供替代名称。如果类型名称太长，您可以引入不同的较短的名称，并使用新的名称
类型别名不会引入新类型，它们相当于相应的底层类型
13、type（类型别名）和interface（接口）区别是什么？
接口基本使用
// 接口用来定义一个类结构，用来定义一个类中应该包含哪些属性和方法
// 接口名可以重复（可以声明合并）
interface yourType {
name: string
age: number
}
interface yourType {
gender: string
}
const you: yourType = {
name: 'yoyo',
age: 333,
gender: '女' // 这里的属性要和接口中一致，不能少，不能多
}
类型别名基本使用
// 描述一个对象的类型
// 类型别名：名称唯一，不能重复
type myType = {
name: string
age: number
}
const obj: myType = {
name: 'ccc',
age: 33 // 这里的属性要和类型声明中一致，不能少，不能多
}
区别：
-
命名规范
-
type类型别名 命名唯一，不可重复
-
interface接口 可以重复定义
-
-
type可以使用in 关键字生成映射类型 interface不行
type Keys = "firstname" | "surname" type DudeType = { [key in Keys]: string } const test: DudeType = { firstname: "Pawel", surname: "Grzybek" } -
interface 与 type 可以相互扩展对方 单语法不通 (extends关键字 &操作符)
type PartialPointX = { x: number; }; interface Point extends PartialPointX { y: number; } // 利用type扩展interface const obj: Point = { x: 22, y: 33 } interface PartialPointX { x: number; } type Point = PartialPointX & { y: number; }; // 利用interface扩展 type const obj: Point = { x: 22, y: 33 } console.log(obj) // 输出： // { "x": 22, "y": 33 }
建议： 公共的用 interface 实现，不能用 interface 实现的再用 type 实现
14、谈谈你对泛型的认识
ts中的泛型就跟any差不多，不过与any不同的是，any会丢失类型而泛型不会。
当应一个函数中传入一个 num 10 但是最后返回回来的参数可能是 string ，这样对于参数类型就会丢失。