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

初见TypeScript

类型语言,在代码规模逐渐增大时,类型相关的错误难以排查。TypeScript 由微软开发,它本质上是 JavaScript 的超集,为 JavaScript 添加了静态类型系统,让开发者在编码阶段就能发现潜在类型错误,提升代码质量,使代码更具可维护性。以变量声明为例,JavaScript 中声明变量无需指定类型,而 TypeScript 能让开发者为变量、函数参数和返回值指定类型。​

环境搭建​

  1. 安装 Node.js:TypeScript 基于 Node.js 运行,可从 Node.js 官方网站下载安装包,按提示完成安装。安装后,在命令行输入node -v和npm -v,若显示版本号,说明安装成功。​
  1. 全局安装 TypeScript:打开命令行,执行npm install -g typescript,安装完成后,输入tsc -v,若显示版本号,说明 TypeScript 安装成功。​

第一个 TypeScript 程序​

在项目目录下新建hello.ts文件,输入以下代码:​

TypeScript

取消自动换行复制

let message: string = 'Hello, TypeScript!';​

console.log(message);​

在命令行进入hello.ts所在目录,执行tsc hello.ts,这会生成对应的hello.js文件。运行node hello.js,就能在控制台看到输出的Hello, TypeScript!。上述代码中,let message: string声明了一个类型为string的变量message,避免给message赋值非字符串类型数据,降低运行时错误风险。​

第二篇:TypeScript 类型系统详解​

基础类型​

TypeScript 支持多种基础类型,如number、string、boolean、null、undefined、symbol和bigint。示例如下:​

TypeScript

取消自动换行复制

let age: number = 25;​

let name: string = 'John';​

let isStudent: boolean = true;​

let n: null = null;​

let u: undefined = undefined;​

let sym: symbol = Symbol('id');​

let big: bigint = BigInt(100);​

数组类型​

定义数组有两种方式。一是在元素类型后加[],如let numbers: number[] = [1, 2, 3];;二是使用泛型语法Array<类型>,如let names: Array<string> = ['Alice', 'Bob'];。​

函数类型​

为函数定义参数和返回值类型,能让代码更清晰。例如:​

TypeScript

取消自动换行复制

function add(a: number, b: number): number {​

urn a + b;​

} ret​

上述add函数接受两个number类型参数,返回值也是number类型。​

类型推断​

TypeScript 能根据变量赋值自动推断类型。如let num = 10;,TypeScript 会推断num为number类型。尽管有类型推断,为提高代码可读性,复杂场景下仍建议显式指定类型。​

第三篇:深入 TypeScript 高级特性​

接口​

接口用于定义对象的形状,确保对象符合特定结构。示例如下:​

TypeScript

取消自动换行复制

interface User {​

name: string;​

age: number;​

}​

function printUser(user: User) {​

console.log(`Name: ${user.name}, Age: ${user.age}`);​

}​

let tom: User = { name: 'Tom', age: 30 };​

printUser(tom);​

上述代码定义了User接口,printUser函数接受符合User接口的对象。​

类​

TypeScript 的类支持面向对象编程特性,如封装、继承和多态。下面是一个简单的类示例:​

TypeScript

取消自动换行复制

class Animal {​

name: string;​

constructor(name: string) {​

this.name = name;​

}​

speak() {​

console.log(`${this.name} makes a sound.`);​

}​

}​

class Dog extends Animal {​

speak() {​

console.log(`${this.name} barks.`);​

}​

}​

let myDog = new Dog('Buddy');​

myDog.speak();​

上述代码中,Dog类继承自Animal类,并重写了speak方法。​

泛型​

泛型让开发者创建可复用的组件,在定义函数、接口或类时不指定具体类型,而是在使用时指定。例如:​

TypeScript

取消自动换行复制

function identity<T>(arg: T): T {​

return arg;​

}​

let result = identity<number>(5);​

上述identity函数使用泛型T,可接受任意类型参数并返回相同类型值。

相关文章:

  • 微信小程序—路由
  • Qt 入门 0 之 QtCreator 简介
  • 【微服务架构】SpringCloud Alibaba(八):Nacos 2.1.0 作为配置中心(Nacos的使用)
  • SpringAI+MCP协议 实战
  • 第六章:框架实战:构建集成向量与图谱的 RAG 应用
  • Qt的window注册表读写以及删除
  • VBA数据库解决方案第二十讲:SQL在VBA中几种常见的表达方式
  • 11.使用依赖注入容器实现松耦合
  • Gerapy二次开发:git项目实现变更拉取与上传
  • 蓝桥与力扣刷题(74 搜索二维矩阵)
  • Docker基础1
  • Jetpack Compose 生产级语言切换架构:ViewModel + Flow 的终极实现
  • 今是科技发布全新测序仪G-seq1M:以效率与精准引领基因测序新标杆
  • java后端开发day34--脑子空空如何无痛想起所有知识点--概念拟人化
  • 4月5日作业
  • 架构师面试(二十七):单链表
  • 【嵌入式学习3】UDP发送端、接收端
  • 数据库系统-数据库控制
  • 大模型快速 ASGI 服务器uvicorn
  • 石头剪刀布游戏
  • 100款免费软件网站大全/营销渠道的概念
  • 平谷区住房城乡建设委官方网站/拉新推广赚钱的app
  • 无锡网站建设/seo引擎优化服务
  • 搜狗引擎网站收录/软文撰写
  • 用什么做网站方便/手机创建网站教程
  • 湖南做网站 找磐石网络一流/百度指数怎么查