Giter Site home page Giter Site logo

fxjs's Introduction

EN | KR

FxJS - Functional Extensions for Javascript

npm npm bundle size npm NPM

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

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 the fx, _, L, and C properties of the window object as namespaces.

<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's fx, _, L, and C properties as namespace.

<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

Extention Libraries

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.

fxjs's People

Contributors

indongyoo avatar shine1594 avatar jeewhan avatar devmarpple avatar ne2030 avatar dependabot[bot] avatar hg-pyun avatar goohooh avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.