微信小程序自學第三課:文件作用域,模塊化
阿新 • • 發佈:2017-08-11
數據 變量 span data ava 有效 函數 方法 oba
2.在需要使用這些模塊的文件中,使用
一、文件作用域
在 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‘)
}
})
微信小程序自學第三課:文件作用域,模塊化