应用程序的 TypeScript：类型化开发指南

[TypeScript0 向 JavaScript 添加类型。对于应用程序来说，这意味着更少的错误、更好的 DX 和更易于维护的代码。本指南介绍如何在移动开发中使用 TypeScript。

什么是 TypeScript

定义

具有静态类型的 JavaScript 超集。

与 JS 的关系

所有有效的 JS 都是有效的 TS。

编译

编译为 JavaScript。

收养

大规模增长。严肃项目的标准。

为什么选择 TypeScript

及早发现错误

编译时错误，而不是运行时错误。

自动补全

IDE 知道什么是可能的。

重构

大规模的安全变更。

文档

类型是活的文档。

团队规模

多个开发人员协调一致。

基本类型

基元

字符串、数字、布尔值、null、未定义。

数组

数字[]，数组<字符串>。

对象

{ 名称：字符串；年龄：数字}。

###任意

选择退出类型。避免。

未知

当你不知道的时候就像安全一样。

接口和类型

接口

定义对象的形状。

输入别名

任何类型的名称。

###差异

接口扩展，联合类型。

何时使用

对象的接口，组合的类型。

高级类型

###联盟

字符串|数字。

交叉口

A 型和 B 型。

泛型

Array，适用于任何类型的函数。

文字类型

“成功” | “错误”。

实用程序类型

部分、必需、选择、省略。

React Native 中的 TypeScript

###设置

模板 [TypeScript1 可用。

###组件

输入的 props 和状态。

状态

Redux/Zustand 与类型。

###API

键入回复。

键入组件

道具界面

接口 Props { 标题：字符串； onPress: () => void; }

可选道具

标题？：字符串。

默认道具

具有解构的默认值。

###儿童

React.ReactNode。

输入 API

响应类型

接口用户 { id: 字符串;名称：字符串； }

泛型

异步函数 fetch(url: string): Promise

佐德/是的

运行时验证+类型。

状态管理

终极版

使用类型创建切片。

祖斯坦

商店界面。

上下文

上下文值的类型。

导航类型

反应导航

用于类型化路由的 StackParamList。

路由参数

在屏幕之间输入的参数。

使用导航

类型钩子。

配置

tsconfig.json

构建选项。

严格模式

最大程度的安全性。总是使用。

路径别名

@/用于干净导入的组件。

从 JS 迁移到 TS

循序渐进

逐步将 .js 重命名为 .ts。

允许Js

迁移时允许 JS。

任何临时的

用于快速迁移，稍后删除。

稍后严格

迁移后启用严格。

模式

受歧视的工会

类型 State = { status: '正在加载' } | { 状态：'成功'；日期：日期}。

详尽的检查

保证所有情况的开关。

常量断言

作为文字的常量。

常见错误

任何地方

失去类型优势。

忽略错误

// 不必要地忽略@ts。

过度打字

类型太复杂。

不使用严格

错过重要的验证。

工具

VS 代码

出色的本机支持。

ESLint

@typescript-eslint 用于 linting。

更漂亮

格式一致。

##性能

编译时间

大型项目可能会很慢。

运行时

零开销。类型被删除。

捆绑尺寸

与 JavaScript 相同。

结论

[TypeScript2 是一项能够在质量和生产力方面带来回报的投资。对于应用程序来说，这意味着生产中的错误更少，重构安全，并且新开发人员更容易上手。

##常见问题解答

1) [TypeScript3 速度慢吗？ 编译是的。运行时没有区别。

2) 我需要输入所有内容吗？ [TypeScript4 推断了很多。根据需要键入。

3) 它对小型项目有效吗？ 是的。从一开始就受益匪浅。

4) 如何从现有项目开始？ 渐渐地。逐个文件。

5) [TypeScript5 可以与 React Native 一起使用吗？ 完美。官方模板可用。

另请阅读

[React Native vs Flutter：完整比较6
[应用架构：基本原理和模式7
【Deno简介：现代开发实用指南8
【应用安全：移动防护指南9
[应用程序值得：决定您的企业是否需要应用程序的完整指南10
[应用程序身份验证：完整的安全性和用户体验指南11