微信小程序 模块化
作者: --时间: 2025-05-19 14:53:56
阅读量:
微信小程序模块化开发
在微信小程序开发中,文件作用域是十分重要的概念。JavaScript文件中声明的变量和函数只在该文件中有效;不同的文件中可以声明相同名字的变量和函数,不会互相影响。如果需要在多个文件中共享数据,可以通过全局函数`getApp()`获取全局的应用实例,并在该实例的`globalData`属性中设置。同时,在模块化开发中,我们可以将一些公共的代码抽离成为一个单独的js文件,作为一个模块。需要使用`module.exports`或者`exports`来对外暴露接口。
1. 文件作用域
在小程序中,每个JS文件都有自己的作用域。不同JS文件中定义的变量和函数不会互相干扰。可以通过全局函数`getApp()`获取小程序的应用实例,从而获取全局数据。
例如:
```
// app.js
App({
globalData: 1 // 全局数据
})
// a.js
// 仅在a.js中可用的局部变量
var localValue = 'a'
// 获取应用实例
var app = getApp()
// 修改全局数据
app.globalData++
// b.js
// 可以在b.js中重新定义局部变量localValue,不会影响到a.js中的localValue
var localValue = 'b'
// 如果a.js先被执行了,则此时globalData应该为2
console.log(getApp().globalData)
```
2. 模块化
在模块化开发中,我们可以将一些公共的代码抽离成为一个单独的JS文件作为一个模块。需要使用`module.exports`或者`exports`来对外暴露接口。
例如:
```
// common.js
function sayHello(name) {
console.log(`Hello ${name}!`)
}
function sayGoodbye(name) {
console.log(`Goodbye ${name}!`)
}
module.exports.sayHello = sayHello
exports.sayGoodbye = sayGoodbye
// page.js
var common = require('common.js')
Page({
helloMINA: function() {
common.sayHello('MINA')
},
goodbyeMINA: function() {
common.sayGoodbye('MINA')
}
})
```
需要注意的是,在小程序中,`require`暂时不支持绝对路径。此外,小程序目前不支持直接引入`node_modules`,如果需要使用相关的代码,则需要拷贝到小程序的目录中。
以上是关于微信小程序模块化开发的简要介绍。通过文件作用域和模块化的使用,可以提高小程序开发的效率和可维护性,也方便不同团队的协作开发。
-
B2B2C多用户商城系统支持企业自营与商户入驻模式共存 会员一站式精细化营销工具 多用户分销,带来爆发式增长
系统支持平台自营+供应商店铺共存的经营模式(类天猫&京东模式),帮助企业打造生态级商业平台为目的的电子商务系统。
免费试用系统 -
B2B2B电商交易系统优化供应链协作 授信及账期支付 商品按照数量阶梯设价
全渠道订货/采购及经销商管理数字化系统,实现供应链整合和交易便捷化。
免费试用系统 -
S2B2B电商交易系统供销一体化,提高市场集中度 集团管控一体化,有效实现供需匹配 移动应用一体化,提高运营综合效率
上下游资源整合数字化解决方案,赋能产业供应链,构建产业互联网生态体系。
免费试用系统

更多产品任你选