小程序中不同变量的关系与使用方法

一、全局变量

1. 定义位置

app.js 中的 globalData 属性，一般定义整个小程序的共享变量，也就是说如果一个变量在小程序的很多页面都要使用到，而且每个页面对此变量的修改得是同步的 ( 比如定义了一个 count，count 一开始等于 10，如果一个页面让 count - 1 = 9，所有页面获取的 count 都会变为 9 )，这个时候就可以把这个变量定义在 globalData 里

2. 权限

整个小程序的任何页面都可以进行调用

3. 获取方法

3.1 在 app.js 中

// 和在页面中调用页面中的 data 一样
console.log(this.globalData.age = 10)

3.2 在页面中

// 一定先获取 app 实例
let app = getApp();
// 获取 age
console.log(app.globalData.age);
// 修改，直接赋值即可
app.globalData.age = 21

二、页面变量

1. 定义位置

每个 page 对应的 js 文件中的 data 属性

2. 权限

本页面中处处可访问

3. 获取方法

3.1 在页面 js 中

// 获取
console.log(this.data.step) // 注意 this 的指向
// 修改
this.setData({
  step: 10
})

3.2 在 wxml 中

// 使用插值表达式
<view>{{step}}</view>

三、局部变量(定义在函数内部的临时变量)

1. 定义位置

在方法中定义

2. 权限

定义之后的部分皆可访问

3. 获取方法

// 直接使用变量名即可

四、总结

1. 注意调用方法，特别是页面变量，一定是 this.data.变量名，注意 this 指向，如果报错 变量名 is not defined，很可能是 this 指向出问题
2. wxml 中只能直接使用页面变量
3. 如果要在 wxml 中使用全局变量\局部变量，请转换成页面变量，即在 page 的 data 属性中进行定义

// 一部分类型变量定义方法
// 字符串
str: ''
// 数组
arr: []
// 对象
obj: {}
// 数字
num: 0
// js 不那么在乎类型，如果真的有类型问题可查找转换方法，例如：数组转字符串的方法