从包含数据库查询的javascript函数返回对象

returning object from a javascript function with database query inside

本文关键字：函数 返回 对象 javascript 包含 数据库 查询      更新时间：2023-09-26

我试图将标记作为对象返回，但当我运行函数时，它只返回[]，但在内部打印它时，我可以看到对象数据，有人能解释如何返回对象batch2吗？

google.maps.event.addListener(mgr, 'loaded', function(){
            mgr.addMarkers(getMarkers(),6); //add all the markers! documentation for viewports with totals for city count, look at viewport
            mgr.addMarkers(getMarkers2(),14); //get markers for zoomed out place, add click function to zoom in
            //mgr.addMarkers(getMarkers(1000), 8);
            console.log("added");
            mgr.refresh();
        });
function getMarkers2() {
        var batch2 = [];
        var clusters = new Parse.Query("cityfreqcoords");
        var clusterresults = new Parse.Object("cityfreqcoords");
        clusters.find({
            success: function (results) {
                for (i = 1; i < results.length; i++) {
                    var city = (results[i]["attributes"]["city"]);
                    var count = (results[i]["attributes"]["count"]);
                    var lat = (results[i]["attributes"]["lat"]);
                    var lng = (results[i]["attributes"]["lng"]);
                    var markerLatlong = new google.maps.LatLng(lat, lng);
                    //icon =
                    //adding the marker
                    var marker2 = new google.maps.Marker({
                        position: markerLatlong,
                        title: city,
                        clickable: true,
                        animation: google.maps.Animation.DROP
                        //icon:icon
                    });
                    //adding the click event and info window
                    google.maps.event.addListener(marker2, 'click', function () {
                        map.setZoom(6);
                        map.setCenter(marker2.getPosition());
                    });
                    batch2.push(marker2);
                }
            }
        })
        return batch2;
    }

看起来clusters.find是异步的。在cluster.find成功之前返回batch2。在JavaScript中使用异步代码有几种模式，其中一种常见的模式是使用回调。你需要这样重写你的代码：

function getMarkers2(callback) {
    var batch2 = [];
    var clusters = new Parse.Query("cityfreqcoords");
    var clusterresults = new Parse.Object("cityfreqcoords");
    clusters.find({
        success: function (results) {
            for (i = 1; i < results.length; i++) {
                var city = (results[i]["attributes"]["city"]);
                var count = (results[i]["attributes"]["count"]);
                var lat = (results[i]["attributes"]["lat"]);
                var lng = (results[i]["attributes"]["lng"]);
                var markerLatlong = new google.maps.LatLng(lat, lng);
                //icon =
                //adding the marker
                var marker2 = new google.maps.Marker({
                    position: markerLatlong,
                    title: city,
                    clickable: true,
                    animation: google.maps.Animation.DROP
                    //icon:icon
                });
                //adding the click event and info window
                google.maps.event.addListener(marker2, 'click', function () {
                    map.setZoom(6);
                    map.setCenter(marker2.getPosition());
                });
                batch2.push(marker2);
            }
        }
        callback(batch2);
    })
}

然后这样称呼它：

getMarkers2(function(markers) {
  mgr.addMarkers(markers, 14);
});

如果你感兴趣，看看promise是如何工作的，因为你可能更喜欢这种方法而不是使用回调。

使用javascript中的回调，通常不会返回数据。您将另一个函数引用作为回调传递到处理程序中。

例如：

function getMarkers2(f) { 
    // do stuff
    //when done
    f(batch2)
}

最终只是通过将标记管理器设置为全局并将mgr传递到查询中，这可能不是实现的最有效方法

function getMarkers2(mgr) {
        Parse.initialize("X", "Y");
        var batch2 = [];
        var clusters = new Parse.Query("cityfrequency2");
        var clusterresults = new Parse.Object("cityfrequency2");
        clusters.find({
            success: function (results) {
                for (i = 0; i < (results.length); i++) {
                    var city = (results[i]["attributes"]["city"]);
                    var lat = (results[i]["attributes"]["lat"]);
                    var lng = (results[i]["attributes"]["lng"]);
                    var markerLatlong = new google.maps.LatLng(lat, lng);
                    var image = {
                        url: 'warning.png',
                        size: new google.maps.Size(50, 46),
                        // The origin 
                        origin: new google.maps.Point(0, 0),
                        // The anchor 
                        anchor: new google.maps.Point(25, 0)
                    };
                    //adding the marker
                    var marker2 = new google.maps.Marker({
                        position: markerLatlong,
                        title: city,
                        clickable: true,
                        animation: google.maps.Animation.DROP,
                        icon:image
                    });
                    //adding the click event and info window
                    google.maps.event.addListener(marker2, 'click', function () {
                        map.setZoom(6);
                        map.setCenter();
                    });
                    batch2.push(marker2);
                    mgr.addMarkers(batch2,0,6);
                    mgr.refresh();
                }
            }
        })
    }
    function setupMarkers() {
        var mgrOptions = { borderPadding: 50, maxZoom: 15, trackMarkers: true };
        mgr = new MarkerManager(map,mgrOptions);
        google.maps.event.addListener(mgr, 'loaded', function(){
            getMarkers2(mgr);
            getMarkers(mgr);
            console.log("added");
        });
    }
相关文章：