当前位置: 首页 > article >正文

1. TypeScript基本语法

TypeScript 学习总结

TypeScript 是一种 JavaScript 的超集,增加了静态类型检查和编译时错误检测,从而提高了代码的可维护性和可靠性。以下是 TypeScript 的基础知识总结,包括语法、运算符、数据类型、变量声明和作用域。

## 基本语法

TypeScript 的基本语法与 JavaScript 相似,但增加了一些重要的功能:

- **变量声明**:
  TypeScript 支持 `let`、`const` 和 `var` 声明变量。推荐使用 `let` 和 `const` 以确保更好的代码安全性。
  ```typescript
  let name: string = 'Alice';
  const age: number = 30;
  • 函数
    函数的参数和返回值可以指定类型,从而确保函数的调用与实现的一致性。

    function greet(person: string, age: number): string {
      return `Hello ${person}, you are ${age} years old.`;
    }
    
  • 接口
    使用接口(interface)来定义对象的形状,提供了结构化的代码组织方式。

    interface Person {
      name: string;
      age: number;
    }
    
    const person: Person = {
      name: 'Bob',
      age: 25
    };
    

运算符

TypeScript 中的运算符大多与 JavaScript 中的运算符相同:

  • 算术运算符

    let x: number = 10;
    let y: number = 5;
    console.log(x + y); // 输出 15
    console.log(x - y); // 输出 5
    console.log(x * y); // 输出 50
    console.log(x / y); // 输出 2
    
  • 比较运算符

    let a: number = 10;
    let b: number = 20;
    console.log(a === b); // 输出 false
    console.log(a !== b); // 输出 true
    console.log(a > b);  // 输出 false
    
  • 逻辑运算符

    let isTrue: boolean = true;
    let isFalse: boolean = false;
    console.log(isTrue && isFalse); // 输出 false
    console.log(isTrue || isFalse); // 输出 true
    console.log(!isTrue); // 输出 false
    
  • 赋值运算符

    let num: number = 10;
    num += 5; // 相当于 num = num + 5
    console.log(num); // 输出 15
    

基础数据类型

TypeScript 提供了几种基础数据类型:

  • number:双精度 64 位浮点值。

    let num: number = 42;
    
  • string:字符系列,可以使用单引号(')、双引号(")或反引号(`)定义。

    let str: string = "Hello, TypeScript!";
    
  • boolean:表示逻辑值:truefalse

    let isActive: boolean = true;
    
  • enum:枚举类型用于定义数值集合。

    enum Color {Red, Green, Blue};
    let c: Color = Color.Blue;
    console.log(c);    // 输出 2
    
  • void:用于标识方法返回值的类型,表示该方法没有返回值。

    function logMessage(message: string): void {
      console.log(message);
    }
    
  • 其他数据类型

    • nullundefined:表示无值或未定义。
    • any:可以是任意类型。
    • never:表示从不会出现的值,例如函数抛出异常或无限循环。

变量声明

TypeScript 支持多种变量声明方式:

  • 声明变量并指定类型

    let uname: string = "hello";
    
  • 声明变量但没有初始值

    let uname: string;
    
  • 声明变量并初始化值,但不指定类型

    let uname = "hello"; // 类型推断为 string
    
  • 声明变量没有设置类型和初始值

    let uname; // 类型为 any,默认初始值为 undefined
    

变量作用域

变量作用域指定了变量定义的位置,并决定了变量的可用性。TypeScript 中有以下几种作用域:

  • 全局作用域:定义在程序结构的外部,可以在任何位置使用。

    var global_num = 12; // 全局变量
    
  • 类作用域:类中的变量称为字段,可以通过类的对象访问,也可以是静态的,通过类名访问。

    class Numbers { 
      num_val = 13;      // 实例变量
      static sval = 10;  // 静态变量
      
      storeNum(): void { 
        var local_num = 14; // 局部变量
      } 
    } 
    
  • 局部作用域:在函数或代码块内部定义的变量,仅在该作用域内可用。

    function example() {
      var local_num = 20; // 局部变量
    }
    

代码运行地址

您可以在 TypeScript 在线运行界面 上测试以下代码:

const hello: string = "Hello World!";
console.log(hello);

总结

通过 TypeScript 的静态类型检查、类型推断、接口、泛型等功能,我们能够编写更可靠、更易于维护的代码。理解和应用这些基础语法、运算符、数据类型和变量作用域,有助于提升代码质量和开发效率。
``


http://www.kler.cn/a/312578.html

相关文章:

  • 43.第二阶段x86游戏实战2-提取游戏里面的lua
  • C语言第十一周课——函数的调用
  • 如何线程安全的使用HashMap
  • 修改Mysql 8 的密码
  • 自监督学习:机器学习的未来新方向
  • 从零开始使用Intel的AIPC使用xpu加速comfyui
  • LangChain 和 Elasticsearch 加速构建 AI 检索代理
  • 练习题 - Django 4.x Models Relationship fields 字段关联关
  • 等保测评中的关键技术挑战与应对策略
  • three.js shader 实现天空中白云
  • 用 Docker 部署 Seafile 社区版
  • C++学习指南(六)----list
  • 【docker】阿里云使用docker,2024各种采坑
  • 【笔记】扩散模型(八):DALL-E 2 (unCLIP) 论文解读与代码实现
  • C++设计模式——Interpreter解释器模式
  • 科技修复记忆:轻松几步,旧照变清晰
  • Android mmap分析
  • Linux进阶命令-scp
  • k8s快速搭建+prometheus部署及使用(纯干货!!!)
  • 基于正点原子Linux开发板的智能监控与家电控制系统设计:深度解析Video4Linux和TCP/IP技术栈
  • android 删除系统原有的debug.keystore,系统运行的时候,重新生成新的debug.keystore,来完成App的运行。
  • Web开发:Thymeleaf模板引擎
  • Redis系列之底层数据结构SDS
  • 编程技巧:SQL 处理超大查询
  • 对商品分类系统的若干问题的思考
  • 【Linux】程序地址空间