Skip to content

Instantly share code, notes, and snippets.

@lxe
Last active August 29, 2015 14:24
Show Gist options
  • Select an option

  • Save lxe/796992d7849a2e74a628 to your computer and use it in GitHub Desktop.

Select an option

Save lxe/796992d7849a2e74a628 to your computer and use it in GitHub Desktop.

ES6 Shit

I started converting simple things into the cool new Babel/ES6/ES2015. Turns out that a lot of the new features are very much half-assed.

Root exports handling

Let's use export syntax to replicate:

module.exports = function () {};
module.exports.SOMECONST = 'lol';

I tried

export default function () {}
export const SOMECONST = 'lol';

Which babelized into:

exports['default'] = function () {};

var SOMECONST = 'lol';
exports.SOMECONST = SOMECONST;

The function is no longer exported as root... instead it's attached to 'default'; Some people say that "I shouldn't attach things to instances of Function". Maybe I shouldn't. But I can. And it works and it's useful, as you can see in this case.

HOWEVER,

export default function () {}

Babelized into:

exports["default"] = function () {};

module.exports = exports["default"];

Oh ok, so NOW 'default' = module.exports... Well alright

Class (static) Variables

Classes are great for class (static) functions AND variables. They usually represent constant variables or instances. If we're using classes, it would be cool to do things like:

class Color {
  static const RED = "red";
  constuctor() {
    // ...
  }
}

console.log(Color.RED);

Well you can't define class variables. Because it's still prototypical and it has been decided by someone that "it's a bad thing to declare variables on the prototype" so let's just take the worst of both worlds and not support it...

Multiline template strings

Awesome! No more util.format for me! Also no more concating everything!

let foo = 'bar';
let myString = `I am {foo}!
  Hear me roar!`;

This compiles into:

var myString = 'I am {foo}!\n  Hear me roar!';

Newlines? Whitespace? It makes sense... but it's annoying. Solution? "De-dent" (https://github.com/dmnd/dedent) among others. We have to invent a word and introduce more logic to undo what ES6's undesirable behavior.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment