TypeScript技术系列：基础类型详解与应用

前言

老铁们，好久好久好久没有更文了，想死你们了！！！^_^👄👄👄

接下来，欢迎来到TypeScript技术系列教程！在这个系列中，将带你从零开始学习TypeScript，逐步掌握这门强大的编程语言。TypeScript是JavaScript的超集，不仅支持JavaScript的所有特性，还添加了静态类型注解，使代码更健壮、更易于维护。

我们将从基础知识开始，一步步深入探讨TypeScript的各种特性和用法。无论你是初学者还是有一定经验的开发者，通过这个系列，你都能全面提升对TypeScript的理解和应用能力。

本篇文章作为系列的开篇，将详细介绍TypeScript的基本语法和原始类型。希望你能通过学习这些基础内容，打下坚实的基础，顺利开启TypeScript的学习之旅。让我们一起迈出这重要的第一步，探索TypeScript的世界吧！

1. TypeScript 简介

TypeScript是类型化的JavaScript，通过静态类型注解扩展JavaScript。虽然JavaScript支持原始数据类型如string和number，但它无法检测变量是否按约定的类型赋值，而TypeScript则能进行静态类型检测，从而在开发阶段就能发现和消除许多低级错误。如下图所示，TypeScript是JavaScript的超集：

2. 基本语法

在TypeScript中，我们可以使用类型注解来显式声明变量的类型。例如：

let num: number = 1;

num被声明为number类型，这意味着只能将数字赋值给num，否则会报错。

3. 原始类型

JavaScript中的原始类型包括string、number、bigint、boolean、undefined和symbol。在TypeScript中，这些类型同样存在，并且通过类型注解来进行静态类型检查。

3.1 字符串

在TypeScript中，字符串类型用string表示。我们可以使用单引号、双引号或模板字符串来定义字符串：

let firstname: string = 'Captain';
let familyname: string = String('S');
let fullname: string = `my name is ${firstname}.${familyname}`;

3.2 数字

TypeScript使用number类型表示所有的数字，包括整数和浮点数。同样，也支持二进制、八进制和十六进制表示法：

let integer: number = 6;
let decimal: number = 3.14;
let binary: number = 0b1010;
let octal: number = 0o744;
let hex: number = 0xf00d;
let big: bigint = 100n;

需要注意的是，number和bigint类型不兼容：

let big: bigint = 100n;
let num: number = 40;

big = num; // Error: Type 'number' is not assignable to type 'bigint'
num = big; // Error: Type 'bigint' is not assignable to type 'number'

3.3 布尔值

布尔类型用boolean表示，只有true和false两个值：

let isDone: boolean = false;
let isSuccess: boolean = true;

3.4 Symbol

Symbol是ECMAScript 6引入的一种新类型，用于生成独一无二的值。TypeScript也支持symbol类型：

let sym1: symbol = Symbol();
let sym2: symbol = Symbol('40');

4. 静态类型检测

TypeScript的一个重要特性是静态类型检测。编译器会在编译阶段检查类型是否正确，从而在开发阶段就能发现错误。例如：

const num1: number = 42;
const num2: number = "42"; // Error: Type 'string' is not assignable to type 'number'.

在以上示例中，num1被赋值为数字42，因此类型检测通过。而num2被赋值为字符串"42"，与number类型不匹配，因此会报错。

总结

通过为JavaScript添加静态类型注解，TypeScript提高了代码的健壮性和可维护性。掌握TypeScript的基本语法和原始类型，是我们深入学习和使用TypeScript的基础。在实际开发中，借助TypeScript的静态类型检测功能，我们可以在编写代码时及时发现和修复错误，提升开发效率和代码质量。

后语

小伙伴们，如果觉得本文对你有些许帮助，点个👍或者➕个关注再走吧^_^ 。另外如果本文章有问题或有不理解的部分，欢迎大家在评论区评论指出，我们一起讨论共勉。