30-seconds-of-code（2021-06-21）

[yaogengzhu]

01 - for

const files = [ 'foo.txt ', '.bar', '   ', 'baz.foo' ];
let filePaths = [];

for (let file of files) {
  const fileName = file.trim();
  if(fileName) {
    const filePath = `~/cool_app/${fileName}`;
    filePaths.push(filePath);
  }
}
// filePaths = [ '~/cool_app/foo.txt', '~/cool_app/.bar', '~/cool_app/baz.foo']

• 任何for循环都可以使用
• 由于函数式编程越来越流行，现在已经不那么常见了。
• 对迭代的控制，例如跳过元素或早期返回。
• 结果数组需要在循环之外预先声明。
• 使用Array.prototype.push()或spread(…)操作符添加元素。
• 复杂度为O(N)，每个元素将只迭代一次。

02 - reduce

const filePaths = files.reduce((acc, file) => {
    const fileName = file.trim();
    if (fileName) {
        const filePath = `~/cool_app/${fileName}`;
        acc.push(filePath);
    }
    return acc;
}, [])

console.log(filePaths);

• 使用array .prototype.reduce()以一个空数组作为初始值。
• 由于函数式编程越来越流行，这在今天更加普遍。
• 对迭代的控制越少，就不能跳过元素或尽早返回。
• 如果需要，可以与其他方法链接。
• 使用Array.prototype.push()或spread(…)操作符添加元素。
• 复杂度为O(N)，每个元素将只迭代一次。

03 -Map

const files = [ 'foo.txt ', '.bar', '   ', 'baz.foo' ];
const filePaths = files
  .map(file => file.trim())
  .filter(Boolean)
  .map(fileName => `~/cool_app/${fileName}`);
console.log(filePaths);

• 使用Array.prototype.map()和Array.prototype.filter()。
• 由于函数式编程越来越流行，这在今天更加普遍。
• 对迭代的控制越少，就不能跳过元素或尽早返回。
• 声明性的，更容易阅读和重构，链可以根据需要增长。
• 不使用Array.prototype.push()或spread(…)操作符。
• O(cN)复杂度，每个元素c次迭代，(c:链的长度)。