题目一:是否了解TypeScript?TypeScript比JavaScript 有哪些优势?
一、讲解视频
-
CSDN视频:
TS面试题一:介绍TS及TS的优势?
-
B站视频:
TS面试题一:介绍TS及TS的优势?
二、题目解析
此问题是一个基础问题,主要考察对ts及js的基本认识,可通过ts和js的基本介绍查看对应的区别:
- js基本介绍:
JavaScript 是世界上最流行的脚本语言。 JavaScript 是属于 web 的语言,它适用于 PC、笔记本电脑、平板电脑和移动电话。 JavaScript 被设计为向 HTML 页面增加交互性。 许多 HTML 开发者都不是程序员,但是 JavaScript 却拥有非常简单的语法。几乎每个人都有能力将小的 JavaScript 片段添加到网页中。
- ts基本介绍:
TypeScript是由微软开发的自由和开源的编程语言。
TypeScript是JavaScript的一个超集,从今天数以百万计的JavaScript开发者所熟悉的语法和语义开始。可以使用现有的JavaScript代码,包括流行的JavaScript库,并从JavaScript代码中调用TypeScript代码。
TypeScript可以编译出纯净、 简洁的JavaScript代码,并且可以运行在任何浏览器上、Node.js环境中和任何支持ECMAScript 3(或更高版本)的JavaScript引擎中。
TypeScript的优势在于:它有更多的规则和类型限制,代码具有更高的预测性、可控性,易于维护和调试;对模块、命名空间和面向对象的支持,更容易组织代码开发大型复杂程序。
另外,TypeScript的编译步骤可以捕获运行之前的错误。
三、参考资料
- TS官网
https://www.tslang.cn/index.html - JS官网
https://www.javascript.com/
四、参考答案
- TypeScript 是 JavaScript 的静态类型超集,可以编译为纯 JavaScript。通过引入静态类型,它允许开发人员在编译时而不是运行时捕获与类型相关的错误。 这可以减少错误,提高代码可读性,并通过增强的工具(例如自动完成和代码导航)提供更高效的开发体验。
- TypeScript可以在任何浏览器、主机和操作系统上执行。TypeScript不是直接在浏览器上运行的。它需要一个编译器来编译和生成JavaScript文件。TypeScript是带有一些附加特性的ES6 JavaScript版本。
- TypeScript 是 JavaScript 的静态类型扩展,它可以编译成标准的 JavaScript 代码。通过添加类型信息,TypeScript 在编译时而非运行时捕获错误,这有助于提高代码质量和可维护性。此外,TypeScript 还提供了一些额外的功能,如自动完成和代码导航,以提升开发效率。
题目二:TypeScript的优点?
一、讲解视频
-
CSDN视频:
TS面试题二:TypeScript的优点?
-
B站视频:
TS面试题二:TypeScript的优点?
二、题目解析
考察对 ts 的基本认识,和第一个题目类似,主要考察对 js、ts 等内容综合性认识。
三、参考资料
https://www.w3cschool.cn/typescript/typescript-tutorial.html
四、参考答案
- TypeScript 提供了可选静态类型,提供了可以添加到变量、函数、属性等的类型。
- TypeScript可以编译出纯净、 简洁的JavaScript代码,并且可以运行在任何浏览器上、Node.js环境中和任何支持ECMAScript 3。
- TypeScript有更多的规则和类型限制,代码具有更高的预测性、可控性,易于维护和调试;对模块、命名空间和面向对象的支持,更容易组织代码开发大型复杂程序。
- TypeScript的编译步骤可以捕获运行之前的错误。
- TypeScript支持在 js 中不支持的强类型或静态类型。
- TypeScript有助于代码结构,能使用基于类的面向对象编程。
- TypeScript提供了类型检测,所以可以使用工具支持和智能感知,可在编辑代码时提供智能提示。
- TypeScript通过定义模块来定义命名空间概念。
题目三:TypeScript的缺点?
一、讲解视频
-
CSDN视频:
TS面试题三:TypeScript的缺点?
-
B站视频:
TS面试题三:TypeScript的缺点?
二、题目解析
考察对 ts 的基本认识,和第一个题目类似,主要考察对 js、ts 等内容综合性认识。
三、参考资料
https://www.w3cschool.cn/typescript/typescript-tutorial.html
四、参考答案
- 由于需要将TypeScript 编译为 JavaScript,所以项目编译时需要很长时间来编译代码.
- 无法直接运行,需要将 TypeScript 代码编译为 JavaScript 代码才可以运行。
- TypeScript 中要使用任何第三方库时,都必须要使用声明文件,通过声明文件调用第三方库的内容,若第三方库没有编写声明文件,则无法调用。
- 类型定义较复杂,习惯了 js 开发后,开发 ts 会感觉有很大的限制,每个地方都要确定具体的类型。
题目四:什么是 any 类型,何时使用 ?
一、讲解视频
-
CSDN视频:
TS面试题四:什么是 any 类型,何时使用 ?
-
B站视频:
TS面试题四:什么是 any 类型,何时使用 ?
二、题目解析
考查对 any 类型的掌握及基本用法,解释如下:
有时候,我们会想要为那些在编程阶段还不清楚类型的变量指定一个类型。 这些值可能来自于动态的内容,比如来自用户输入或第三方代码库。 这种情况下,我们不希望类型检查器对这些值进行检查而是直接让它们通过编译阶段的检查。 那么我们可以使用 any类型来标记这些变量:
let notSure: any = 4;
notSure = “maybe a string instead”;
notSure = false; // okay, definitely a boolean`在对现有代码进行改写的时候,any类型是十分有用的,它允许你在编译时可选择地包含或移除类型检查。 你可能认为 Object有相似的作用,就像它在其它语言中那样。 但是 Object类型的变量只是允许你给它赋任意值 - 但是却不能够在它上面调用任意的方法,即便它真的有这些方法:
let notSure: any = 4;
notSure.ifItExists(); // okay, ifItExists might exist at runtime
notSure.toFixed(); // okay, toFixed exists (but the compiler doesn’t check)let prettySure: Object = 4;
prettySure.toFixed(); // Error: Property ‘toFixed’ doesn’t exist on type ‘Object’.当你只知道一部分数据的类型时,any类型也是有用的。 比如,你有一个数组,它包含了不同的类型的数据:
let list: any[] = [1, true, “free”];
list[1] = 100;
三、参考资料
https://www.tslang.cn/docs/handbook/basic-types.html
四、参考答案
- 有时候,我们会想要为那些在编程阶段还不清楚类型的变量指定一个类型。 这些值可能来自于动态的内容,比如来自用户输入或第三方代码库。 这种情况下,我们不希望类型检查器对这些值进行检查而是直接让它们通过编译阶段的检查。 那么我们可以使用 any类型来标记这些变量。
- 改写已有项目,想要绕开 ts 编译时的类型检查,可使用 any 指定。
题目五:TypeScript 中的any和unknown有何不同?
一、讲解视频
-
CSDN视频:
TS面试题五:any和unknown有何不同?
-
B站视频:
TS面试题五:any和unknown有何不同?
二、题目解析
主要考察ts中any和unknow类型的基础知识,ts中any和unknown是比较特殊的类型,都能代表任意类型,但是具体的使用及含义上还是有区别,一下是any及unknown的介绍:
- any介绍:
有时候,我们会想要为那些在编程阶段还不清楚类型的变量指定一个类型。 这些值可能来自于动态的内容,比如来自用户输入或第三方代码库。 这种情况下,我们不希望类型检查器对这些值进行检查而是直接让它们通过编译阶段的检查。 那么我们可以使用 any类型来标记这些变量:
let notSure: any = 4;
notSure = “maybe a string instead”;
notSure = false; // okay, definitely a boolean在对现有代码进行改写的时候,any类型是十分有用的,它允许你在编译时可选择地包含或移除类型检查。 你可能认为 Object有相似的作用,就像它在其它语言中那样。 但是 Object类型的变量只是允许你给它赋任意值 - 但是却不能够在它上面调用任意的方法,即便它真的有这些方法:
let notSure: any = 4;
notSure.ifItExists(); // okay, ifItExists might exist at runtime
notSure.toFixed(); // okay, toFixed exists (but the compiler doesn’t check)
let prettySure: Object = 4;
prettySure.toFixed(); // Error: Property ‘toFixed’ doesn’t exist on type ‘Object’.当你只知道一部分数据的类型时,any类型也是有用的。 比如,你有一个数组,它包含了不同的类型的数据:
let list: any[] = [1, true, “free”];
list[1] = 100;
- unknow介绍:
TypeScript 3.0引入了一个顶级的unknown类型。 对照于any,unknown是类型安全的。 任何值都可以赋给unknown,但是当没有类型断言或基于控制流的类型细化时unknown不可以赋值给其它类型,除了它自己和any外。 同样地,在unknown没有被断言或细化到一个确切类型之前,是不允许在其上进行任何操作的。
三、参考资料
https://www.tslang.cn/docs/handbook/basic-types.html
https://www.tslang.cn/docs/release-notes/typescript-3.0.html
四、参考答案
- 相同点:any 和unknown 都代表 了TypeScript 中的任何值。
- 两者的区别:
a. unknown 类型会更加严格。
b. any 绕过了编译器的类型检查,本质上关闭了 TypeScript 对变量类型的约束。
c. unknown 保持类型检查完整,在对变量执行操作之前断言或缩小变量的类型之后才能进行使用。
d. 可以对any类型进行任何操作,不需要类型检查,就像js一样,此时类型没有意义。
e. 可以将任意值付给unknown类型,但是不能调用其属性和方法,如果需要调用对应的属性和方法,则需要确认其具体的类型,可以使用类型断言或者类型保护确定具体的类型。
f. 联合类型中使用了unknown,则最终得到的类型都是unknown,除了 any 类型之外。
g. 交叉类型中,由于每种类型都可以赋值给 unknown 类型,所以在交叉类型中包含 unknown 不会改变结果。