- TypeScript 基础
- TypeScript - 首页
- TypeScript - 路线图
- TypeScript - 概述
- TypeScript - 环境搭建
- TypeScript - 基本语法
- TypeScript 与 JavaScript 的区别
- TypeScript - 特性
- TypeScript - 变量
- TypeScript - let & const
- TypeScript - 运算符
- TypeScript 基本类型
- TypeScript - 类型
- TypeScript - 类型注解
- TypeScript - 类型推断
- TypeScript - 数字
- TypeScript - 字符串
- TypeScript - 布尔值
- TypeScript - 数组
- TypeScript - 元组
- TypeScript - 枚举
- TypeScript - any 类型
- TypeScript - never 类型
- TypeScript - 联合类型
- TypeScript - 字面量类型
- TypeScript - Symbol
- TypeScript - null 与 undefined
- TypeScript - 类型别名
- TypeScript 控制流
- TypeScript - 条件判断
- TypeScript - if 语句
- TypeScript - if else 语句
- TypeScript - 嵌套 if 语句
- TypeScript - switch 语句
- TypeScript - 循环
- TypeScript - for 循环
- TypeScript - while 循环
- TypeScript - do while 循环
- TypeScript 函数
- TypeScript - 函数
- TypeScript - 函数类型
- TypeScript - 可选参数
- TypeScript - 默认参数
- TypeScript - 匿名函数
- TypeScript - Function 构造函数
- TypeScript - rest 参数
- TypeScript - 参数解构
- TypeScript - 箭头函数
- TypeScript 接口
- TypeScript - 接口
- TypeScript - 接口扩展
- TypeScript 类和对象
- TypeScript - 类
- TypeScript - 对象
- TypeScript - 访问修饰符
- TypeScript - 只读属性
- TypeScript - 继承
- TypeScript - 静态方法和属性
- TypeScript - 抽象类
- TypeScript - 存取器
- TypeScript - 鸭子类型
- TypeScript 高级类型
- TypeScript - 交叉类型
- TypeScript - 类型守卫
- TypeScript - 类型断言
- TypeScript 类型操作
- TypeScript - 从类型创建类型
- TypeScript - keyof 类型运算符
- TypeScript - typeof 类型运算符
- TypeScript - 索引访问类型
- TypeScript - 条件类型
- TypeScript - 映射类型
- TypeScript - 模板字面量类型
- TypeScript 泛型
- TypeScript - 泛型
- TypeScript - 泛型约束
- TypeScript - 泛型接口
- TypeScript - 泛型类
- TypeScript 其他
- TypeScript - 三斜杠指令
- TypeScript - 命名空间
- TypeScript - 模块
- TypeScript - 环境声明
- TypeScript - 装饰器
- TypeScript - 类型兼容性
- TypeScript - Date 对象
- TypeScript - 迭代器和生成器
- TypeScript - Mixin
- TypeScript - 实用类型
- TypeScript - 装箱和拆箱
- TypeScript - tsconfig.json
- 从 JavaScript 到 TypeScript
- TypeScript 有用资源
- TypeScript - 快速指南
- TypeScript - 有用资源
- TypeScript - 讨论
TypeScript - 基本语法
语法定义了一套编写程序的规则。每种语言规范都定义了自己的语法。TypeScript 程序由以下部分组成:
- 模块
- 函数
- 变量
- 语句和表达式
- 注释
你的第一个 TypeScript 代码
让我们从传统的“Hello World”示例开始:
var message:string = "Hello World" console.log(message)
编译后,它将生成以下 JavaScript 代码。
var message = "Hello World"; console.log(message);
第 1 行声明了一个名为 message 的变量。变量是程序中用于存储值的机制。
第 2 行将变量的值打印到提示符。这里,console 指的是终端窗口。log() 函数用于在屏幕上显示文本。
编译和执行 TypeScript 程序
让我们看看如何使用 Visual Studio Code 编译和执行 TypeScript 程序。请按照以下步骤操作:
步骤 1 - 将文件保存为 .ts 扩展名。我们将文件保存为 Test.ts。代码编辑器会在您保存文件时标记代码中的错误(如有)。
步骤 2 - 在 VS Code 的资源管理器窗格中,右键单击“工作文件”选项下的 TypeScript 文件。选择“在命令提示符中打开”选项。
步骤 3 - 要编译文件,请在终端窗口中使用以下命令。
tsc Test.ts
步骤 4 - 文件编译为 Test.js。要运行编写的程序,请在终端中键入以下内容。
node Test.js
编译器标志
编译器标志使您能够在编译期间更改编译器的行为。每个编译器标志都公开一个设置,允许您更改编译器的行为。
下表列出了与 TSC 编译器关联的一些常用标志。典型的命令行用法使用某些或所有开关。
| 序号 | 编译器标志和说明 |
|---|---|
| 1. | --help 显示帮助手册 |
| 2. | --module 加载外部模块 |
| 3. | --target 设置目标 ECMA 版本 |
| 4. | --declaration 生成额外的 .d.ts 文件 |
| 5. | --removeComments 从输出文件中删除所有注释 |
| 6. | --out 将多个文件编译到单个输出文件 |
| 7. | --sourcemap 生成源映射 (.map) 文件 |
| 8. | --noImplicitAny 禁止编译器推断 any 类型 |
| 9. | --watch 监视文件更改并动态重新编译 |
注意 - 可以一次编译多个文件。
tsc file1.ts, file2.ts, file3.ts
TypeScript 中的标识符
标识符是赋予程序中元素(如变量、函数等)的名称。标识符的规则如下:
标识符可以包含字符和数字。但是,标识符不能以数字开头。
标识符不能包含特殊符号,下划线 (_) 或美元符号 ($) 除外。
标识符不能是关键字。
它们必须是唯一的。
标识符区分大小写。
标识符不能包含空格。
下表列出了一些有效和无效标识符的示例:
| 有效标识符 | 无效标识符 |
|---|---|
| firstName | Var |
| first_name | first name |
| num1 | first-name |
| $result | 1number |
TypeScript ─ 关键字
关键字在语言环境中具有特殊含义。下表列出了一些 TypeScript 关键字。
| break | as | any | switch |
| case | if | throw | else |
| var | number | string | get |
| module | type | instanceof | typeof |
| public | private | enum | export |
| finally | for | while | void |
| null | super | this | new |
| in | return | true | false |
| any | extends | static | let |
| package | implements | interface | function |
| new | try | yield | const |
| continue | do | catch |
空格和换行符
TypeScript 忽略程序中出现的空格、制表符和换行符。您可以在程序中自由使用空格、制表符和换行符,并且可以自由地以整洁一致的方式格式化和缩进程序,从而使代码易于阅读和理解。
TypeScript 区分大小写
TypeScript 区分大小写。这意味着 TypeScript 区分大写和小写字符。
分号是可选的
每行指令称为语句。TypeScript 中的分号是可选的。
示例
console.log("hello world")
console.log("We are learning TypeScript")
单行可以包含多个语句。但是,这些语句必须用分号分隔。
TypeScript 中的注释
注释是提高程序可读性的一种方法。注释可用于包含有关程序的其他信息,例如代码作者、有关函数/结构的提示等。编译器会忽略注释。
TypeScript 支持以下类型的注释:
单行注释 ( // ) - // 和行尾之间的任何文本都被视为注释
多行注释 (/* */) - 这些注释可以跨越多行。
示例
//this is single line comment /* This is a Multi-line comment */
TypeScript 和面向对象编程
TypeScript 是面向对象的 JavaScript。面向对象编程是一种遵循现实世界建模的软件开发范例。面向对象编程将程序视为对象的集合,这些对象通过称为方法的机制相互通信。TypeScript 也支持这些面向对象的组件。
对象 - 对象是任何实体的实时表示。根据 Grady Brooch 的说法,每个对象必须具有三个特征:
状态 - 由对象的属性描述
行为 - 描述对象的行为方式
标识 - 一个唯一值,将对象与一组类似的对象区分开来。
类 - 在 OOP 中,类是创建对象的蓝图。类封装了对象的数据。
方法 - 方法促进对象之间的通信。
示例:TypeScript 和面向对象编程
class Greeting {
greet():void {
console.log("Hello World!!!")
}
}
var obj = new Greeting();
obj.greet();
上面的示例定义了一个类 Greeting。该类具有一个方法 greet()。该方法在终端上打印字符串“Hello World”。new 关键字创建类的对象 (obj)。该对象调用方法 greet()。
编译后,它将生成以下 JavaScript 代码。
var Greeting = (function () {
function Greeting() {
}
Greeting.prototype.greet = function () {
console.log("Hello World!!!");
};
return Greeting;
}());
var obj = new Greeting();
obj.greet()
上面程序的输出如下:
Hello World!!!