TypeScript---对象:不自在但实在

目录

JavaScript的对象

TypeScript的意义

TypeScript的核心

TypeScript的判断逻辑


如果你写过JavaScript,一定对对象不陌生。

javascript 复制代码
const user = {
  name: "Tom",
  age: 18
}

你可能会觉得:

"对象?这不就是个装数据的袋子吗?"

但当你走进TypeScript,你会突然发现------

对象不再是"随便装",而是"必须对得上号"。

这一步,很多人都会卡住。

JavaScript的对象

过于自由

javascript 复制代码
const user = { name: "Tom" }
user.age = 18
user.isAdmin = true

想加就加,想删就删。写得很爽,但项目一大就开始出事。

你一定见过这些场景:

  • 后端说有age,结果前端拿到是undefined
  • 同一个对象,不同地方字段不一样
  • 代码能跑,但数据是错的

问题不是对象,而是"对象没有规则"。

TypeScript的意义

给对象"立规矩"

TypeScript干了一件很重要的事:

在你写代码的时候,就先帮你检查对象长得对不对。

于是,对象在TS里第一次有了"结构意识"。

TypeScript 复制代码
let user: { name: string; age: number }

user = {
  name: "Tom",
  age: 18
}

这时候TypeScript会说:

  1. name有
  2. age有
  3. 类型也对

你过关!!!

TypeScript的核心

瞅瞅模样

一句话概括:

TypeScript关心的不是"这个对象是谁",而是"这个对象长什么样"。

这就是TypeScript的灵魂设计之一。

举个非常有感觉的例子

TypeScript 复制代码
function printUser(u: { name: string }) {
  console.log(u.name)
}

你传什么不重要:

TypeScript 复制代码
printUser({ name: "Alice" })
printUser({ name: "Bob", age: 20 })
printUser({ name: "Carol", role: "admin" })

只要它 "看起来像一个有name的对象",就行。

这就是所谓的------鸭子类型(Duck Typing)

"像鸭子、叫起来也像鸭子,那它就是鸭子。"

TypeScript的判断逻辑

只看形状,不看身份

在真实项目里:

  • 数据来自接口
  • 对象来自JSON
  • 根本没有class、没有new

TypeScript选择了一个非常现实的路线:只要结构对,就认。

这让TypeScript对前端、后端接口、配置对象、数据模型异常友好**。**

TypeScript 复制代码
function createUser(user: { name: string; age: number }) {
  // ...
}

TypeScript在这里做的事非常贴心:

  • 少一个字段->直接报错
  • 多写错一个类型->编译就提醒
  • IDE自动补全属性

你不是"被限制",你是被保护。

相关推荐
仿生狮子10 分钟前
OpenAI 攻下千禧年难题之后,开发者似乎无动于衷
前端·数学·vibecoding
夏幻灵3 小时前
JavaScript this 面试:五种绑定规则、优先级与常见面试陷阱
开发语言·javascript·面试
Lvan的前端笔记3 小时前
docker:每个前端项目一个 Nginx 容器还是只有一个Nginx容器
前端·nginx·docker
三天不学习4 小时前
Egg.js 4 突然爆火,原因是否归结于AI 原生落地需求爆发?
前端·javascript·全栈·egg.js
xcs194055 小时前
前端 vue 的前端页面debugger 进不去
前端·javascript·vue.js
明月_清风6 小时前
Deno 终局来了:从挑战 Node 到被 Cloudflare 收编
前端·后端·node.js
Csvn7 小时前
框架性能优化
前端
回眸&啤酒鸭8 小时前
【回眸】OpenSwarm 多智能体协作系统实战指南
大数据·前端·人工智能
用户69371750013848 小时前
2026,程序员的时代拐点到了
android·前端·后端
大龄秃头程序员8 小时前
一次 iBeacon + BLE 无感解锁方案的实现记录
前端