又是一个年底来了,好大一批人可能又准备跑路了,最近回家待产
话不多说,赶紧开干,给自己整了一个前端面试小助手——微信小程序内搜索 “WEB学习学习加油站” ,整理了前端经典高频面试题,笔试题库,是前端跳槽人必不可少的利器。
1、如何将 unknown 类型指定为一个更具体的类型?
1.1、使用 typeof 进行类型判断(这些缩小类型范围的技术都有助于TS基于控制流程下的类型分析)
1.2、对 unknown 类型使用类型断言
要强制编译器信任类型为 unknown 的值为给定类型,则可以使用类型断言:
断言错了时语法能通过检测,但是运行的时候就会报错了!
2、说说对 TS 中命名空间与模块的理解?区别?
2.1、模块
TypeScript 与 ECMAScript 2015 一样,任何包含* import 或者 export 的文件都被当成一个模块。
相反地,如果一个文件不带有*的import或者export声明,那么它的内容被视为全局可见的
例如我们在在一个 TypeScript 工程下建立一个文件 1.ts,声明一个变量a,如下:
然后在另一个文件同样声明一个变量a,这时候会出现错误信息
提示重复声明a变量,但是所处的空间是全局的
如果需要解决这个问题,则通过import或者export引入模块系统即可,如下:
在typescript中,export关键字可以导出变量或者类型,用法与es6模块一致,如下:
通过import 引入模块,如下:
2.2、命名空间
命名空间一个最明确的目的就是解决重名问题
命名空间定义了标识符的可见范围,一个标识符可在多个名字空间中定义,它在不同名字空间中的含义是互不相干的
这样,在一个新的名字空间中可定义任何标识符,它们不会与任何已有的标识符发生冲突,因为已有的定义都处于其他名字空间中
TypeScript 中命名空间使用 namespace 来定义,语法格式如下:
以上定义了一个命名空间 SomeNameSpaceName,如果我们需要在外部可以调用 SomeNameSpaceName 中的类和接口,则需要在类和接口添加 export 关键字
使用方式如下:
命名空间本质上是一个对象,作用是将一系列相关的全局变量组织到一个对象的属性,如下:
编译成js如下:
2.3、区别
- 命名空间是位于全局命名空间下的一个普通的带有名字的 JavaScript 对象,使用起来十分容易。但就像其它的全局命名空间污染一样,它很难去识别组件之间的依赖关系,尤其是在大型的应用中
- 像命名空间一样,模块可以包含代码和声明。 不同的是模块可以声明它的依赖
- 在正常的TS项目开发过程中并不建议用命名空间,但通常在通过 d.ts 文件标记 js 库类型的时候使用命名空间,主要作用是给编译器编写代码的时候参考使用
3、tsconfig.json 文件有什么用?
tsconfig.json文件是JSON格式的文件。
在tsconfig.json文件中,可以指定不同的选项来告诉编译器如何编译当前项目。
目录中包含tsconfig.json文件,表明该目录是TypeScript项目的根目录。
4、TS 中的 declare 关键字有什么用?
JavaScript库或框架没有TypeScript声明文件。 但是,如果要在TypeScript文件中使用它们而没有任何编译错误,则必须使用declare关键字。 declare关键字用于环境声明和您要定义可能在其他位置存在的变量的方法。
如果要在我们的TypeScript代码中使用该库,则可以使用以下代码:
TypeScript运行时会将myLibrary变量分配为 any。
5、TS 中支持的访问修饰符有哪些?
TypeScript支持访问修饰符 public,private 和 protected,它们决定了类成员的可访问性。
- 公共(Public),类的所有成员,其子类以及该类的实例都可以访问。
- 受保护(Projected),该类及其子类的所有成员都可以访问它们。 但是该类的实例无法访问。
- 私有(Private),只有类的成员可以访问它们。
如果未指定访问修饰符,则它是隐式公共的,因为它符合 JavaScript 的便利性。
6、解释一下 TS 中的枚举。
枚举是 TypeScipt 数据类型,它允许我们定义一组命名常量。 使用枚举使记录意图或创建一组不同的案例变得更加容易。 它是相关值的集合,可以是数字值或字符串值。
7、TS 中的方法重写是什么?
如果子类(子类)具有与父类中声明的相同的方法,则称为方法覆盖。换句话说,在派生类或子类中重新定义基类方法。
方法重写的规则
- 该方法必须具有与父类相同的名称
- 该方法必须具有与父类相同的参数。
- 必须有一个IS-A关系(继承)。
8、什么是 Typescript 映射文件?
- TypeScript Map文件是一个源映射文件,其中包含有关我们原始文件的信息。
- .map文件是源映射文件,可让工具在发出的JavaScript代码和创建它的TypeScript源文件之间进行映射。
- 许多调试器可以使用这些文件,因此我们可以调试TypeScript文件而不是JavaScript文件。
9、如何在 typescript 中实现继承?
继承是一种从另一个类获取一个类的属性和行为的机制。它是OOPs语言的一个重要方面,并且具有从现有类创建新类的能力,继承成员的类称为基类,继承这些成员的类称为派生类。
继承可以通过使用extend关键字来实现。我们可以通过下面的例子来理解它。
10、Typescript 中什么是类类型接口?
- 如果接口用于一个类的话,那么接口会表示“行为的抽象”
- 对类的约束,让类去实现接口,类可以实现多个接口
- 接口只能约束类的公有成员(实例属性/方法),无法约束私有成员、构造函数、静态属性/方法
11、说一说 typeScript 中类及其特性。
TypeScript 引入了类,以便它们可以利用诸如封装和抽象之类的面向对象技术的好处。
TypeScript 编译器将 TypeScript 中的类编译为普通的 JavaScript 函数,以跨平台和浏览器工作。
一个类包括以下内容:
- 构造器(Constructor)
- 属性(Properties)
- 方法(Methods)
类的其他特性有:
- 继承(Inheritance)
- 封装(Encapsulation)
- 多态(Polymorphism)
- 抽象(Abstraction)
12、typescript 中的 getter/setter 是什么?你如何使用它们?
Getter 和 setter 是特殊类型的方法,可帮助你根据程序的需要委派对私有变量的不同级别的访问。
Getters 允许你引用一个值但不能编辑它。Setter 允许你更改变量的值,但不能查看其当前值。这些对于实现封装是必不可少的。
例如,新雇主可能能够了解get公司的员工人数,但无权set了解员工人数。
13、typeScript 最终会被编译为 javaScript ,为什么还推荐使用 Typescript 呢?
TypeScript是微软公司开发和维护的一种面向对象的编程语言。它是JavaScript的超集,包含其所有元素。
强类型和弱类型、静态类型和动态类型是两组不同的概念。
类型强弱是针对类型转换是否显示来区分,静态和动态类型是针对类型检查的时机来区分。
TS对JS的改进主要是静态类型检查,静态类型检查有何意义?标准答案是“静态类型更有利于构建大型应用”。
推荐使用TypeScript的原因有:
- TypeScript简化了JavaScript代码,使其更易于阅读和调试。
- TypeScript是开源的。
- TypeScript为JavaScript ide和实践(如静态检查)提供了高效的开发工具。
- TypeScript使代码更易于阅读和理解。
- 使用TypeScript,我们可以大大改进普通的JavaScript。
- TypeScript为我们提供了ES6(ECMAScript 6)的所有优点,以及更高的生产率。
- TypeScript通过对代码进行类型检查,可以帮助我们避免在编写JavaScript时经常遇到的令人痛苦的错误。
- 强大的类型系统,包括泛型。
- TypeScript只不过是带有一些附加功能的JavaScript。
- TypeScript代码可以按照ES5和ES6标准编译,以支持最新的浏览器。
- 与ECMAScript对齐以实现兼容性。
- 以JavaScript开始和结束。
- 支持静态类型。
- TypeScript将节省开发人员的时间。
- TypeScript是ES3、ES5和ES6的超集。
14、typeScript 声明文件是什么?
在 typescript 项目开发中,引用其他第三方的非 typescript 编写的 javascript 的库的时候,必须为这个类编写一个声明文件,如果没有的话,就会提示找不到。
以 jQuery 库为例:
声明文件的作用:主要用来描述 JS 模块内的类型信息,声明文件一般都是 *.d.ts 作为后缀,一般放到 types 文件夹内。
以 jQuery 库为例,写一个声明文件:jQuery.d.ts 文件,内容如下:
此时上边的 jQuery 就不会报红了!
通常,声明文件都是由类库的开发者编写的,包含在类库的源码中,不需要我们手动一个一个类库地写。大部分主流类库都可以在社区中找到,地址为:
https://www.typescriptlang.org/dt/search
查找对应的库,在后边复制命令,安装类库时会自动生成 *.d.ts 声明文件。如:
15、typescript 的优缺点有哪些?
typescript 的优点有:
- 增强代码的可读性和可维护性,适合开发大型应用。typescript 的设计目标是开发大型应用。
- typescript 是 javascript 的超集,不仅支持 javascript 包括 ES6 的新增特性,因此能够支持所有 javascript 库。
- 提供了可选静态类型、强类型、模块、可选参数等。
- 提供类型检查,在编译阶段时强调错误,而不是像 javascript 在运行时才会提示错误。
- 能够编译出一个支持所有浏览器的 javascript 程序。
typescript 的缺点有:
- 有一定的学习成本,需要理解接口、泛型、枚举等新知识点。
- 前期开发成本会有所增加,但是降低了后期的维护成本。
- 浏览器无法识别 typescript ,所以在 html 文件内不能直接引入 ts 文件,需要先编译成 javascript 文件之后再使用。
- 引入第三方库的时候,必须使用声明文件先定义。
- typescript 不支持抽象类。
16、多个 .ts 文件是否能够合并成一个 .js 文件呢?
可以的。
可以将 demo1.ts、demo2.ts、demo3.ts 三个文件自动编译并合并到 common.js 文件内。
可以将 test1.ts、test2.ts 编译,编译后的 js 代码放入 test.ts 文件内,如果 test.ts 之前有内容,执行命令后 test.ts 原文件内容被清空。