ES6 Features (Babel)

ReactJS.NET supports the use of ECMAScript 6 features, thanks to Babel. These features include:

  • Arrow functions — A syntax for inline lambda functions similar to C#. These are very useful when combined with the map and filter methods of arrays:
var numbers = [1, 2, 3, 4];
var doubled = numbers.map(number => number * 2); // [2, 4, 6, 8]

Arrow functions also implicitly bind this, so you do not need to write .bind(this) when passing around a function as a callback.

  • Concise methods — You no longer need to write : function in your object literals:
// The old way
var OldAndBusted = React.createClass({
  render: function() {
    // ...
  },
  doStuff: function() {
    // ...
  }
});

// The new way
var NewHotness = React.createClass({
  render() {
    // ...
  },
  doStuff() {
    // ...
  }
});
  • Classes — Similar to the class systems included in JavaScript frameworks such as Prototype and MooTools, but will (eventually) be native to JavaScript
class AwesomeStuff {
  add(first, second) {
    return first + second;
  }
}

var foo = new AwesomeStuff();
foo.add(2, 3); // 5

Comments