初面网初面网

Typescript

数据类型

数据类型分成两种：基本数据类型和对象类型。这两种又可以称为值类型和引用类型。

一般来说，我们常使用前一种描述方式，但是在涉及到需要深入数据存储的时候，常用后一种描述方式。

基本类型有：

  • 字符串 string
  • 数字 number
  • 布尔 boolean
  • 空 null
  • 未定义 undefined
  • Symbol

引用类型有：

  • 对象 Object
  • 数组 Array
  • 函数 Function
  • 正则 RegExp
  • 日期 Date

值类型与引用类型的区别

数据都是以二进制形式存储在内存或硬盘中。值类型存储在栈内存中，可以由名称即寻到地址；引用类型的数据则分成两部分分别存储，数据存储在堆内存中，变量名称存在栈内存中。所以，通过变量名称寻到的是其在栈内存的寻址地址，真正的数据地址是通过寻址地址由系统去寻到的。

值类型的声明与使用

let str:string;
str = "This is string";

let int01: number = 10;

let isOpen = false;

let nullVar = null;

let undefinedVar = undefined;

// Symbol 类型比较特殊，后面会单独说明

引用类型的声明与使用

// 对象类型
let userInfo = {
  name: "Tom",
  age: 18,
}

// 数组类型
let numArr: number[];
numArr = [1,2,3];

// 函数类型
const addNum = (num1: number, num2: number) => {
  return num1 + num2;
}

// 或
function multiNum(num1: number, num2: number){
  return num1 * num2;
}

// 正则和日期的使用场景虽然也很多，但是相较于其它三种就显得比较少了，而且它们的声明与使用比较复杂，会单独进行讲解

新增类型——元组 tuple

元组与数组相似，都可以存储一组数据，不同点在于，数组的数据必须类型相同，而元组允许存在不同类型的数据。

let tuple01 = [string,number,boolean];
tuple01 = [ "Tom", 16, false];    // 从左到右分别想表示名称、年龄、是否成年

别名配置及排错

在tsconfig.json中写入

{
  "compilerOptions": {
    "paths": {
      "@/*": ["./src/*"]
    }
  }
}

这样可以设置艾特符为src的别名。

但在编译时会有找不到模块的问题。这个问题其实不在 ts-node，而是因为 tsc 在编译代码时不会去把路径别名替换成对应的相对路径，所以 ts-node 用 tsc 编译完然后转交给 node 执行的时候自然就找不到 @/ 这个目录了。

解决方法是安装依赖：

npm install tsconfig-paths

然后，运行的命令写成：

"dev": "ts-node -r tsconfig-paths/register --files ./index.ts"

如果使用nodemon监听，还可以安装另一个工具：

npm install ts-node-dev

运行命令则改写成：

"dev": "tsnd -r tsconfig-paths/register --respawn ./index.ts"

但是打包时这一套又会不管用，此时有两种方法可以解决。

方法一：使用cross-env对打包后的文件执行运行（需要安装cross-env依赖）

安装依赖

npm install cross-env

运行

"start": "cross-env TS_NODE_BASEURL=./dist node -r tsconfig-paths/register .\\dist\\index.js"

TS_NODE_BASEURL覆盖了tsconfig.json中的baseurl

方法二：打包时将别名替换

安装依赖

npm install tsc-alias

运行命令

"build": "tsc && tsc-alias"

更新于 2025/2/26