微信小程序自学第三课：文件作用域，模块化

时间：2023-03-09 22:44:45
微信小程序自学第三课：文件作用域，模块化

一、文件作用域

　　在 JavaScript 文件中声明的变量和函数只在该文件中有效；不同的文件中可以声明相同名字的变量和函数，不会互相影响。

通过全局函数 getApp() 可以获取全局的应用实例，如果需要全局的数据可以在 App() 中设置，如：

// app.js
App({
  globalData:{
    appName : "hcoder",
    appVersion : "1.1"
  }
})

// index.js
var app;
Page({
  data:{

  },
  onLoad:function(){
    app = getApp();
    this.setData({"appName":app.globalData.appName});
    this.setData({"appVersion":app.globalData.appVersion});
  }
})

//index.wxml
<text>
{{appName}}
{{appVersion}}
</text>

也可以在App()中创建自定义全局函数，在 App全局中使用getApp()获取到的全局应用实例来调用此方法。

二、模块化

　　在我们开发过程中，可能会有很多公共的方法，我们可以将一些公共的代码抽离成为一个单独的 js 文件，作为一个模块。

模块只有通过 module.exports 或者 exports 才能对外暴露接口。

　　需要注意的是：

　　exports 是 module.exports 的一个引用，因此在模块里边随意更改 exports 的指向会造成未知的错误。所以我们更推荐开发者采用 module.exports 来暴露模块接口，除非你已经清晰知道这两者的关系。

　　小程序目前不支持直接引入 node_modules , 开发者需要使用到 node_modules 时候建议拷贝出相关的代码到小程序的目录中。

1.在公共.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

2.在需要使用这些模块的文件中，使用 require(path) 将公共代码引入，使用引用实例进行公共方法的调用

tip：require为common.js相对当前文件的相对路径，目前不支持绝对路径

var common = require('../../common.js') Page({ 　　helloMINA: function() {　　 　　common.sayHello('MINA') 　　}, 　　goodbyeMINA: function() { 　　　　common.sayGoodbye('MINA') 　　} })

相关文章