CODEWITHSUNDEEP
facebookreactjs
Kuan
Kuan

Reputation: 11389

What language is Facebook dispatcher.js written in?

All:

When I learn React FLUX, it leads me to Facebook Dispatcher.js: https://github.com/facebook/flux/blob/master/src/Dispatcher.js

I do not quite understand its syntax of function and class, could any one tell what language writes it? Is it ES6 or TypeScript or something else? I wonder why it does not need to be transpiled ( or this do need transpile tool like babel in order to run?)

Some parts I need help with explanation are like:

register(callback: (payload: TPayload) => void): DispatchToken {
    var id = _prefix + this._lastID++;
    this._callbacks[id] = callback;
    return id;
  }

Or

class Dispatcher<TPayload> {
 //...

  constructor() {
    this._callbacks = {};
    this._isDispatching = false;
    this._isHandled = {};
    this._isPending = {};
    this._lastID = 1;
  }

Upvotes: 1

Views: 102

Answers (1)

Josh David Miller
Josh David Miller

Reputation: 120513

It is written in ES2015, which gets compiled with Babel. Babel has a whole section devoted to learing ES2015 That you should check out. The first code from above makes use of "arrow functions", which is a function shorthand that preserves the context (this). E.g. these two are equivalent:

var fn = function ( prop ) {/* ... */}.bind(this);
var fn = ( prop ) => {/* ... */};

The code also makes use of FlowType, which is a static type checker for JavaScript. The <TPayload> indicates that the Dispatcher class is polymorphic with respect to TPayload. That is, a class can extend from Dispatcher but use any type for the payload and the static type checker will ensure that same type is used throughout the entire class definition. Unless you're using FlowType in your code too, you can safely ignore it. However, an implementation might look like this:

class MyDispatcher extends Dispatcher<MyStorageType> {
  /* ... */
}

Now the static type checker will ensure that all the places where Dispatcher uses the type TPayload, it will actually use the type MyStorageType.

But enough about those details because you don't really need to know about them to use Facebook's Flux utilities. You'll get a much better idea of how it works by following the reference docs and the tutorial, which implements a basic dispatcher from scratch.

Hope this helps!

Upvotes: 3

Related Questions