解析:JavaScript承诺问题

时间:2014-08-19 22:09:58

标签: javascript node.js express parse-platform

我试图围绕Promises,thenwhen及其他所有相关内容。我没有太大的成功。这是我用英语想要完成的事情,也许有人可以破解代码,因为到目前为止我没有写过任何作品。

我正在为移动设备编写SPA(单页应用)。基本上所有内容都是一个带有一堆DIV的巨型HTML页面。但是,一次只显示一个DIV。用户将有一个标签栏,可以单击每个图标来显示/隐藏DIV。想想Apple App Store界面,底部有“精选”,“热门排行榜”,“探索”,“搜索”和“更新”。

  1. 使用Businesses
  2. 解析1个商家的表AppUrl=example.com的数据库查询
  3. 生成的商家objectId用于查询表Navigation以查找所有导航内容。 “家”,“关于我们”,“菜单”,“活动”,“联系方式”等内容。
  4. 循环生成的导航项目以呈现其中包含内容的DIV。内容来自下表,具体取决于Module列:
    • “Home”= Photos table
    • “关于我们”= Pages
    • “菜单”= Lists
    • “Event”= Lists table
  5. 基本上就是这样。很简单,但很明显#4中有嵌套查询。我不知道我是否应该在查询中创建一个巨大的对象然后输出它?或者用它们内部的数组创建一堆不同的对象?真的有点丢失,因为这种语法风格与PHP不同。建议?

    这是我的非数据库连接版本:

    app.get('/', function(req, res){
    
    var frontpageImages = [
            { caption:"Eggplant, Prosciutto, and Pesto Pressed Sandwiches.", file:"image01.jpg", position:"15%" },
            { caption:"Pico de Gallo", file:"image02.jpg", position:"75%" },
            { caption:"B.L.A.T Croque Madame", file:"image03.jpg", position:"20%" },
            { caption:"Double Oreo Brownie Cupcake", file:"image04.jpg", position:"80%" },
            { caption:"Baked Chicken Chimichangas with Monterey Jack Cheese Sauce", file:"image05.jpg", position:"20%" }
            ]
    
    var menu = [
            { divider:"Appetizers" },
            { name:"French Fries", picture:"menu-french-fries", subname:"$4.95" },
            { name:"Loaded Cheese Fries", picture:"menu-cheese-fries", subname:"$7.95" },
            { name:"Gaelic Chips", picture:"menu-gaelic-chips", subname:"$2.95" },
            { name:"Jalapeno Mac n' Cheese", picture:"menu-jalapeno-mac-n-cheese", subname:"$4.95" },
            { name:"Chicken Wings", picture:"menu-chicken-wings", subname:"$8.50" },
            { name:"Irish Nachos", picture:"menu-irish-nachos", subname:"$8.50" },
            { name:"Black & Tan Onion Rings", picture:"menu-onion-rings", subname:"$6.95" },
            { name:"Mac's Quesadillas", picture:"menu-quesadillas", subname:"$8.50" },
            { name:"Banger Bites", picture:"menu-banger-bites", subname:"$7.95" },
            { divider:"Salads" },
            { name:"Caesar Salad", picture:"menu-caesar-salad", subname:"$6.50" },
            { name:"House Salad", picture:"menu-house-salad", subname:"$6.50" },
            { name:"Buffalo Chicken Salad (Grilled or Battered)", picture:"menu-buffalo-chicken-salad", subname:"$8.95" },
            { divider:"Sandwiches & Burgers" },
            { name:"Rueben", picture:"menu-reuben", subname:"$8.50" },
            { name:"Dublin Corned Beef", picture:"menu-corned-beef-sandwich", subname:"$8.50" },
            { name:"Philly Cheese Steak", picture:"menu-philly-cheese-steak", subname:"$8.50" },
            { name:"Grilled Chicken", picture:"menu-grilled-chicken-sandwich", subname:"$8.50" },
            { name:"Club Sandwich", picture:"menu-club-sandwich", subname:"$8.50" },
            { name:"Not-So-Irish Burger", picture:"menu-irish-burger", subname:"$9.95" },
            { name:"Dirty Burger", picture:"menu-dirty-burger", subname:"$7.95" },
            { name:"Aurora Burger", picture:"menu-aurora-burger", subname:"$10.95" },
            { name:"Bleu Cheese Burger", picture:"menu-bleu-cheese-burger", subname:"$11.95" },
            { name:"Additional Burger Toppings", picture:"menu-burger-toppings", subname:"$0.50" },
            { divider:"Irish Favorites & Entrees" },
            { name:"Beer Battered Fish N' Chips", picture:"menu-fish-and-chips", subname:"$11.50" },
            { name:"Bangers And Mash", picture:"menu-bangers-and-mash", subname:"$10.95" },
            { name:"Shepherd's Pie", picture:"menu-shepherds-pie", subname:"$10.95" },
            { divider:"Brunch" },
            { name:"Irish Breakfast", picture:"menu-irish-breakfast", subname:"$11.50" },
            { name:"American Breakfast", picture:"menu-american-breakfast", subname:"$11.50" },
            { name:"Irish Breakfast Roll", picture:"menu-irish-breakfast-roll", subname:"$8.95" },
            { name:"English Muffin, Scrambled Eggs, Cheddar and Irish Rasher", picture:"menu-irish-rasher", subname:"$7.50" },
            { name:"3 Egg Omelette", picture:"menu-omelette", subname:"$6.50" },
            { name:"Eggs Benedict", picture:"menu-eggs-benedict", subname:"$8.50" },
            { name:"3 Pancakes with Maple Syrup", picture:"menu-pancakes", subname:"$6.00" },
            { name:"Grilled Turkey and Swiss", picture:"menu-grilled-turkey-and-swiss", subname:"$7.00" }
            ];
    
    var drinks = [
            { name: "Bahama Bomb", desc: "Bacardi 151 Rum, Cruzan Coconut Rum, Creme de Banana, Pineapple juice, and Sprite.", subname: "$9.95" },
            { name: "Tropical Margarita", desc: "Grand Marnier, Cruzan Coconut Rum, Blue Curacao, sour mix, and orange juice. Garnished with lemon, lime, and cherry.", subname: "$10.95" },
            { name: "LOL[emonade]", desc: "Absolute Citron, Triple Sec, muddled lemon and simple syrup, sour mix, and Sprite.", subname: "$9.95" }
            ];
    
    var events = [
            { divider:"Upcoming Events" },
            { name: "Super Bowl Party", subname: "1/28" },
            { name: "Valentine's Singles Party", subname: "2/14" },
            { divider:"Weekly Events" },
            { name: "Hospitality Night", subname: "Monday" },
            { name: "Trivia Night", subname: "Tuesday" },
            { name: "Karaoke with Liam", subname: "Thursday" }
            ];
    
    res.render('index', {
        nav:[
            { name:"Home", title:"Clark's Bar and Grille", url:"home", icon:"home", module:"home", run:"startSlider", source:frontpageImages },
            { name:"Menu", url:"menu", icon:"cutlery", module:"list", source:menu },
            { name:"Drinks", url:"drinks", icon:"glass", module:"list", source:drinks },
            { name:"Events", url:"events", icon:"calendar", module:"list", source:events },
            { name:"Restaurant Info", title:"Restaurant Info", url:"business-info", icon:"info-circle", module:"business-info" },
            { name:"Instagram Feed", title:"Instagram", url:"instagram", icon:"instagram", module:"instagram", run:"startInstagram" },
            { name:"Like and Follow Us", title:"Social Media", url:"social-media", icon:"thumbs-up", module:"social-media-links" },
            { name:"Contact Clark's", title:"Contact Clark's", url:"contact", icon:"envelope", module:"contact" }
            ]
    });
    

    });

    当页面立即渲染时,我让index.ejs循环nav对象并显示每个DIV(Home,Menu,Drinks,Events等)。 nav对象中的每个数组都有一个名为source的键,它返回上面列出的对象。页面渲染完美,它只是没有连接到数据库。我想用DB连接版本交换所有这些!

1 个答案:

答案 0 :(得分:1)

我希望此代码可以为您提供帮助,这是我能为您提供的最佳建议:

function handleError(message, error) {
    //Handle any error here, for example:
    console.error(message, error);
    res.send(500, message);
}

var responseContent = {
    nav: [],
};

getBusiness(); //start fetching data

function getBusiness() {
    var businessQuery = /*query to get element AppUrl=example.com*/;
    businessQuery.first().then(
        getNavigation,
        handleError.bind(null, 'error getting business'));
}

function getNavigations(business) {
    var navigationsQuery = /*query to get navigation elements*/;
    var promises = [];
    navigationsQuery.each(function (navigation) {
        promises.push(processNavigation(navigation));
    }).then(
        function () {
            Parse.Promise.when(promises).then(
                renderResult,
                handleError.bind(null, 'error processing navigations'));
        },
        handleError.bind(null, 'error iterating navigations'));
}

function processNavigation(navigation) {
    var promise = Parse.Promise();
    var nav = {
        name: /*name*/,
        url: /*url*/,
    };
    responseContent.nav.push(nav);
    switch (/*module*/) {
        case 'Home':
            getPhotosContent(/*args*/).then(
                function (source) {
                    nav.source = source;
                    promise.resolve();
                },
                function (error) {
                    promise.reject(error);
                }
            );
            break;
        //can do similar code for 'About Us', 'Menus', ...
        default:
            promise.resolve();
    }
    return promise;
}

function getPhotosContent(/*args*/) {
    var promise = Parse.Promise();
    var results = [];
    var photosQuery = /*query to get photos*/;
    photosQuery.each(function (photo) {
        results.push(photo);
    }).then(
        function () {
            promise.resolve(results);
        }, function (error) {
            promise.reject(error);
        }
    );
    return promise;
}

function renderResult() {
    res.render('index', responseContent);
}