TypeScript的类型声明和静态类型检查注意事项

注意: 使用小写的数据类型(ts官方推荐),定义类型的时候: 后最好加个空格(不加也能执行但不规范)

js中基本类型数据的类型声明

  • 使用变量: 数据类型声明数据类型,如let str: string,可以先声明后赋值和使用
ts 复制代码
let str: string = '321'
let number: number = 321
let flag: booleanv
flag = true

静态类型检查注意事项

  • 无法将 【不同类型】 的变量或常量赋值给对方:str = 321 不能将类型"number"分配给类型"string"
  • 无法和函数一样 【执行方法】str() 此表达式不可调用

js中引用数据类型的类型声明

函数

  • (x: number) (内)接受的参数 进行类型声明,在(): string ()后返回值进行类型声明
  • fucntion count(x: number, y: number): number{}let fun1 = (x: number, y: number): number => {}函数可以对接受的参数返回值进行类型声明
ts 复制代码
function count(x: number, y: number): string{
    return x + '' + y;
}
let fun1 = (x: number): number => {
    return 123 + x;
}

静态类型检查注意事项

  • 函数调用时候的 【实参类型】 要和定义时候的类型一样
  • 函数调用时候的 【实参个数】 要和定义的时候数量一样,注意: 多了少了都不行
  • 函数体内return的返回值要和 【返回值类型】 定义的返回值类型一样
ts 复制代码
// 【实参类型】不对
let fun1 = (x: number, y: number): number => {return x + y}
fun1(123,'321') // 报错:类型"string"的参数不能赋给类型"number"的参数
// 【实参个数】不对(多了少了都不行)
let fun2 = (x: number, y: number, z: number) => {return x + y + z}
fun2(123,321) // 报错:应有 3 个参数,但获得 2 个,未提供 "z" 的自变量
fun2(123,321,1234,4321) // 报错:应有 3 个参数,但获得 4 个。
// 【返回值类型】不对
function count(x: number, y: number): number{
    return x + y + ''; // 报错:不能将类型"string"分配给类型"number"
}

字面量类型声明和类型推断

后续会有文章单独详解字面量类型

  • let str: 'hello' :后面直接给变量一个写死的值,可以是任何数据类型

静态类型检查注意事项

  • 字面量类型声明的变量无法赋值除了 【定义值】 之外的任何值:str = '321' 不能将类型""321""分配给类型""hellow""

类型推断

  • let t: 99使用字面量声明时ts会自动推断对应的数据类型,此处为number

注意:any类型的变量可以赋值给任意类型

  • any类型的变量可以赋值给任意类型,不管any类型的变量后来被赋值成任意数据类型都不会报错
ts 复制代码
let str: string
let num: number
let hello: 'hello'
let x: any
x = true
str = x
num = x
hello = x
相关推荐
人间凡尔赛30 分钟前
2026 后端架构三驾马车:Wasm 容器上 K8s、存算分离与 AI 原生
后端·云原生·架构
凤山老林1 小时前
动态 i18n 体系落地:Spring Boot 多租户热加载与前后端协同实践
java·spring boot·后端·i18n
东风破_1 小时前
TypeScript 高级类型进阶:keyof、Exclude、Record 与类型组合思想
前端·后端·typescript
凤山老林2 小时前
数据库读写分离与动态路由实战:Spring Boot + ShardingSphere-JDBC 生产配置
数据库·spring boot·后端·分库分表·sharding-jdbc
DS随心转插件2 小时前
Grok生成的html怎么导出——AI导出鸭:大模型结构化输出的“最后一公里”工程化解构
前端·人工智能·ai·html·豆包·deepseek·ai导出鸭
এ慕ོ冬℘゜2 小时前
使用 jQuery 动态渲染表格与状态切换
前端·javascript·jquery
Zane19942 小时前
调用了 async 函数却没执行?一文讲透协程、event loop 与 await
后端·python
Zane19942 小时前
HashMap 为什么要在长度16、容量必须是2的幂这些细节上较劲
java·后端
人间凡尔赛2 小时前
2026 前端必修:4 个让 CSS 脱胎换骨的现代新特性(附实战代码)
前端·css
用户2181697049303 小时前
Flutter (二十) 轮播图
前端