Javascript 对象返回失败答案

【问题标题】：Javascript Object return failureJavascript 对象返回失败
【发布时间】：2019-06-08 17:04:42
【问题描述】：

更新：我已经想通了。感谢 eol 让我思考承诺。虽然推荐的脚本没有让我到达那里，但我的想法做到了。

为了让对象正确传递，我需要从对象本身开始，并重组代码以支持该目的。

var barBuildX = function(csv, domainColumnName, rangeMin, rangeMax, paddingInner, paddingOuter) {
 var x = {
    rMin: rangeMin,
    rMax: rangeMax,
    padIn: paddingInner,
    padOut: paddingOuter,
    domain: (function() {
         var dom = [];
         d3.csv(csv).then(function(data) {
            data.forEach(function(d) {
            dom[dom.length] = d[domainColumnName];
            });
         })
         return dom;
      })(),
    };
    console.log(x);
    return x;
    };
 };

这是一个相当基本的子例程，旨在使用满足 d3.js scaleBand() 函数所需的字段来填充对象。该脚本的第一部分按预期工作 - 根据提供的 CSV 文件中的“domainColumnName”构建一个域名数组。然而，第二部分，我们实际构建将返回的“x”对象，无法正常运行 - 没有写入控制台或带回我试图传递给它的任何数据。这尤其令人讨厌，因为它应该只是设置属性值并返回对象以在其他地方使用......有什么想法吗？

var barBuildX = function(csv, domainColumnName, rangeMin, rangeMax, paddingInner, PaddingOuter) {
  var dom = [];
  d3.csv(csv).then(function(data) {
    console.log(data); //this works
    data.forEach(function(d) {
      dom[dom.length] = d[domainColumnName];
    });
    console.log(dom); //this works
    var x = {
      domain: dom,
      rMin: rangeMin,
      rMax: rangeMax,
      padIn: paddingInner,
      padOut: paddingOuter
    };
    console.log(x); //this DOES NOT work
    return x; //Undefined... / Type Error
  });
};

有一个变量拼写差异的注释，不幸的是我在复制到这个线程时犯了一个错误。无效的原始来源中的可变拼写没有差异。

我在 Chrome 控制台中收到的错误消息是：“Uncaught TypeError: Cannot read property 'domain' of undefined”

所以，返回对象是未定义的......

【问题讨论】：

paddingOuter 与参数的拼写不同
这看起来像你遇到了duplicate of this，除了值应该在你说它们不是的地方定义。 “这不起作用”和“未定义.../类型错误”不是明确的问题陈述。您应该准确引用错误消息，并说明您从哪里读取它们。
"paddingOuter 的拼写方式与参数不同" — 这意味着在您说有任何错误之前，您应该得到 reference error 两行。
当我在离线系统上工作时，我在这里手动重新输入了代码。 paddingOuter的拼写和原源码一样...
您需要提供一个minimal reproducible example 来实际演示您的问题。理想情况下是live demo。问题下方有一个编辑链接。

标签： javascript object properties return closures

【解决方案1】：

你没有从你的函数中返回承诺，这就是为什么你会得到undefined 作为返回值。做这样的事情：

var barBuildX = function(csv, domainColumnName, rangeMin, rangeMax, paddingInner, PaddingOuter) {
  var dom = [];
  return d3.csv(csv).then(function(data) {
    console.log(data); //this works
    data.forEach(function(d) {
      dom[dom.length] = d[domainColumnName];
    });
    console.log(dom); //this works
    var x = {
      domain: dom,
      rMin: rangeMin,
      rMax: rangeMax,
      padIn: paddingInner,
      padOut: paddingOuter
    };
    console.log(x); //this DOES NOT work
    return x; //Undefined... / Type Error
  });
};

// how to invoke the function:
barBuildX(...).then(x => {
   console.log(x);
});

【讨论】：