JavaScript 函数，返回未定义

Question

大家好希望你们都做得很好，

这是我的代码，带有名称的函数和回调将名称作为回调函数以返回名称和 console.log

如果我

function doSomething(name,callback) {
    callback(name);
}

function foo(n) {
    return n;
}

var val = doSomething("TEST",foo);
console.log(val);

我没有定义。

如果我

function doSomething(name,callback) {
    callback(name);
}

function foo(n) {
    console.log(n);
}

var val = doSomething("TEST",foo);

工作正常并且 console.log 测试名称。

那么为什么退货不起作用？

谢谢

原文由 Obeid 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

您的 doSomething() 函数不返回任何内容，这意味着使用它的赋值将为 undefined 。但是，这并不是真正的问题所在。

潜在的问题是您似乎在这里混合了两种不同的数据处理模式：如果您正在编写纯同步代码，则使用返回函数（它会立即返回一些值）。如果您需要异步代码，则使用回调（它将“最终”做某事）。混合这两种模式会导致问题和挫败感：

任何一个：

1. 不要将您的函数命名为“回调”，并让它返回其处理后的值，或者
2. 让回调负责执行您要使用 val 执行的任何操作。

情况1：

 function doSomething(data, processor) {
  return processor(data);
}

function passThrough(v) { return v; }

var val = doSomething("test", passThrough);
// immediately use "val" here in for whatever thing you need to do.

案例二：

 function doSomething(data, callback) {
  // _eventually_ a callback happens - for instance, this
  // function pulls some data from a database, which is one
  // of those inherently asynchronous tasks. Let's fake that
  // with a timeout for demonstration purposes:
  setTimemout(() => callback(data), 500);
}

function handleData(val) {
  // use "val" here in for whatever thing you need to do. Eventually.
}

doSomething("test", handleData);

如果你想使用案例 2，你真的想看看现代 Javascript 中的“Promises”和 async/await，它们是基于“一旦有事情要回调就回调”的想法得到高度改进的方法”。

2021 年编辑：自最初撰写此答案以来的第三种选择是使用 异步/等待 模式，这是 Promises 的语法糖。

案例三：

 async function doSomething(input) {
  // we're still _eventually_ returning something,
  // but we're now exploiting `async` to wrap a promise,
  // which lets us write normal-looking code, even if what
  // we're really doing is returning a Promise object,
  // with the "await" keyword auto-unpacking that for us.
  return someModernAsyncAPI.getThing(input);
}

function handleData(val) {
  // ...
}

async function run() {
  const data = await doSomething("test");
  handleData(data);
}

run();

原文由 Mike ‘Pomax’ Kamermans 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

function doSomething(name,callback) {
callback(name);
}

function foo(n) {
   console.log(n);
   return n;
}

var val = doSomething("TEST",foo);

看看上面的代码。当您调用 doSomething 时，它会在内部执行 foo，它会在控制台上打印出来，因为这就是 console.log 的用途。然而，在这条语句之后，它也返回 n，然后在 doSomething 中接收到。但它没有被退回。简单的说，你主要做的是

function doSomething(name,callback) {
    const returnValue = callback(name);
}

如果你调用上面的方法，它会返回undefined。要使其返回正确的值，您必须调用 “return returnValue” 。类似地你必须说 return callback(name)

希望这可以帮助。

快乐学习

原文由 Vatsal 发布，翻译遵循 CC BY-SA 4.0 许可协议