This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The experimental pipeline operator |>
(currently at stage 1) pipes the value of an expression into a function. This allows the creation of chained function calls in a readable manner. The result is syntactic sugar in which a function call with a single argument can be written like this:
let url = "%21" |> decodeURI;
The equivalent call in traditional syntax looks like this:
let url = decodeURI("%21");
Syntax
expression |> function
The value of the specified expression
is passed into the function
as its sole parameter.
Examples
Chaining function calls
The pipeline operator can improve readability when chaining several functions.
const double = (n) => n * 2; const increment = (n) => n + 1; // without pipeline operator double(increment(double(double(5)))); // 42 // with pipeline operator 5 |> double |> double |> increment |> double; // 42
Specifications
Specification | Status | Comment |
---|---|---|
Pipeline operator draft | Stage 1 | Not part of the ECMAScript specification yet. |
Browser compatibility
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Update compatibility data on GitHub
Desktop | Mobile | Server | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Pipeline operator (|> ) | Chrome No support No | Edge No support No | Firefox No support No | IE No support No | Opera No support No | Safari No support No | WebView Android No support No | Chrome Android No support No | Firefox Android No support No | Opera Android No support No | Safari iOS No support No | Samsung Internet Android No support No | nodejs No support No |
Legend
- No support
- No support
- Experimental. Expect behavior to change in the future.
- Experimental. Expect behavior to change in the future.