EN | KR

FxJS - Functional Extensions for Javascript

FxJS is a functional programming library based on ECMAScript 6. Iterable, Iterator, Generator, Promise.

• Getting Started
  • Installation
  • Iteration protocols
  • Iterable programming
  • Lazy evaluation
  • FRP style
  • Promise/async/await
  • Concurrency
  • Error handling
• API
  • Function
  • Strict
  • Predicates
  • Lazy
  • Concurrency
  • Stoppable
  • String
• Extention Libraries
  • FxSQL
  • FxDOM
  • FxContrib

Getting Started

Installation

In Modern Browsers Supporting ES6

fx.js is a bundle of FxJS written in the ECMAScript Module as a single script file that can be run in a browser.

Note: fx.js uses thefx, _,L, and C properties of the window object as namespaces.

• fx.js
• fx.js.map
• fx.min.js

<script src="https://unpkg.com/fxjs/dist/fx.min.js"></script>

In Legacy ES5 Browsers

fx.es5.js is the build of FxJS as an IE11 browser target.

Note: Like fx.js, fx.es5.js also use the window object'sfx, _,L, and C properties as namespace.

• fx.es5.js
• fx.es5.js.map
• fx.es5.min.js

<script src="https://unpkg.com/fxjs/dist/fx.es5.min.js"></script>

In Node.js

FxJS is developed as ECMAScript Module. However, the files published in the fxjs package are the CommonJS Module, which is transpiled to support Node.js 6 version.

npm install fxjs

const FxJS = require("fxjs");
const _ = require("fxjs/Strict");
const L = require("fxjs/Lazy");
const C = require("fxjs/Concurrency");

// The default module that imported has all the functions in fxjs, including Lazy and Concurrency.
const { reduce, filterL, mapC } = FxJS;

// You can also import the functions individually.
const rangeL = require("fxjs/Lazy/rangeL");

_.go(
  rangeL(1, 5),
  filterL((a) => a % 2),
  L.map((a) => a * 10),
  reduce(_.add),
  _.log
); // 40

Module bundlers generally don't support Tree-Shaking to CommonJS modules, so when using the fxjs package, it is recommended that you import functions individually.

import rangeL from "fxjs/Lazy/rangeL";
import filterL from "fxjs/Lazy/filterL";
import mapL from "fxjs/Lazy/mapL";
import go from "fxjs/Strict/go";
import add from "fxjs/Strict/add";
import reduce from "fxjs/Strict/reduce";
import log from "fxjs/Strict/log";

go(
  rangeL(1, 5),
  filterL((a) => a % 2),
  mapL((a) => a * 10),
  reduce(add),
  log
); // 40

ECMAScript Module

FxJS publishes the fxjs2 package, which is written only with the native ECMAScript Module. In the fxjs2 package, the type field is defined as module in the package.json file. Development tools like mocha and jest do not yet support Native ESM, so be careful about using it.

npm install fxjs2

import { go, reduce, add, log } from "fxjs2";
import * as L from "fxjs2/Lazy/index.js";

go(
  L.range(1, 5),
  L.filter((a) => a % 2),
  L.map((a) => a * 10),
  reduce(add),
  log
); // 40

Iteration protocols

You can evaluate the iterator as a function of FxJS.

function* fibonacci() {
  let a = 0,
    b = 1;
  while (true) {
    yield a;
    [a, b] = [b, a + b];
  }
}

const f = pipe(
  fibonacci,
  L.filter((n) => n % 2 == 0),
  L.takeWhile((n) => n < 10)
);

const iterator = f();
console.log(iterator.next()); // { value: 0, done: false }
console.log(iterator.next()); // { value: 2, done: false }
console.log(iterator.next()); // { value: 8, done: false }
console.log(iterator.next()); // { value: undefined, done: true }

reduce((a, b) => a + b, f());
// 10

Iterable programming

Any value can be used with FxJS if it has a [Symbol.iterator]() method.

const res = go(
  [1, 2, 3, 4, 5],
  filter((a) => a % 2),
  reduce(add)
);

log(res); // 9

Lazy evaluation

You can do 'lazy evaluation' as a function of the L namespace.

const res = go(
  L.range(Infinity),
  L.filter((a) => a % 2),
  L.take(3),
  reduce(add)
);

log(res); // 9

FRP style

Functional reactive programming style.

go(
  L.range(Infinity),
  L.map(delay(1000)),
  L.map((a) => a + 10),
  L.take(3),
  each(log)
);
// After 1 second 10
// After 2 seconds 11
// After 3 seconds 12

Promise/async/await

Asynchronous control is easy.

// L.interval = time => L.map(delay(time), L.range(Infinity));

await go(
  L.interval(1000),
  L.map((a) => a + 30),
  L.takeUntil((a) => a == 33),
  each(log)
);
// After 1 second 30
// After 2 seconds 31
// After 3 seconds 32
// After 4 seconds 33

const res = await go(
  L.interval(1000),
  L.map((a) => a + 20),
  L.takeWhile((a) => a < 23),
  L.map(tap(log)),
  reduce(add)
);
// After 5 seconds 20
// After 6 seconds 21
// After 7 seconds 22

log(res);
// 63

Concurrency

C functions can be evaluated concurrency.

await map(getPage, range(1, 5));
// After 4 seconds
// [page1, page2, page3, page4]

const pages = await C.map(getPage, range(1, 5));
// After 1 second
// [page1, page2, page3, page4]

Like Clojure Reducers, you can handle concurrency.

go(
  range(1, 5),
  map(getPage),
  filter((page) => page.line > 50),
  map(getWords),
  flat,
  countBy(identity),
  log
);
// After 4 seconds
// { html: 78, css: 36, is: 192 ... }

go(
  L.range(1, 5),
  L.map(getPage),
  L.filter((page) => page.line > 50),
  L.map(getWords),
  C.takeAll, // All requests same time.
  flat,
  countBy(identity),
  log
);
// After 1 second
// { html: 78, css: 36, is: 192 ... }

go(
  L.range(1, 5),
  L.map(getPage),
  L.filter((page) => page.line > 50),
  L.map(getWords),
  C.takeAll(2), // 2 requests same time.
  flat,
  countBy(identity),
  log
);
// After 2 second
// { html: 78, css: 36, is: 192 ... }

Error handling

You can use JavaScript standard error handling.

const b = go(
  0,
  (a) => a + 1,
  (a) => a + 10,
  (a) => a + 100
);

console.log(b);
// 111

try {
  const b = go(
    0,
    (a) => {
      throw { hi: "ho" };
    },
    (a) => a + 10,
    (a) => a + 100
  );

  console.log(b);
} catch (c) {
  console.log(c);
}
// { hi: 'ho' }

You can use async/await and try/catch to handle asynchronous error handling.

const b = await go(
  0,
  (a) => Promise.resolve(a + 1),
  (a) => a + 10,
  (a) => a + 100
);

console.log(b);
// 111

try {
  const b = await go(
    0,
    (a) => Promise.resolve(a + 1),
    (a) => Promise.reject({ hi: "ho" }),
    (a) => a + 100
  );

  console.log(b);
} catch (c) {
  console.log(c);
}
// { hi: 'ho' }

API

• Function
  • apply
  • call
  • calls
  • constant
  • curry
  • curryN
  • debounce
  • go
  • juxt
  • negate
  • once
  • pipe
  • tap
  • throttle
• Strict
  • add
  • append
  • baseSel
  • chunk
  • compact
  • countBy
  • deepFlat
  • defaults
  • defaultTo
  • delay
  • difference
  • differenceBy
  • differenceWith
  • divide
  • drop
  • dropRight
  • dropUntil
  • dropWhile
  • each
  • entries
  • extend
  • filter
  • find
  • findWhere
  • flat
  • flatMap
  • groupBy
  • head
  • identity
  • indexBy
  • initial
  • insert
  • intersection
  • intersectionBy
  • intersectionWith
  • join
  • keys
  • last
  • map
  • mapEntries
  • mapObject
  • max
  • maxBy
  • mean
  • meanBy
  • min
  • minBy
  • multiply
  • noop
  • object
  • omit
  • omitBy
  • partition
  • pick
  • pickBy
  • pluck
  • prepend
  • promiseAllEntries
  • promiseAllObject
  • range
  • reduce
  • reject
  • remove
  • repeat
  • replace
  • sel
  • slice
  • sort
  • sortBy
  • sortByDesc
  • sortDesc
  • split
  • splitEvery
  • subtract
  • sum
  • sumBy
  • tail
  • take
  • take1
  • takeAll
  • takeUntil
  • takeWhile
  • times
  • toIter
  • union
  • unionBy
  • unionWith
  • unique
  • uniqueBy
  • uniqueWith
  • unzip
  • update
  • updateBy
  • values
  • zip
  • zipObj
  • zipWith
• Predicates
  • all
  • and
  • any
  • both
  • cond
  • either
  • equals
  • equals2
  • equalsBy
  • equalsBy2
  • every
  • gt
  • gte
  • has
  • ifElse
  • isArray
  • isFunction
  • isIterable
  • isMatch
  • isString
  • isUndefined
  • lt
  • lte
  • match
  • not
  • or
  • satisfiesEvery
  • satisfiesSome
  • selEquals
  • selSatisfies
  • some
  • unless
  • when
• Lazy
  • L.append
  • L.chunk
  • L.compact
  • L.concat
  • L.constant
  • L.deepFlat
  • L.difference
  • L.differenceBy
  • L.differenceWith
  • L.drop
  • L.dropUntil
  • L.dropWhile
  • L.empty
  • L.entries
  • L.filter
  • L.flat
  • L.flatMap
  • L.insert
  • L.intersection
  • L.intersectionBy
  • L.intersectionWith
  • L.interval
  • L.keys
  • L.limitLoad
  • L.map
  • L.mapEntries
  • L.prepend
  • L.range
  • L.reject
  • L.remove
  • L.repeat
  • L.reverse
  • L.slice
  • L.splitEvery
  • L.take
  • L.takeUntil
  • L.takeWhile
  • L.times
  • L.union
  • L.unionBy
  • L.unionWith
  • L.unique
  • L.uniqueBy
  • L.uniqueWith
  • L.update
  • L.updateBy
  • L.values
  • L.zip
  • L.zipWithIndex
• Concurrency
  • C.calls
  • C.compact
  • C.drop
  • C.every
  • C.filter
  • C.find
  • C.head
  • C.map
  • C.mapEntries
  • C.object
  • C.race
  • C.reduce
  • C.some
  • C.tail
  • C.take
  • C.take1
  • C.takeAll
  • C.takeRace
• Stoppable
  • reduceS, stop
  • goS, pipeS, stop, stopIf
• String
  • html
  • join
  • strMap
  • string

Extention Libraries

• FxSQL
• FxDOM
• FxContrib

The above libraries are based on FxJS. FxSQL and FxDOM are libraries that can handle SQL and DOM through functional APIs,respectively. FxContrib is contributors' library for FxJS, FxSQL and FxDOM.