JavaScript – Pipeline Operator

介绍

Pipeline Operator (|>) 是一个很新的 JavaScript 语法，目前还在 TC39 stage 2。

它有啥用呢？我们一起来看看关于 pipe 的前世今生。

 

参考

YouTube – Javascript's New Pipeline Operator Is Awesome!

 

Pipe 的前世今生

我们直接看例子。

Single Function

这是一个 sum 函数

function sum(numbers) {return numbers.reduce((total, number) => total + number, 0);
}

没什么特别的，就是把 array 的 number 累加起来，返回一个总数，使用方式是这样

const numbers = [1, 2, 3, 4, 5, 6];
const total = sum(numbers); 
console.log(total); // 21

好，再一个 removeOdd 函数

function removeOdd(numbers) {return numbers.filter(number => number % 2 === 0);
}

也没什么特别的，就是把 array 里的单数删除，只留下双数，使用方式是这样

const numbers = [1, 2, 3, 4, 5, 6];
const evenNumbers = removeOdd(numbers); 
console.log(evenNumbers); // [2, 4, 6]

Combine Function

那如果我想要先 “删除单数 removeOdd” 接着 "累加 sum" 该怎么写呢？

const numbers = [1, 2, 3, 4, 5, 6];const evenNumbers = removeOdd(numbers); // [2, 4, 6]
const total = sum(evenNumbers); console.log(total); // 12