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

TypeScript核心语法(2)——基本用法

类型声明​

TypeScript 代码最明显的特征,就是为 JavaScript 变量加上了类型声明。

typescript

let foo: string;

上面示例中,变量foo的后面使用冒号,声明了它的类型为string

类型声明的写法,一律为在标识符后面添加“冒号 + 类型”。函数参数和返回值,也是这样来声明类型。

function toString(num: number): string {
  return String(num);
}

上面示例中,函数toString()的参数num的类型是number。参数列表的圆括号后面,声明了返回值的类型是string

注意,变量的值应该与声明的类型一致,如果不一致,TypeScript 就会报错。

// 报错
let foo: string = 123;

上面示例中,变量foo的类型是字符串,但是赋值为数值123,TypeScript 就报错了。

另外,TypeScript 规定,变量只有赋值后才能使用,否则就会报错。

let x: number;
console.log(x); // 报错

上面示例中,变量x没有赋值就被读取,导致报错。而 JavaScript 允许这种行为,不会报错,没有赋值的变量会返回undefined

类型推断​

类型声明并不是必需的,如果没有,TypeScript 会自己推断类型。

let foo = 123;

上面示例中,变量foo并没有类型声明,TypeScript 就会推断它的类型。由于它被赋值为一个数值,因此 TypeScript 推断它的类型为number

后面,如果变量foo更改为其他类型的值,跟推断的类型不一致,TypeScript 就会报错。

let foo = 123;
foo = "hello"; // 报错

上面示例中,变量foo的类型推断为number,后面赋值为字符串,TypeScript 就报错了。

TypeScript 也可以推断函数的返回值。

function toString(num: number) {
  return String(num);
}

上面示例中,函数toString()没有声明返回值的类型,但是 TypeScript 推断返回的是字符串。正是因为 TypeScript 的类型推断,所以函数返回值的类型通常是省略不写的。

从这里可以看到,TypeScript 的设计思想是,类型声明是可选的,你可以加,也可以不加。即使不加类型声明,依然是有效的 TypeScript 代码,只是这时不能保证 TypeScript 会正确推断出类型。

值与类型​

学习 TypeScript 需要分清楚“值”(value)和“类型”(type)。

每一个值在 TypeScript 里面都是有类型的。比如,3是一个值,它的类型是number

TypeScript 代码只涉及类型,不涉及值。所有跟“值”相关的处理,都由 JavaScript 完成。

这一点务必牢记。TypeScript 项目里面,其实存在两种代码,一种是底层的“值代码”,另一种是上层的“类型代码”。前者使用 JavaScript 语法,后者使用 TypeScript 的类型语法。

它们是可以分离的,TypeScript 的编译过程,实际上就是把“类型代码”全部拿掉,只保留“值代码”。

编写 TypeScript 项目时,不要混淆哪些是值代码,哪些是类型代码。


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

相关文章:

  • 贝叶斯统计:高斯分布均值μ的后验分布推导
  • springMVC 全局异常统一处理
  • 网络安全相关证书资料
  • 系统监控——分布式链路追踪系统
  • 查询优化:条件下推
  • Elasticsearch ILM 索引生命周期管理讲解与实战
  • Midjourney Describe API 的对接和使用
  • Maven 常用命令
  • 计算机视觉:从核心算法到实际应用的全面解析
  • 【热门主题】000077 物联网智能项目:开启智能未来的钥匙
  • axios的认识与基本使用
  • ZYNQ详解
  • 通讯专题4.1——CAN通信之计算机网络与现场总线
  • 3x3矩阵,1x1矩阵,3X3零矩阵融合,矩阵乘法
  • 《操作系统 - 清华大学》6 -3:局部页面置换算法:最近最久未使用算法 (LRU, Least Recently Used)
  • docker快速部署kafka
  • Poetry 使用
  • 【maven-5】Maven 项目构建的生命周期:深入理解与应用
  • 偏差-方差权衡(Bias–Variance Tradeoff):理解监督学习中的核心问题
  • 新手SEO入门指南如何高效进行搜索引擎优化
  • ESLint CLI 深度解析:配置选项与高效工作流(5)
  • Python脚本:自动化下载视频的日志记录
  • 【从零开始的LeetCode-算法】3264. K 次乘运算后的最终数组 I
  • 使用lumerical脚本语言创建弯曲波导并进行数据分析(纯代码实现)
  • 【CSS in Depth 2 精译_062】第 10 章 CSS 中的容器查询(@container)概述 + 10.1 容器查询的一个简单示例
  • 安全见闻1