ES6函数返回“未定义”而不是预期的字符串？ [复制]答案

【问题标题】：ES6 function returns `undefined` instead of expected string? [duplicate]ES6函数返回“未定义”而不是预期的字符串？ [复制]
【发布时间】：2017-07-26 20:55:56
【问题描述】：

我正在遍历 div 以在一系列 div 上找到单个“活动”类。然后我想从那个 div 中获取数据属性。我的数据属性很好，但似乎无法使用return 将其从函数中传递出去。它记录undefined。

const getPostcardLink = () => {
  console.log('getPostcardLink()...');
  $('.postcard').each(function () {
    if ($(this).hasClass('active')) {
      const postcard = $(this).data('postcard');
      console.log(postcard);
      return postcard;
    }
    return 'error';
  });
};

const getStampLink = () => {
  console.log('getStampLink()...');
  $('.stamp').each(function () {
    if ($(this).hasClass('active')) {
      const stamp = $(this).data('stamp');
      console.log(stamp);
      return stamp;
    }
    return 'error';
  });
};

function updatePostcard() {
  const postcard = `images/_${getPostcardLink()}.jpg`;
  const stamp = `images/_${getStampLink()}.jpg`;
  console.log(`${postcard} with ${stamp}`);
}

$(document).ready(() => {
  updatePostcard();
});

日志返回...

getPostcardLink()...
p1
getStampLink()...
s1
images/_undefined.jpg with images/_undefined.jpg

【问题讨论】：

getStampLink 不返回任何内容 - 那里根本没有 return 语句。
return stamp; 从 .each 回调返回，而不是从 getStampLink 返回。其他功能类似。 return 不跨越函数边界，它只从包含它的函数返回。
"error"被退回的情况如何处理？用.filter()替换.each()，检查.filter()的返回值是否有.length大于0
@Felix Kling：这有助于我修复我的代码。非常感谢！
我还将探索@guest271314 的过滤器建议。

标签： javascript ecmascript-6 return each

【解决方案1】：

使用.filter() 和getStamp() 的相同模式

const getPostcardLink = () => {
  console.log('getPostcardLink()...');
  let elems = $('.postcard').filter(function () {
    return $(this).hasClass('active')
  });
  if (elems.length) {
      const postcard = elems.data('postcard');
      console.log(postcard);
      return postcard
  }
  return "error"
};

function updatePostcard() {
  let cLink = getPostcardLink();
  let sLink = getStampLink();
  if (cLink !== "error") const postcard = `images/_${cLink}.jpg`;
  if (sLink !== "error") const stamp = `images/_${sLink}.jpg`;
  if (postcard && stamp) console.log(`${postcard} with ${stamp}`);
}

【讨论】：

您也可以将选择器传递给filter，例如$('.postcard').filter('.active')