文档教程【免费下载链接】typescript-bookThe Concise TypeScript Book: A Concise Guide to Effective Development in TypeScript. Free and Open Source.项目地址https://gitcode.com/gh_mirrors/typ/typescript-book点击查看免费下载TypeScript 是 JavaScript 的类型化超集这意味着 JavaScript 标准库中的全部内建对象global objects在 TypeScript 中开箱即用并额外获得类型检查、自动补全与编译期校验能力。本文以 The Concise TypeScript Bookwebsite/src/content/docs/book/common-built-in-js-objects.md韩文版见 website/src/content/docs/ko-kr/book/common-built-in-js-objects.md为骨架逐一拆解 15 个最常用的内建对象在 TypeScript 中的类型化用法并结合本书其他章节的源码示例讲清原理。读完本文你将能熟练为内建对象标注类型、区分包装对象与原语类型并在异步、集合、正则与国际化场景中写出类型安全的 TypeScript 代码。为什么说 TypeScript 天然包含内建 JS 对象JavaScript 的运行时环境浏览器、Node.js 等内置了一批全局对象如Function、Object、Array、Promise等。TypeScript 在语法上是 JavaScript 的类型化超集typed superset这一结论在本书的 TypeScript 介绍章节中有明确表述所有合法 JavaScript 代码都是合法的 TypeScript 代码。因此这些内建对象在 TypeScript 中无需任何安装、引入或声明即可直接使用并且 TypeScript 编译器自带的类型声明lib会为它们提供完整的类型签名。Mozilla Developer NetworkMDN文档网站提供了这些内建对象的权威完整清单与逐项 API 参考是查阅某个对象全部成员方法、属性的首选资料。本文下面列出的 15 个对象正是本书文档中标注的最常用清单FunctionObjectBooleanErrorNumberBigIntMathDateStringRegExpArrayMapSetPromiseIntl这些对象可以按职责划分为五个阵营值类型包装Boolean、Number、BigInt、String、核心语言设施Function、Object、Error、数据集合Array、Map、Set、计算工具Math、Date、RegExp、以及异步与国际化Promise、Intl。下面逐一展开。值类型及其包装对象String、Number、Boolean、BigInt这四组对象与 TypeScript 的四个基本原语类型一一对应。本书的 原语类型章节 明确指出 TypeScript 支持 7 种原语类型全部不可变const x: string x; const isReady: boolean true; const decimal: number 10; const y: bigint 9007199254740991n;而String、Number、Boolean、BigInt注意首字母大写是这些原语对应的包装对象boxed types。本书 Others 章节 的 Boxed types 小节给出了二者之间的映射关系string→Stringnumber→Numberboolean→Booleansymbol→Symbolbigint→BigInt当你在原语值上调用方法如A.normalize()时JavaScript 会临时把它包装成对象、调用方法后再丢弃。TypeScript 保留了这种区分并在原语类型上直接提供方法签名。最佳实践是始终使用小写的原语类型做类型标注避免使用包装对象类型。例如写const s: string x而不是const s: String x因为后者会引入不必要的对象装箱语义。对于bigint原语类型章节 特别提醒了两个约束bigint不能与number混用也不能传给内建Math的方法必须先强制转换到同一类型bigint仅在tsconfig.json的target为 ES2020 及以上时才可用。const x: bigint BigInt(9007199254740991); // 通过内置函数 BigInt() 创建 const y: bigint 9007199254740991n; // 通过字面量后缀 n 创建Number、String等对象在 JS 中同时扮演构造函数角色如Number(42)在 TypeScript 中这一用法同样被类型化Number(42)的返回值类型为number因此可以安全地参与数值运算。Object 与 Function一切类型的基础Object是所有非原语值的根。在 TypeScript 中描述对象形状的首选方式是接口interface与类型别名type alias本书 对象类型章节 给出了两种等价写法interface User { name: string; age: number; email?: string; // 可选属性 } type Point { x: number; y: number; };Function则代表可调用对象。TypeScript 为函数提供了更精确的签名标注方式例如箭头函数类型与返回类型标注见 TypeScript 介绍章节const sum (a: number, b: number): number a b;当一个函数以对象形式作为参数时也可以使用匿名对象类型这正是 对象类型章节 展示的写法const sum (x: { a: number; b: number }) x.a x.b; console.log(sum({ a: 5, b: 1 }));Object、Function这类通用内建类型通常只在你确实需要任意对象/任意函数时才直接作为标注使用更推荐用接口或具名类型别名精确描述形状让 TypeScript 提供更强的结构类型检查。Error 与异常处理Error 对象及自定义错误类型Error是所有运行时异常的基础对象。本书 Others 章节 的 Errors and Exception Handling 小节展示了在 TypeScript 中基于Error的标准异常处理模式。先用try/catch/finally捕获异常再用instanceof区分内置错误子类型try { // Code that might throw different types of errors } catch (error) { if (error instanceof TypeError) { // Handle TypeError } else if (error instanceof RangeError) { // Handle RangeError } else { // Handle other errors } }TypeScript 允许通过继承Error类构造自定义错误从而在类型层面表达更精确的错误语义class CustomError extends Error { constructor(message: string) { super(message); this.name CustomError; } } throw new CustomError(This is a custom error.);注意error变量在catch块中的类型通常是unknown在严格的useUnknownInCatchVariables配置下因此直接访问error.message之前需要先做类型收窄上面的instanceof分支就是最常见的收窄手段。Math 与 Date数值计算与时间处理Math是只读的静态对象提供Math.pow、Math.max、Math.floor等数值计算函数。本书在 Others 章节 的 TsDocs 示例与 ES7 指数运算符小节中多次使用了它function power(base: number, exponent: number) { return Math.pow(base, exponent); } power(10, 2); // function power(base: number, exponent: number): numberTypeScript 还支持比Math.pow更简洁的指数运算符**且**额外支持bigint操作数只需把target设置为es2016或更高console.log(2 ** (2 ** 2)); // 16Date用于表示与操作时间点。它的构造签名有多种重载无参构造当前时间、时间戳毫秒数、日期字符串、以及多个年月日参数TypeScript 会逐一校验这些重载。Date实例上的getTime()、toISOString()等方法同样具有完整的类型签名配合Date.now()即可获得当前时间戳number类型。RegExp正则表达式及编译期语法检查RegExp是 JavaScript 的正则表达式对象。TypeScript 从 5.5.4 版本起见 Others 章节 的 Regular Expression Syntax Checking 小节会在编译期检查正则字面量的常见错误——包括无效语法、错误的向后引用、以及目标 JS 版本不支持的语法特性从而把这类 bug 提前到构建阶段暴露let r /(a)\2/; // Error: This backreference refers to a group that does not exist.该检查作用于正则字面量并不检查new RegExp(...)字符串构造的形式。使用RegExp对象的典型类型化写法如下const pattern: RegExp /^user-\d$/; const match: RegExpMatchArray | null user-42.match(pattern);String.prototype.match的返回值类型被 TypeScript 标注为RegExpMatchArray | null配合可选链或if判断即可安全地读取捕获组。集合类对象Array、Map、SetArray是使用频率最高的集合对象本书 原语类型章节 的 Array 小节给出了完整的类型化声明方式元素类型后置[]、泛型形式ArrayT、联合类型数组、以及只读数组与元组const x: string[] [a, b]; const y: Arraystring [a, b]; const j: Arraystring | number [a, 1, b, 2]; // Union const r: readonly string[] [a, b]; // Readonly modifier const k: ReadonlyArraystring | number [a, 1, b, 2]; k.push(x); // Invalid const t: [string, number] [a, 1]; // Tuple const rt: readonly [string, number] [a, 1]; // Readonly tupleArray上诸如map、filter、reduce的方法签名也都是泛型化的TypeScript 会自动推断回调参数与返回值类型。例如在 TypeScript 介绍章节 中即便没有写任何类型标注编译器也能通过推断报出items.filter(item item.y)中Property y does not exist的错误这正是内建对象方法签名参与类型推断的体现。Map与Set是 ES2015 引入的键值集合与唯一值集合。它们在 TypeScript 中同样是泛型对象MapK, V在读写get/set时按键值类型做严格校验SetT则保证元素类型一致。典型用法const scores new Mapstring, number(); scores.set(alice, 90); // OK scores.get(bob); // number | undefined可配合 ?? 提供默认值 const visited new Setstring(); visited.add(/docs); // OK visited.has(/docs); // boolean注意Map.prototype.get的返回类型是V | undefined这正是为配合strictNullChecks与??空值合并运算设计的。Promise异步编程的类型化基石Promise是 JavaScript 异步编程的核心对象TypeScript 为它提供了完整的泛型签名PromiseT表示未来会成功产出T类型值的异步操作。本书 Others 章节 的 Asynchronous Language Features 小节指出由于 TypeScript 是 JavaScript 的超集Promise、async/await以及 Fetch API、WebSocket、Web Workers 等异步 API 均被良好支持。async函数的返回值永远会被类型推断为PromiseTawait表达式则会解包出内部类型async function fetchData(): Promisestring { // 返回 string但函数签名是 Promisestring return data; } const result await fetchData(); // result: stringTypeScript 内建的AwaitedT工具类型正是为处理Promise嵌套解包设计的见 类型操纵章节 的 Utility Types 清单。配合try/catch与自定义错误类型就可以写出完全类型安全的异步错误处理链路。Intl国际化与本地化Intl是 ECMAScript 国际化 API 的命名空间对象用于日期、数字、排序规则的本地化格式。它在 TypeScript 中同样具备完整声明典型用法包括const formatter new Intl.NumberFormat(ko-KR, { style: currency, currency: KRW, }); formatter.format(123456.78); // 韩元格式的字符串 const dateFmt new Intl.DateTimeFormat(ko-KR, { year: numeric, month: long, day: numeric, }); dateFmt.format(new Date()); // 韩文日期格式字符串Intl.NumberFormat、Intl.DateTimeFormat的构造参数locale与options在 TypeScript 中都有详细的类型定义错误选项会在编译期被拦截这是纯 JavaScript 无法获得的保障。类型系统视角内建对象如何与类型推断协同理解内建对象与 TypeScript 类型系统协同的方式能让你的代码更优雅。本书 Type from Value 章节 展示了值到类型的自动推断规则const x x; // 用 const 声明时推断为字符串字面量类型 x不可变 // 用 let 声明时拓宽widen为 string可重新赋值同样的推断规则适用于内建对象的返回值。例如String.prototype.toUpperCase()返回string、Number.prototype.toFixed()返回string、Array.prototype.length返回number——这些返回类型会被自动代入到后续的类型流中无需手动标注。此外Symbol这一内建对象在类型层面扮演特殊角色每个Symbol()调用产生唯一标识可作为对象属性键避免命名冲突。原语类型章节 展示了以symbol为索引签名的写法type Obj { [sym: symbol]: number; }; const a Symbol(a); const b Symbol(b); let obj: Obj {}; obj[a] 123; obj[b] 456; console.log(obj[a]); // 123 console.log(obj[b]); // 456而 Others 章节 进一步展示了 TypeScript 4.4 起支持的符号键 模板字符串模式索引签名将Symbol与RegExp风格的模式组合出更精确的对象形状。相关阅读内建对象的完整目录定位website/src/content/docs/book/common-built-in-js-objects.md7 种原语类型与 Array/Symbol/any 的详解website/src/content/docs/book/primitive-types.md内建类型原语清单number/string/void/never等website/src/content/docs/book/built-in-type-primitives.mdError 处理、异步特性、包装类型、正则检查等内建对象细节website/src/content/docs/book/others.md类型推断与超集定位website/src/content/docs/book/typescript-introduction.md、website/src/content/docs/book/type-from-value.md赞分享文档教程【免费下载链接】typescript-bookThe Concise TypeScript Book: A Concise Guide to Effective Development in TypeScript. Free and Open Source.项目地址https://gitcode.com/gh_mirrors/typ/typescript-book点击查看免费下载相关推荐TypeScript 内建 JavaScript 对象详解从 Function 到 Intl 的全局对象类型化实战指南TypeScript 内建 JavaScript 对象详解从 Function 到 Intl 的全局对象类型化实战指南 导读 TypeScript 是 Ja文档教程The Concise TypeScript Book 精读TypeScript 内置 JavaScript 对象实战指南15 个常用全局对象的类型化使用The Concise TypeScript Book 精读TypeScript 内置 JavaScript 对象实战指南15 个常用全局对象的类型化使用文档教程TypeScript 中的常见内置 JavaScript 对象15 个全局对象与类型系统的协同使用指南TypeScript 中的常见内置 JavaScript 对象15 个全局对象与类型系统的协同使用指南 本文基于《The Concise TypeScript文档教程上一篇Fiddler Web Debugger中文版5步快速上手网络调试的终极指南下一篇Cherry Studio v2 变更解读URL 上下文能力合并进 Web Search 开关创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考