尋找模塊之間導出和導入變量的最佳方式

Question

因此，我正在使用Appcelerator學習CommmonJS，並試圖從我的一個模塊（這是一個數組）使用變量的最佳方式用戶界面模塊。我的問題是，在我的UI模塊中，我有用於UI的主窗口（全局），並且在調用打開地圖的函數（在同一模塊中）的按鈕上有一個eventlistener。這張地圖需要我從前一個模塊獲得的變量。只是不確定什麼是最好的方式來做到這一點。任何建議都會很棒。

Data.js

var read = function(){ 
console.log("---read is activated---"); 
var db = Ti.Database.open('fourSqDB'); 
var rows = db.execute('SELECT fourSqID, name, lat, lng, distance, type FROM fourSqTBL'); 
var dbArray = []; 
while (rows.isValidRow()){ 
    var record = { 
     fourSqID: rows.fieldByName('fourSqID'), 
     name: rows.fieldByName('name'), 
     lat: rows.fieldByName('lat'), 
     lng: rows.fieldByName('lng'), 
     distance: rows.fieldByName('distance'), 
     type: rows.fieldByName('type'), 
    }; 
    dbArray.push(record); 
    rows.next(); 
} 
rows.close(); 
db.close(); 

var getUI = require('ui'); //go into ui.js 
//getUI.buildUI(dbArray); //fire buildMainUI function 
getUI.buildSecUI(dbArray); //fire buildSecUI function 

return dbArray; }; //close read function 

ui.js

var win = Ti.UI.createWindow({ 
    layout: "vertical", 
    backgroundColor: "#ccc" 
    //background: "images/bg.png" 
}); 

//Navigation Window 
var navWin = Ti.UI.iOS.createNavigationWindow({ 
    window: win, 
}); 

var label1 = Ti.UI.createLabel({ 
    //top: 250, 
    textAlign: "center", 
    text: "This is the shisha app created by Emmanuel Farrar for AVF1512 Week 3 assignment " 
}); 

var labelButton = Ti.UI.createLabel({ 
    text: "Go To Data", 
    color: "white" 
}); 

var statementView = Ti.UI.createView({ 
    borderColor: "black", borderRadius: 10, 
    top: 10, bottom: 0, 
    height: 300, width: 350 
}); 

var buttonView = Ti.UI.createView({ 
    backgroundColor: "#1f2f34", 
    top: statementView.bottom + 200, 
    borderRadius: 10, 
    height: 75, 
    width: 350 

}); 

/////////////////////////////////////////// 
// buildSecUI function (map and listing) 
/////////////////////////////////////////// 

var buildSecUI = function(dbArray){ //dbArray from data.js read function 
    console.log("---buildSecUI is activated---"); 
    console.log(dbArray); 

    var secWin = Ti.UI.createWindow({ 
    layout: "vertical", 
    backgroundColor: "#ffffff" 
    }); 

    //building the map 
    var Map = require('ti.map'); 

    var mapView = Map.createView({ 
    mapType: Map.NORMAL_TYPE, 
    region: {latitude:25.2867, longitude:51.5333, 
      latitudeDelta:0.05, longitudeDelta:0.05}, 
    animate:true, 
    regionFit:true, 
    userLocation:true 
    }); 

    //array for annotations (pins for maps) 
    var annotations = []; 

    for (var i = 0 ; i < dbArray.length; i++) { 
    // this section will create annotations and add them on the mapView 
     var pin = Map.createAnnotation({ 
      latitude: dbArray[i].lat, 
      longitude: dbArray[i].lng, 
      title: dbArray[i].name, 
      type: dbArray[i].type, 
      animate:true, 
      pincolor:Map.ANNOTATION_PURPLE 
     }); 

     annotations[i] = pin; 
     //annotations.push(pin); 

    // console.log(annotations[i]); 
    console.log("Pin Info: " + + "Lat" + pin.latitude + "/" + "Lng "+ pin.longtitude); 

    mapView.addAnnotation(annotations[i]); // adds annotations 
    } //for loop closure 

    secWin.add(mapView); 
    navWin.openWindow(secWin); 

}; //closure for buildSecUI 

exports.buildSecUI = buildSecUI; 

//event listner 
buttonView.addEventListener("click", buildSecUI); //closure for buildSecUI 

// adding stuff here 
statementView.add(label1); 
buttonView.add(labelButton); 
win.add(statementView, buttonView); 
navWin.open(); 

Answer 1

我想你應該走另一條路。

在​​導出read功能，但省略了兩個getUI行。

exports.read = function() { 
    // your code except the two getUI lines 
    return dbArray; 
}; 

然後在ui.js要求data模塊，調用導出read()和與之建立UI。

var data = require('data'); 
var dbArray = data.read(); 
buildSecUI(dbArray); 

這樣你的data模塊是不知道在何處以及如何使用它（因爲它應該是）。

Answer 2

嗯，我想通了什麼問題，但最喜歡的事情，它只是確定了另一個問題，哈哈。在這種情況下，它將整個事件轉化爲一個函數，並將.openWindow方法作爲自己的函數移動到事件偵聽器。

buttonView.addEventListener("click", function(){navWin.openWindow(secWin);});