typescript基本语法,typescript函数

目录：

• 1、TypeScript简单入门（三）:TypeScript原始数据类型表达
• 2、TypeScript 速成教程
• 3、TypeScript 系统入门到项目实战
• 4、typescript语言中如何直接读取excel中的数据到一个实例对象中？

TypeScript简单入门（三）:TypeScript原始数据类型表达

原始数据类型包括：布尔值、数值、字符串、 null 、 undefined 以及 ES6 中的新类型 Symbol 和 ES10 中的新类型 BigInt 。

TypeScript声明变量时需要指定数据类型具体表达式

以构造函数方式：

编译后

其中 0b1010 和 0o744 是 ES6 中的二进制和八进制表示法，它们会被编译为十进制数字。

模板字符串

其中 ` 用来定义 ES6 中的模板字符串，${expr} 用来在模板字符串中嵌入表达式。

JavaScript 没有空值（Void）的概念，在 TypeScript 中，可以用 void 表示没有任何返回值的函数：

声明一个 void 类型的变量没有什么用，因为你只能将它赋值为 undefined 和 null

在 TypeScript 中，可以使用 null 和 undefined 来定义这两个原始数据类型：

与 void 的区别是，undefined 和 null 是所有类型的子类型。也就是说 undefined 类型的变量，可以赋值给 number 类型的变量：

而 void 类型的变量不能赋值给 number 类型的变量：

Symbols是ES6新增的原始数据类型，ts中使用时需要先配置

1、配置tsconfig.json

"lib": ["es6"], 需要dom时还要将"dom"添加进lib,如:console.log语句

2、特性

(1)不能和其他值计算,如加键、字符串拼接等

(2)可以调用.toString()返回字符串

(3)本身作为true类型存在

(4)类似for in遍历时,不会遍历symbol属性

可通过Object.getOwnPropertySymbols(对象)/Reflect.ownKeys(obj)获取symbol属性

3、语法

bigint 数据类型是用来表示那些已经超出了 number 类型最大值的整数值，对于总是被诟病的整数溢出问题，使用了 bigint 后将完美解决。

bigint 是一种基本数据类型（primitive data type）。

JavaScript 中可以用 Number 表示的最大整数为 2^53 - 1，可以写为 Number.MAX_SAFE_INTEGER。如果超过了这个界限，可以用 BigInt来表示，它可以表示任意大的整数。

在一个整数字面量后加 n 的方式定义一个 BigInt，如：10n 或者调用函数 BigInt()：

BigInt 与 Number 的不同点：

BigInt 不能用于 Math 对象中的方法。

BigInt 不能和任何 Number 实例混合运算，两者必须转换成同一种类型。

BigInt 变量在转换为 Number 变量时可能会丢失精度。

参考

原始数据类型

TypeScript BigInt

TypeScript Symbol

TypeScript 速成教程

Typescript 是 javascript 的类型超集，旨在简化大型 JavaScript 应用程序的开发。Typescript 加入了常见的概念例如 类（classes），泛型（generics），接口（interfaces）和静态类型（static types）并允许开发人员使用静态检查和代码重构等工具。

为什么在意 Typescript

现在问题仍然是为什么你应该优选使用 Typescript。这有一些关于为什么 javascript 开发者应该考虑学习 Typescript 的原因。

静态类型

Javascript 是动态类型的，这意味着直到在运行时实例化时，它不知道变量的类型，这可能导致项目中的问题和错误。Typescript 加入了对 Javascript 静态类型支持如果你正确的使用它处理由变量类型的错误设定引起的错误。您仍然可以完全控制输入代码的严格程度，或者甚至根本不使用类型。

更好的 IDE 支持

Typescript 相比 Javascript 一个更大的优势是更好的 IED 支持包括了来自 Typescript 编译器智能，实时的提示，调试以及更多功能。这里还有一大堆扩展进一步 提升你的 Typescript 开发体验。

应用新的 ECMAScript 特性

Typescript 使您可以使用最新的 ECMAScript 功能，并将它们转换到您选择的 ECMAScript 目标。这意味着您可以使用最新的工具开发应用程序，而无需担心浏览器支持。

什么时候你该使用它

到目前为止，我们应该知道为什么 Typescript 是有用的以及如何改善我们的开发体验。但它并不是解决所有问题的方法，当然也不能阻止你自己编写可怕的代码。那么让我们来看看你应该在哪里使用 Typescript。

当你拥有一个很大的代码库时

Typescript 是大型代码库的一个很好的补充，因为它可以帮助您防止许多常见错误。这尤其适用于多个开发人员工作在同一项目之中。

当你项目成员早已知道静态类型语言时

另一个明显使用 Typescript 的场景是当你和你的团队已经知道静态类型的语言像 Java 和 C# 不想改为编写 Javascript。

设置/建立

要设置 typescript，我们只需要使用 npm 包管理器安装它并创建一个新的 Typescript 文件。

安装完成之后我们可以继续探寻 Typescript 提供给我们的语法和功能特性。

类型

现在让我们来看看 Typescript 所提供的类型：

数值（Number）

Typescript 所有的值类型都是浮点数。所有的数字包括二进制和十六进制都是数值类型。

字符串（String）

与其他语言一样，Typescript 使用 String 数据类型来保存文本数据。

你还可以用反引号来应用多行字符串并嵌入表达式。

布尔类型（Boolean）

Typescript 支持所有的基本数据类型，布尔类型，值必须为 true 或者 false。

指定类型

现在我们已经有了基本的数据类型，我们可以看看你如何在 Typescript 中指定类型。基本上，您只需要在名称和冒号后面写出变量的类型。

单一类型

这里例子为我们如何为变量指定字符串数据类型

所有其他数据类型也是这样使用。

多类型

你仍然可以通过 | 操作符为你的变量指定多个数据类型：

这里我们使用|为变量分配两种类型。现在我们可以在其中存储字符串和数值。

类型检测

现在让我们看看我们如何检查我们的变量是否具有正确的类型。我们有多种选择，但在这里我只展示了两个最常用的选项。

Typeof

typeof 仅仅知道基本类型。这意味着它只能检查变量是否是我们上面定义的数据类型之一。

在此示例中，我们创建一个字符串类型变量并使用 typeof 命令检查 str 是否为 Number 类型（始终为 false）。然后我们打印是否是数值。

Instanceof

instanceof 运算符与 typeof 几乎相同，只是它还可以检查 javascript 尚未定义的自定义类型。

在这里，我们创建一个自定义类型，我们稍后将在本文中讨论，然后创建它的实例。之后，我们检查它是否真的是 Human 类型的变量，如果是，则在控制台中打印。

类型断言

有时我们还需要将变量转换为特定的数据类型。这经常发生在你已经指定了一个泛型类型像 any 并且你想使用它具体的类型的方法。

有很多选择可以解决这个问题，但在这里我只分享其中两个。

As 关键字

通过在变量名之后使用 as 关键字跟随具体的数据类型来转换变量的类型。

这里我们将 str 变量转换为字符串，以便我们可以使用 length 属性（如果您的 TSLINT 设置允许，甚至可以在没有转换的情况下工作）。

操作符

我们也可以使用 运算符，它与 as 关键字具有完全相同的效果，只有语法差异。

此代码块与上面的代码块具有完全相同的功能。它只是语法不同。

数组

Typescript 中的数组是相同对象的集合，可以用两种不同的方式创建。

创建数组

使用 []

我们可以通过指定类型后跟 [] 来定义数组对象，以表示它是一个数组。

在这个例子中，我们创建一个字符串数组，它包含三个不同的字符串值。

使用泛型数组

我们还可用指定 Array 定义泛型数组

这里我们创建一个数值数组，它包含 5 个不同的数字。

多（混合）类型数组

此外，我们还可以使用 | 操作符将多个类型分配给单个数组。

此例中我们创建了一个数值可以包含字符串和数值。

多维数组

Typescript 还允许我们定义多维数组，这意味着我们可以将数组保存在另一个数组中。我们可以通过使用多个[]运算符来创建一个多维数组。

这里我们创建一个包含另一个数字数组的数组。

元组（Tupels）

元组基本类似数组但有一点不同。我们可以定义每个位子上储存数据的类型。这意味着我们可以通过方括号内的枚举来限制固定索引位置的类型。

在此列中，我们定义了一个简单的元组，在索引 0 位置上指定为数值类型，在索引为 1 位置上指定为字符串类型。这意味着如果我们尝试在此索引上放置另一种数据类型，则会抛出错误。

以下是非法元组的示例：

枚举（Enums）

与大多数其他面向对象编程语言一样，Typescript 中的枚举允许我们定义一组命名常量。 Typescript 还提供基于数值和基于字符串的枚举。使用 enum 关键字定义 Typescript 中的枚举。

数值枚举

首先，我们将查看数值枚举，其中我们将键值与索引匹配。

上面，我们定义了数值枚举将 Playing 初始化为 0，Paused 为 1 等等。

我们也可以将初始化器留空，而 Typescript 会从零开始自动索引它。

字符串枚举

定义字符串枚举也十分简单，我们只需要在定义的每个枚举值后初始化字符串值。

这里我们通过使用字符串初始化我们的状态来定义字符串枚举。

对象（Objects）

Typescript 中的对象是包含一组键值对的实例。这些值可以是变量，数组甚至函数。它也被视为表示非基本类型的数据类型。

我们可以使用大括号创建一个对象：

这里我们创建了一个 human 对象包含三个不同的键值对。

我们可以为对象加入方法：

自定义类型

Typescript 还允许我们自定义类型，以便于我们后续重用。要创建自定义类型，我们只需要使用 type 关键字并定义我们的类型。

在此示例中，我们定义了一个名为 Human 包含三个属性的自定义类型。现在让我们看看如何创建这种类型的对象。

在这里，我们创建自定义类型的实例并设置所需的属性。

方法参数和返回类型

Typescript 允许我们为方法参数和返回值指定数据类型。现在让我们看一下使用 Typescript 定义函数的语法。

这里我们有两个示例函数，它们都具有定义类型的参数。我们还看到在结束括号后定义返回类型。

现在我们可以像普通的 javascript 一样调用我们的函数，但编译器会检查我们是否为函数提供了正确的参数。

可选属性

Typescript 允许我们为方法(注：接口等同样可以定义可选属性)定义可选属性。我们通过 ? 操作符定义。

在这个例子中，lastName 是一个可选参数，这意味着当我们不提供调用函数时，我们不会从编译器中获得错误。

这表示 2 个示例都被视为正确的。

默认值

我们使用可选属性的第二种方法是为它指定一个默认值。我们可以通过直接在函数头部赋值来实现。

在此例我中我们 lastName 赋予了默认值这意味着我们不必每次调用方法时提供它。

接口（Interfaces）

让我们看个例子让定义更加清晰：

可选属性

在 Typescript 中，有时并不是所有接口属性都是必需的。可以使用 ? 运算符在属性后面将其设置为可选。

在这里，我们创建一个具有一个普通和一个可选属性的接口，该属性是使用 ? 运算符。这就是我们两个人初始化都有效的原因。

只读属性

我们的接口中一些属性也应该只在首次创建对象时修改赋值。我们可以通过将 readonly 关键字放在我们的属性名称之前来指定此功能。

在此示例中，id 属性是只读的，在创建对象后无法更改。

模块（Barrels Modules）

Barrels 允许我们在一个更方便的模块中汇总多个导出模块。

我们仅需要创建一个新文件，它将导出我们项目中的多个模块 (译者注：根据 ECMAScript 定义一个文件定义一个模块，此处可能表示模块聚合(类似库等的入口文件))。

之后我们可以通过这个便利的单一导入语句引入这些模块。

泛型（Generics）

泛型允许我们创建兼容广泛类型而不是单一类型的组件。这使得我们的组件“ 开放”和复用。

现在您可能想知道为什么我们不只是使用任何（ any ）类型来使组件接受多种类型而不是单一类型。让我们看一个例子更好地了解。

我们想要一个简单的假函数（dummy function），它返回传入的参数：

然而 any 是通用的，某种程度它能接受所有类型参数但有一个很大的区别。我们丢失了我们传入的参数是什么类型以及返回值是什么类型。

所以让我们来看看，我们如何接受所有类型并知道它返回值的类型。

这里我们使用泛型参数 T，因此我们可以捕获变量类型并在以后使用它。我们还使用它作为返回参数类型，它允许我们在检查代码时看到相应的类型。

更多详细介绍你可以查看Charly Poly关于Generics and overloads的文章

访问修饰符（Access Modifiers）

访问修饰符控制我们类成员的可访问性。 Typescript 支持三种访问修饰符 - 公共的（public），私有的（private）和受保护的（protected）。

公共的

公共成员可以在任何地方访问，没有任何限制 这也是标准修饰符，这意味着您不需要使用 public 关键字为变量添加前缀。

私有的

私有成员只能在其定义的类中能访问。

受保护的

保护成员只能在其定义的类及其子类中访问。

TSLINT

TSLINT 是 Typescript 的标准 linter，可以帮助我们编写干净，可维护和可读的代码。它可以使用我们自己的 lint 规则，配置和格式化程序进行自定义。

设置

首先我们需要安装 Typescript 和 tslint，我们可以全局安装和局部安装：

之后，我们可以使用 TSLINT CLI 在我们的项目中初始化 TSLINT。

现在我们有了 tslint.json 文件，我们可以开始配置我们的规则了。

配置

TSLINT 允许使用配置我们自己的规则并自定义代码的外观。默认情况下，tslint.json 文件看起来像这样，只使用默认规则。

我们可以通过将它们放在 rules 对象中来添加其他规则。

有关所有可用规则的 概述，您可以查看官方文档。

结论

恭喜您一路走到最后！希望此篇文章帮助您理解 Typescript 的基础知识以及如何在项目中使用。

如果您发现这个有用，请考虑推荐并与其他开发人员共享。也可以访问我的网站学习更多。

如果您有任何问题和反馈，在以下评论中让我知道。

TypeScript 系统入门到项目实战

### 课程介绍

TS在构建大型应用上的优势，以及与JS的完美互通，让TS未来一片光明，从0到1系统学习，把TS真正应用到框架和项目中。

在迷你“全栈”项目中学习TypeScript，以TypeScript完整串联前后端

基础与实战“融合”，将知识讲解融于项目开发中，让你更快的掌握TS工程开发所必须的知识点

### 目录

第1章 课程导学

本章主要介绍课程的知识大纲，学习前提，讲授方式及预期收获。

1-1 都2020了，还不抓紧学TypeScript?

第2章 TypeScript 基础语法入门

本章主要帮助大家理解 TypeScript 可以解决的问题和所带来的优势，帮助大家理解 TS 中的各种静态类型，包括：函数，数组，元组，类，抽象类接口等，迅速帮助大家理解 TS 的基础使用方式和语法。

2-1 安装 VsCode 编辑器

2-2 TypeScript的定义

2-3 TypeScript带来了什么优势

2-4 TypeScript基础环境搭建

2-5 静态类型的深度理解

2-6 基础类型和对象类型

2-7 类型注解和类型推断

2-8 函数相关类型

2-9 基础语法复习

2-10 数组和元组

2-11 Interface接口

2-12 类的定义与继承

2-13 类中的访问类型和构造器

2-14 静态属性，Setter和Getter

2-15 抽象类

2-16 作业节

第3章 使用 TypeScript 编写爬虫工具

本章将带大家使用 TypeScript 编写一个获取网站课程销量的爬虫工具，过程中对上一章节学习的 TypeScript 基础知识进行实践巩固，同时借助 TypeScript 中的 OOP 编程方式，给大家讲解部分面向对象开发中的设计模式。

3-1 爬虫概述及正版密钥获取 (04:48)

3-2 使用SuperAgent和类型定义文件获取页面内容 (18:43)

3-3 使用cheerio进行数据提取 (12:32)

3-4 爬取数据的结构设计和存储 (18:00)

3-5 使用组合设计模式优化代码 (21:21)

3-6 单例模式实战复习 (07:24)

3-7 TypeScript的编译运转过程的进一步理解 (21:04)

3-8 作业节

第4章 TypeScript 语法进阶

本章将给大家讲解更多的 TypeScript 进阶语法以及原理性知识。包括如何进行 TypeScript 编译过程的配置，联合类型，类型保护，枚举类型，泛型等知识点。同时也给大家扩展讲解了类型定义文件的使用及编写方式等内容。通过本章的学习，大家基本可以掌握 TypeScript 中绝大部分的语法知识点。

4-1 TypeScript中的配置文件（上）

4-2 TypeScript中的配置文件（下）

4-3 作业节

4-4 联合类型和类型保护

4-5 Enum 枚举类型

4-6 函数泛型

4-7 类中的泛型以及泛型类型

4-8 命名空间-namespace（上）

4-9 命名空间-namespace（下）

4-10 import对应的模块化-缺代码

4-11 使用 Parcel 打包 TS 代码

4-12 描述文件中的全局类型（上）

4-13 描述文件中的全局类型（下）

4-14 模块代码的类型描述文件

4-15 作业节

4-16 泛型中keyof语法的使用

第5章 使用 Express 框架开发数据爬取及展示接口

本章将在 Express 框架中使用 TypeScript 的语法进行登陆，数据爬取和展示接口的开发，过程中对之前的基础语法进行实践巩固，同时讲解以 JavaScript 作为开发语言的框架中使用 TypeScript 会遇到的问题以及解决方案。

5-1 Express 基础项目结构搭建

5-2 使用TS编写常规express代码遇到的问题

5-3 扩展解决 Express 的类型定义文件问题

5-4 登陆功能的开发

5-5 统一接口数据结构，优化代码

第6章 TypeScript 高级语法

本章主要讲解 TypeScript 中，装饰器和元数据的语法知识，包括类装饰器，方法装饰器，属性装饰器和参数装饰器在本章中都会详细讲解，通过本章的学习，大家基本上完成了对 TypeScript 所有重点语法的学习。

6-1 类的装饰器（1）

6-2 类的装饰器（2）

6-3 方法装饰器

6-4 访问器的装饰器

6-5 属性的装饰器

6-6 参数装饰器

6-7 装饰器实际使用的小例子

6-8 reflect-metadata

6-9 装饰器的执行顺序

6-10 作业节

第7章 Express 项目代码改良

结合上一章学习的装饰器和元数据的语法知识，本章将通过面向对象的方式，对之前的接口代码进行全面重构，最终帮大家编写出和当前主流 Node 框架风格一致的后端应用代码，对上一章的知识点进行实战巩固，同时帮助大家理解 Node 框架设计背后的原理性知识。

7-1 创建控制器和装饰器

7-2 通过装饰器实现项目路由功能

7-3 多种请求方法装饰器的生成

7-4 .中间件装饰器的编写

7-5 .代码结构优化

7-6 .练习题：如何在一个方法上使用多个装饰器

第8章 使用 React 编写爬取数据的展示页面

本章将带大家使用TS的语法进行前端 React 代码的开发，过程中会给大家讲解在 React 和 Redux 等前端核心框架上如何正确巧妙的使用TypeScript。本章的最后，我们将产出一个完整的爬虫项目，并通过可视化的方式，对爬取到的数据进行展示。

8-1 初始化 React 项目

8-2 编写登陆表单

8-3 类型及路由的使用

8-4 前后端代码联调及登陆跳转逻辑开发

8-5 登陆退出功能完整优化

8-6 数据爬取功能打通及 Echarts 的使用

8-7 折线图数据处理及展示

8-8 接口数据类型的冗余定义问题

8-9 通过 Typescript 简化前后端协作模式

第9章 课程总结

本章将对整个项目所学习到的知识点进行总结，并给出大家进一步深入学习 TS 的方法和技巧。

9-1 课程总结及后续学习方法推荐

### 获取方式：TypeScript 系统入门到项目实战

typescript语言中如何直接读取excel中的数据到一个实例对象中？

VLOOKUP是一个查找函数，给定一个查找的目标，它就能从指定的查找区域中查找返回想要查找到的值。它的基本语法为：

VLOOKUP（查找目标，查找范围，返回值的列数，精确OR模糊查找)

下面以一个实例来介绍一下这四个参数的使用

例1：如下图所示，要求根据表二中的姓名，查找姓名所对应的年龄。

公式：B13 =VLOOKUP(A13,$B$2:$D$8,3,0)

参数说明：

1 查找目标：就是你指定的查找的内容或单元格引用。本例中表二A列的姓名就是查找目标。我们要根据表二的“姓名”在表一中A列进行查找。

公式：B13 =VLOOKUP(A13,$B$2:$D$8,3,0)

2 查找范围（VLOOKUP(A13,$B$2:$D$8,3,0) ）：指定了查找目标，如果没有说从哪里查找，EXCEL肯定会很为难。所以下一步我们就要指定从哪个范围中进行查找。VLOOKUP的这第二个参数可以从一个单元格区域中查找，也可以从一个常量数组或内存数组中查找。本例中要从表一中进行查找，那么范围我们要怎么指定呢？这里也是极易出错的地方。大家一定要注意，给定的第二个参数查找范围要符合以下条件才不会出错：