node.js - 将 forEach() 与早期返回相结合

Question

我的问题

ESLint airbnb 策略不允许 for...of 循环迭代，而更喜欢 forEach((element) => { code });。但是，该循环的内部返回被吞没了 - 它们被视为匿名函数的返回，而不是包含循环的函数。

代码

原创

有效，但会中断 eslint-config-airbnb .

const words = ['harry', 'potter', 'and', 'the', 'forbidden', 'journey'];

const MIN_WORD_SIZE = 4;
const MAX_WORDS = 3;

function NestedIterator1() {
  const wordlist = [];
  for (const word of words) {
    if (word.length >= MIN_WORD_SIZE) {
      wordlist.push(word);
    }
    if (wordlist.length >= MAX_WORDS) {
      return wordlist;
    }
  }
  return wordlist;
}

console.log(NestedIterator1());

备选方案 1:迭代数组索引

有效，但样式已过时，我必须通过索引手动分配值。

const words = ['harry', 'potter', 'and', 'the', 'forbidden', 'journey'];

const MIN_WORD_SIZE = 4;
const MAX_WORDS = 3;


function NestedIterator2() {
  const wordlist = [];
  for (let i = 0; i < words.length; i += 1) {
    const word = words[i];
    if (word.length >= MIN_WORD_SIZE) {
      wordlist.push(word);
    }
    if (wordlist.length >= MAX_WORDS) {
      return wordlist;
    }
  }
  return wordlist;
}


console.log(NestedIterator2());

备选方案 2:使用 forEach

遵循风格指南，但不起作用 - 内部返回被视为来自匿名函数的返回，而不是 NestedIterator3。

const words = ['harry', 'potter', 'and', 'the', 'forbidden', 'journey'];

const MIN_WORD_SIZE = 4;
const MAX_WORDS = 3;

function NestedIterator3() {
  const wordlist = [];
  words.forEach((word) => {
    if (word.length >= MIN_WORD_SIZE) {
      wordlist.push(word);
    }
    if (wordlist.length >= MAX_WORDS) {
      return wordlist;
    }
  });
  return wordlist;
}

console.log(NestedIterator3());

我的问题

函数如何迭代数组，同时允许提前返回并避免索引和 for..of 迭代？

Answer 1

一个选择是使用reduce，它非常灵活，可以在许多其他迭代方法不够用的情况下使用——仅push到累加器，如果累加器的长度小于 MAX_WORDS 并且单词的长度就足够了:

const words = ['harry', 'potter', 'and', 'the', 'forbidden', 'journey'];

const MIN_WORD_SIZE = 4;
const MAX_WORDS = 3;

function NestedIterator3() {
  return words.reduce((wordlist, word) => {
    if (wordlist.length < MAX_WORDS && word.length >= MIN_WORD_SIZE) {
      wordlist.push(word);
    }
    return wordlist;
  }, []);
}

console.log(NestedIterator3());

尽管如此，上述方法确实遍历了所有指标 - 它实际上并没有提前返回，它只是在满足结束条件后的后续迭代中不做任何事情。如果你真的想跳出迭代器，你可以使用 .some 来代替，尽管它更不纯粹，而且代码的意图在 IMO 中不太清楚:

const words = ['harry', 'potter', 'and', 'the', 'forbidden', 'journey'];

const MIN_WORD_SIZE = 4;
const MAX_WORDS = 3;

function NestedIterator3() {
  const wordlist = [];
  words.some((word) => {
    if (word.length >= MIN_WORD_SIZE) {
      wordlist.push(word);
    }
    return wordlist.length === MAX_WORDS;
  }, []);
  return wordlist;
}

console.log(NestedIterator3());

对于这个特定的例子，您还可以使用 filter 后跟 slice:

const words = ['harry', 'potter', 'and', 'the', 'forbidden', 'journey'];

const MIN_WORD_SIZE = 4;
const MAX_WORDS = 3;

function NestedIterator3() {
  return words
    .filter(word => word.length >= MIN_WORD_SIZE)
    .slice(0, MAX_WORDS)
}

console.log(NestedIterator3());

当然看起来更优雅，但是 .filter 必须首先遍历数组中的所有项目，因此与 reduce 有同样的问题(不短-circuiting is going on) - 此外，这两个链式方法仅代表了人们可能想要短路数组迭代的情况的一个子集。