那个文件是小程序的配置文件appjs
那个文件是小程序的配置文件appjs
小程序的核心配置文件是 `app.js` 文件。
在微信小程序开发中，`app.js` 文件扮演着至关重要的角色。它不仅是小程序的入口文件，还负责初始化小程序的全局数据、监听小程序的生命周期函数以及注册小程序全局的事件监听器。
app.js 的作用与功能
app.js 文件是每个微信小程序都必须拥有的一个核心文件。它的主要作用可以概括为以下几点：
- 小程序入口： 当用户打开小程序时，首先运行的就是 `app.js` 文件。
- 全局数据管理： 可以在 `app.js` 中定义小程序的全局数据，这些数据可以在小程序的任何页面中共享和访问。
- 生命周期管理： `app.js` 包含了小程序级别的生命周期函数，例如 `onLaunch`（小程序初始化完成时触发）、`onShow`（小程序显示出来时触发）和 `onHide`（小程序隐藏时触发）等。通过监听这些生命周期函数，开发者可以实现一些全局的初始化逻辑或在特定时机执行一些操作。
- 全局事件监听： 可以注册全局的错误监听函数 `onError` 和未处理的 Promise 错误监听函数 `onPageNotFound`。
app.js 的基本结构
一个典型的小程序 `app.js` 文件通常包含以下基本结构：
// app.js
App({
onLaunch: function () {
// 小程序初始化完成时，会触发 onLaunch 这个函数
// 可以在这里进行一些全局的初始化设置，例如：
console.log(小程序启动了！)
// 可以在这里获取用户登录状态，或者请求一些公共数据
},
onShow: function (options) {
// 小程序显示出来的时候触发
// options 参数包含了小程序启动的场景值（scene）以及启动参数（query）等信息
console.log(小程序显示了！, options.scene, options.query)
},
onHide: function () {
// 小程序隐藏起来的时候触发
console.log(小程序隐藏了！)
},
onError: function (msg) {
// 小程序发生脚本错误，或者 API 调用失败时触发
console.error(小程序发生错误：, msg)
},
// 全局共享的数据
globalData: {
userInfo: null, // 例如：存储用户登录信息
appName: 我的小程序
}
})
理解 App() 构造器
`App()` 是微信小程序提供的一个全局函数，用于注册小程序。它接收一个 Object 参数，该 Object 中的属性和方法将成为小程序的全局属性和方法。其中，`onLaunch`、`onShow`、`onHide`、`onError` 是小程序生命周期函数，`globalData` 是用于存放全局共享数据的对象。
生命周期函数详解
- `onLaunch(options)`:
- 触发时机：当小程序完成加载并初始化完成后，会触发此生命周期函数。这是小程序启动时最先执行的函数。
- 应用场景：可以在此函数中进行一些全局的初始化工作，例如：
- 检查用户登录状态，如果未登录则引导用户登录。
- 从服务器获取一些全局配置信息。
- 初始化一些公共的 util 函数或组件。
- `options` 参数：包含了小程序启动的场景值（`scene`）和启动参数（`query`）。例如，当用户从一个二维码扫码进入小程序时，`scene` 会指示二维码的类型，`query` 会包含二维码携带的参数。
- `onShow(options)`:
- 触发时机：当小程序启动，或从后台进入前台显示时，会触发此生命周期函数。
- 应用场景：
- 当用户从其他页面返回小程序时，可能需要刷新一些页面数据。
- 根据用户进入小程序的场景（例如从某个分享卡片进入），执行不同的逻辑。
- `onHide()`:
- 触发时机：当小程序从前台进入后台时，会触发此生命周期函数。
- 应用场景：
- 当小程序被用户切换到后台时，可以停止一些不必要的网络请求，释放资源。
- 记录用户的使用时长等统计信息。
- `onError(msg)`:
- 触发时机：当小程序发生脚本错误，或者 API 调用失败时，会触发此生命周期函数。
- 应用场景：
- 用于捕获和上报小程序运行时出现的错误，方便开发者进行调试和问题排查。
- 可以将错误信息发送到服务器进行记录。
- `onPageNotFound(options)`:
- 触发时机：当小程序出现页面不存在的情况时，会触发此生命周期函数。
- 应用场景：
- 当用户访问一个不存在的页面时，可以将用户重定向到首页或其他指定的页面。
全局数据 `globalData`
`globalData` 是一个 JavaScript 对象，用于存储小程序全局共享的数据。这些数据可以在小程序的任何页面中通过 `getApp().globalData` 来访问和修改。
示例：
// 在 app.js 中定义 globalData
globalData: {
userInfo: null,
token:
}
// 在某个 page.js 中访问 globalData
const app = getApp()
console.log(app.globalData.userInfo)
app.globalData.token = some_token_value
注意： `globalData` 的数据是存储在内存中的，当小程序被销毁（例如用户长时间未操作，小程序被系统回收）时，`globalData` 中的数据也会丢失。因此，对于重要的数据（如用户登录状态、配置信息等），建议同时存储在本地缓存（`wx.setStorageSync`）中，并在 `onShow` 时进行加载和校验。
app.js 与其他配置文件的关系
在小程序开发中，`app.js` 只是众多配置文件中的一个，与其他文件协同工作，共同构建小程序：
- `app.json`: 这是小程序的全局配置文件，用于配置小程序的窗口表现、配置页面的路径、设置底部 tab 栏等。它定义了小程序整体的视觉风格和页面结构。
- `app.wxss`: 这是小程序的全局样式文件，用于定义小程序所有页面的公共样式。
- 页面文件（`*.js`、`*.wxml`、`*.wxss`、`*.json`）: 每个小程序页面都有自己的 `.js` (逻辑文件)、`.wxml` (结构文件)、`.wxss` (样式文件) 和 `.json` (页面配置) 文件。`app.js` 负责小程序的整体启动和全局逻辑，而页面文件则负责单个页面的交互和渲染。
`app.js` 的优先级
当小程序启动时，`app.js` 中的 `onLaunch` 会最先被执行，用于初始化全局配置和数据。然后，小程序的第一个页面会根据 `app.json` 中的配置被加载和渲染。
实际开发中的应用场景
在实际的小程序开发过程中，`app.js` 的作用远不止于基础的生命周期监听和全局数据管理。以下是一些常见的应用场景：
- 用户登录与鉴权： 在 `onLaunch` 中检查用户是否已登录，如果未登录，则触发登录流程，获取 `code` 并与后端进行交互，获取用户的 `session_key` 和 `token`，并存储在 `globalData` 中，方便后续的 API 请求。
- 数据预加载： 在小程序启动时，如果有一些公共的、不经常变动的数据（例如商品分类列表、地区信息等），可以在 `onLaunch` 或 `onShow` 中一次性从服务器加载，并存储到 `globalData` 中，避免每次进入页面都重复请求。
- 全局事件订阅与发布： 尽管小程序不像某些前端框架那样内置事件总线，但可以通过 `globalData` 对象配合自定义的方法，实现简单的全局事件订阅和发布机制，用于页面之间的通信。
- 主题切换： 如果小程序支持多主题切换，可以在 `globalData` 中存储当前的主题配置，并在 `app.js` 中监听主题变化，通知所有页面进行样式更新。
- 状态管理： 对于一些复杂的小程序，可以将 `globalData` 作为简单的全局状态管理容器，存储用户偏好设置、应用状态等。
总而言之，`app.js` 文件是小程序的核心，理解其作用和结构对于开发高效、稳定的微信小程序至关重要。它承载着小程序的“生命线”，决定了小程序启动时的行为，并为整个小程序提供了全局的数据和逻辑支持。
