Babel compilation (ES6+)

Just want to see the code? Check out the webpack and on-the-fly JSX compliation sample projects.

ReactJS.NET supports the use of ES6+ 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
class NewHotness extends React.Component {
  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