破冰 React Native:Android 工程师的 TypeScript 与环境配置指南

34 阅读2分钟

作为一名 Android 工程师,转向 React Native (RN) 开发时,最大的心态转变来自于语言和运行时的差异。我们习惯了静态强类型的 Kotlin 和 JVM/ART 运行时,而在 RN 的世界里,我们将拥抱 JavaScript (JS) 引擎以及带有静态类型检查的 TypeScript (TS)。

1. 环境配置:从 Gradle 到 npm/Yarn

在 Android 开发中,我们使用 Gradle 来管理依赖和构建流程。在 RN 和整个前端生态中,包管理器通常是 npm (Node Package Manager) 或 Yarn

AndroidReact Native说明
build.gradlepackage.json声明项目依赖、脚本和元数据
gradlew buildnpm run build / yarn build执行构建脚本
mavenCentral()registry.npmjs.org依赖下载源
implementation 'com.xxx:library:1.0'npm install library / yarn add library安装依赖库

对于 RN 而言,底层的 Android 平台仍然使用 Gradle 构建,但你日常引入的很多跨平台 JS 库,都需要通过 npm 或 Yarn 安装。

2. TypeScript vs Kotlin:静态类型的异同

React Native 官方强烈推荐使用 TypeScript。对于 Kotlin 开发者来说,TypeScript 非常亲切,因为两者都具备现代语言的特性(如类型推断、非空检查、高阶函数等),但 TS 本质上是 JS 的超集,在编译后会被擦除,运行时依旧是动态的 JS。

变量声明

// Kotlin
val name: String = "Android" // 不可变
var version: Int = 14 // 可变
// TypeScript
const name: string = "React Native"; // 不可变 (类似 val)
let version: number = 73; // 可变 (类似 var)

注意 TS 中所有的数值类型(整型、浮点型)都是 number

接口与类型别名 (Interfaces & Types)

在 Kotlin 中我们经常使用 data classinterface。在 TS 中,interfacetype 别名被广泛使用。

// TypeScript
interface User {
  id: string; // 相当于 Kotlin 的 val id: String
  name: string;
  age?: number; // `?` 表示可选属性,相当于 Kotlin 的 Int? = null
}
​
const user: User = {
  id: "1001",
  name: "Edison"
  // age 可以省略
};

联合类型 (Union Types) vs 密封类 (Sealed Classes)

TS 的联合类型非常强大,可以用来替代 Kotlin 中的 Enum 或 Sealed Class。

// TypeScript
type NetworkState = "LOADING" | "SUCCESS" | "ERROR";
​
function handleState(state: NetworkState) {
  if (state === "SUCCESS") {
    // 处理成功
  }
}

异步编程:Coroutines vs Async/Await

Kotlin 有强大的协程 (Coroutines),而 TS 使用 Promise 以及 async/await,概念上非常相似。

// TypeScript
async function fetchData(): Promise<string> {
  try {
    const response = await fetch("https://api.example.com/data");
    const data = await response.text();
    return data;
  } catch (error) {
    console.error(error);
    throw error;
  }
}

这与 Kotlin 的 suspend function 在使用直觉上如出一辙。

3. 核心总结

作为 Android 工程师,你可以把 TypeScript 看作是一种“编译期带类型的弱语言”。它的类型系统非常灵活,但也比 Kotlin 更容易出现运行时类型与编译期类型不一致的情况(因为缺乏运行时的类型约束)。拥抱 const,多用 interface,你会发现 TS 写起来非常顺手!