Question

我对javascript相对较新，我正在尝试清理我的原型代码，因为它是buncha深层嵌套的回调级别，而且很难阅读。我正在努力实现这样的目标：

GoogleMaps.ready(map_id_name, function(map) {
    g_map = map.instance;
})

...

call_when_ready(g_map, set_map_viewport);
call_when_ready(g_map, create_markers);
call_when_ready(g_map, update_icons);
call_when_ready(g_map, update_geometry_display);
call_when_ready(g_map, update_ui_display);

我知道我可以在GoogleReady回调中移动所有call_when_ready，但这是一个简化示例，其中call_when_ready在另一个回调中被调用。

所以我提出了这个功能，但它不起作用：

function call_when_ready(variable, callback) {

    let interval = setInterval(() => 
    { 
        if (variable != undefined && variable != null) {
            clearInterval(interval);
            callback();
        }

    }, 3000);
}

即使正在填充g_map，变量也始终显示为null。我怎样才能以干净的方式实现这一目标？我也愿意使用jQuery但是Promise和Deffer ed对于一些微不足道的东西似乎太过分了。或者是否有一种更好的方式来链接回调，例如我不知道：

function().finished(function).finished(alert(""));

Answer 1

g_map位于GoogleMaps.ready通话中匿名功能的本地范围内。

如果我正确理解你的意图，你应该把所有的函数调用都移到匿名函数中。

GoogleMaps.ready(map_id_name, function(map) {
    g_map = map.instance;
    set_map_viewport();
    create_markers();
    update_icons();
    update_geometry_display();
    update_ui_display();  
});

Answer 2

最简单的选择是将引用的函数移动到GoogleMaps.ready函数中，如果我没有把它误认为是回调

Answer 3

如果不是传递要检查的变量，而是传递一个返回它的函数：

/* mockup */
var g_map;
var map_id_name = "example";
var GoogleMaps = {
  ready: (a, f) => {
    f({
      instance: 1
    });
  }
}

// simulate map being ready after 2.5 seconds
setTimeout(() => {
  GoogleMaps.ready(map_id_name, function(map) {
    g_map = map.instance;
    console.log("g_map set");
  });
}, 2500);

function call_when_ready(getVariable, callback) {
  let interval = setInterval(() => {
    if (getVariable()) {
      clearInterval(interval);
      callback();
    }
  }, 2000);
}

function getGMap() {
  return g_map;
}

call_when_ready(getGMap, set_map_viewport);
call_when_ready(getGMap, create_markers);

function set_map_viewport() {
  console.log("set_map_viewport");
}
function create_markers() {
  console.log("create_markers");
}

在javascript中使用ready函数创建调用

3 个答案: