首页 > 代码库 > 微信小程序自学第三课：文件作用域，模块化

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

2024-11-24 21:55:02   203人阅读

一、文件作用域

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

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

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

// index.js
var app;
Page({
  data:{
    
  },
  onl oad: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‘) 
　　} 
})

 

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


联系
我们