TypeScript 随手记 —— 1

1. 什么是TypeScript

众所周知，JavaScript 是一种弱类型语言，就是不会预先进行编译，然后在执行的时候一边执行一边进行编译这种的，然后这样就非常容易出现问题。而且还不好解决。

然后为了解决这个问题，产生了TypeScript，TypeScript 是JavaScript 的一个超集，就是为了解决这个问题的，就像C/C++一样，预先进行了编译

这样可以提前发现问题，减轻麻烦。

2. TypeScript 和 JavaScript 的对比

JavaScript	TypeScript
依赖全局作用域，通过 `<script>` 标签顺序管理依赖。	基于模块（Module），通过 import/export 语句管理依赖。
可在HTML中混合使用多个 `<script>` 标签（内联或外部）。	通常通过模块导入 (import) 来组合 .ts、.js 等文件
默认不进行任何类型检查，即使代码有误也可能静默失败。	默认进行严格的类型检查，确保代码的类型安全。
无	提供多层级的控制机制，可以精细地开启或关闭检查。

3. 使用TypeScript的一个例子

参考项目： https://github.com/topics/hydrooj

配置代码

复制代码

{
"compilerOptions":{
	"target" : "ES2020" ,
	"module": "commonjs",
	"lib":[ "ES2020" , "DOM"]
	"outDir" : "./lib" , 
	"rootDir" : "./src",
	"strict" : true;
	"esModuleInterop" : true;
	"skipLibCheck" : true,
	"forceConsistentCasingInFileNames": true,
	"declaration" : true,
	"moduleResolution" : "node"
} , 
"include" : ["src / ** /* "],
"exclude" : ["node_modules"]

}

解释说明

json 复制代码

{
  "compilerOptions": {
    "target": "ES2020",                       //  编译为 ES2020 语法。
    "module": "commonjs",                     //   使用 CommonJS 模块系统（Node.js 风格）。
    "lib": ["ES2020","DOM"],                  // 包含 ES2020 和 DOM 的类型定义（例如 console、document、window）
    "outDir": "./lib",                        // 编译后的 JavaScript 文件输出目录。
    "rootDir": "./src",                       // TypeScript 源代码的根目录。
    "strict": true,                           // 启用所有严格的类型检查选项（严格模式）
    "esModuleInterop": true,                  // 帮助从 CommonJS 模块导入默认导入（例如 import React from 'react'）
    "skipLibCheck": true,                     //  跳过对声明文件（.d.ts）的类型检查。
    "forceConsistentCasingInFileNames": true, // 强制文件名大小写一致（处理 Windows/macOS 差异）
    "declaration": true,                      // 生成 .d.ts 声明文件。
    "moduleResolution": "node"                // 使用 Node.js 风格的模块解析算法。
  },
  "include": ["src/**/*"],                    // 包含 src 文件夹及其子文件夹中的所有文件。
  "exclude": ["node_modules"]                 // 排除 node_modules 文件夹
}

JS 的注释使用的是 // 和 /**/ , 不是
在定义数组时，使用的Array ，既是一个数组，又是一个对象。