TypeScript核心语法

10分钟掌握TypeScript核心语法

关联：Javascript

要点

摘录

10 分钟掌握 TypeScript 核心语法（超实用速
通教程）
核心原则：不堆冗余知识点，只讲「开发 / 面试必用」语法，每 1 分钟攻克 1 个核心点，看完直接上手
写代码，零基础也能跟上！
前置准备：提前安装 TypeScript （安装配置完 node.js 后，终端输入 npm install -g typescript
， 10 秒完成，不耽误时间）。
安装后检查：
第 1 分钟：认识 TS （核心认知，不绕弯）

  • 定义： TypeScript （简称 TS ）是 JavaScript 的强类型超集，完全兼容 JS 所有语法。
  • 核心区别： TS 多了「静态类型检查」，写代码时就报错，避免 JS 运行时才发现问题。
    • 运行逻辑： TS 文件（ .ts ） → 编译成 JS 文件（ .tsc 文件名 .ts ） → 正常运行（ node 文件名 .js ）。
    第 2 分钟：基础类型（必背，最常用）
    核心：给变量加「类型注解」（ : 类型），约束变量类型，写错直接报错，入门关键。
    tsc -v1
    关键提醒： any 尽量少用，用了等于放弃 TS 的类型优势。
    第 3 分钟：数组 & 元组（处理多值场景）
    两种常用容器，区分清楚，避免用错：
    第 4 分钟：函数类型（高频考点，开发必写）
    核心：给「参数」和「返回值」加类型，规范函数输入输出，避免传错参数。
    第 5 分钟：接口 Interface （ TS 灵魂，团队协作必备）
    核心：定义「对象的结构」，规定对象必须有哪些属性、属性是什么类型，避免对象结构混乱。
    // 6 种常用基础类型，直接记，不用死抠概念
    let name: string = " 张三 ";  // 字符串
    let age: number = 18;       // 数字（整数 / 小数都适用）
    let isLogin: boolean = true;// 布尔值（ true/false ）
    let u: undefined = undefined;// 未定义
    let n: null = null;         // 空值
    let anyVal: any = 123;      // 任意类型（关闭 TS 检查，少用！）
    1
    2
    3
    4
    5
    6
    7
    // 1. 数组：所有元素类型统一（最常用）
    let numArr: number[] = [1, 2, 3];  // 数字数组
    let strArr: Array = ["a", "b"]; // 另一种写法（通用）
    // 2. 元组：固定长度 + 固定类型（特殊场景用，比如接口返回固定结构）
    let userInfo: [string, number] = [" 张三 ", 18]; // 第一个必须是字符串，第二个必须是数
    字
    1
    2
    3
    4
    5
    6
    // 1. 常规函数（明确参数类型 + 返回值类型）
    function sum(a: number, b: number): number {
    return a + b; // 必须返回数字，否则报错
    }
    // 2. 无返回值函数（用 void ）
    function logMsg(msg: string): void {
    console.log(msg); // 不用 return ，或 return undefined
    }
    // 3. 可选参数（ ? 标记，必须放在参数最后）
    function greet(name?: string): void {
    console.log( 你好， ${name || " 陌生人 "});
    }
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    // 定义接口（首字母大写，规范）
    interface User {
    id: nu

    资料