TypeScript 面试题

发布时间 2023-05-03 20:28:40作者: 小短腿奔跑吧

一、TypeScript 是什么?

JavaScript是一种解释型的脚本语言,基于对象,跨平台的特性,活跃于各大网站制作中。而TypeScript则是以JavaScript作为基础,并对其扩展的一种新的语言,

 

二、TypeScript 的内置数据类型有哪些?

数字类型:用于表示数字类型的值。TypeScript 中的所有数字都存储为浮点值。

let identifier: number = value;

字符串类型:用于字符串类型的值

let identifier: string = " ";

布尔类型: 一个逻辑二进制开关,包含true或false

let identifier: bool = Boolean value;

未定义类型:一个未定义的字面量,它是所有变量的起点。

let num: number = null;

void 类型:分配给没有返回值的方法的类型。

let unusable: void = undefined;

三. 相比 JS Typescript 有哪些变动

1、数据类型方面

JavaScript 内数据类型

原始类型: number string boolean null undefinend symbol

复杂类型: 数组 对象 函数

TypeScript 内新增数据类型

联合类型:联合类型(Union Types)可以通过管道(|)将变量设置多种类型,赋值时可以根据设置的类型来赋值。例如:let var:string | number;只允许值的类型为字符串或者数字
自定义类型:type

接口:为使用该接口的对象定义契约或结构 (通常用于当一个对象类型被多次使用时,一般会使用接口(interface)来描述对象的类型)

元组:元组中允许存储不同类型的元素,元组可以作为参数传递给函数(类似数组格式)【number,string】
字面量类型:某个特定的字符串也可以作为 TS 中的类型。任意的 JS 字面量(比如,对象、数字,字符串 等)都可以作为类型使用,例如const a = ‘JS’,字面量类型为字符串类型

枚举:
都用来表示一组明确的可选值列表,枚举与字面量类型+联合类型组合的功能类似,
void:用于标识方法返回值的类型,表示该方法没有返回值。

any:
因为当值的类型为 any 时,可以对该值进行任意操作,并且不会有代码提示

2、增加了静态类型

TypeScript对数据类型增加了约束,例如:username:string 代表限定 username这个变量只能接受 string 类型的参数。

好处:

(1)静态编译

通过这种对变量的约束,TypeScript可以拥有静态类型检查的功能,在程序运行之前便可以先一步检测出错误。为开发人员创建了一个更高效的编码和调试过程。

(2)代码重构

也正是因为对于变量的约束,增强了代码得可读性。这降低我们在代码重构方面的难度,让我们可以更清楚地了解程序的结构,从而更好的优化程序。ps:此外,TypeScript也增加了一些小工具,让程序员在修改代码时更加得心应手。

坏处:

使代码变得稍微冗杂,毕竟实现程序的功能根本不需要这些约束。
 

三、interface(接口)和 type(类型别名)的对比

  • 相同点:都可以给对象指定类型
  • 不同点:接口只能为对象指定类型,类型别名,不仅可以为对象指定类型,也可以为任意类型指定别名
interface IPerson {
    name: string
    age: number
    sayHi(): void
}

type IPerson = {
    name: string
    age: number
    sayHi(): void
}

type NumStr = number | string

 

三、 TypeScript 的主要特点是什么?

  • 跨平台:TypeScript 编译器可以安装在任何操作系统上,包括 Windows、macOS 和 Linux。
  • ES6 特性:TypeScript 包含计划中的 ECMAScript 2015 (ES6) 的大部分特性,例如箭头函数。
  • 面向对象的语言:TypeScript 提供所有标准的 OOP 功能,如类、接口和模块。
  • 静态类型检查:TypeScript 使用静态类型并帮助在编译时进行类型检查。因此,你可以在编写代码时发现编译时错误,而无需运行脚本。
  • 可选的静态类型:如果你习惯了 JavaScript 的动态类型,TypeScript 还允许可选的静态类型。
  • DOM 操作:您可以使用 TypeScript 来操作 DOM 以添加或删除客户端网页元素。

 

四、使用 TypeScript 有什么好处?

  • TypeScript 更具表现力,这意味着它的语法混乱更少
  • 由于高级调试器专注于在编译时之前捕获逻辑错误,因此调试很容易。
  • 静态类型使 TypeScript 比 JavaScript 的动态类型更易于阅读和结构化
  • 由于通用的转译,它可以跨平台使用,在客户端和服务器端项目中。

 

五、TypeScript 中的接口是什么?

接口为使用该接口的对象定义契约或结构 

interface IEmployee {
    empCode: number;
    empName: string;
    getSalary: (number) => number; // arrow function
    getManagerName(number): string; 
}

六、TypeScript 中的模块是什么?

TypeScript 中的模块是相关变量、函数、类和接口的集合。

你可以将模块视为包含执行任务所需的一切的容器。可以导入模块以轻松地在项目之间共享代码

 

七、TypeScript 中如何检查 null 和 undefined?

你可以使用 juggle-check(==),它检查 null 和 undefined,或者使用 strict-check(===),它返回true设置为null的值,并且不会评估true未定义的变量。

x == null

x === null

typeof x === ‘undefined’

 

八、TypeScript中如何实现函数重载?

要在 TypeScript 中重载函数,只需创建两个名称相同但参数/返回类型不同的函数两个函数必须接受相同数量的参数