ecmascript-6

How to destructure an object to an already defined variable? [duplicate]

by

You need to use assignment separate from declaration syntax: ({ screenings, size } = source); Babel REPL Example From the linked docs: The ( .. ) around the assignment statement is required syntax when using object literal destructuring assignment without a declaration And obviously you need to use this as you can’t redeclare a let … Read more

Object.freeze() vs const

by

const and Object.freeze are two completely different things. const applies to bindings (“variables”). It creates an immutable binding, i.e. you cannot assign a new value to the binding. Object.freeze works on values, and more specifically, object values. It makes an object immutable, i.e. you cannot change its properties.

Object.hasOwnProperty() yields the ESLint ‘no-prototype-builtins’ error: how to fix?

by

You can access it via Object.prototype: Object.prototype.hasOwnProperty.call(obj, prop); That should be safer, because Not all objects inherit from Object.prototype Even for objects which inherit from Object.prototype, the hasOwnProperty method could be shadowed by something else. Of course, the code above assumes that The global Object has not been shadowed or redefined The native Object.prototype.hasOwnProperty has … Read more

Enums in Javascript with ES6

by

Is there a problem with this formulation? I don’t see any. Is there a better way? I’d collapse the two statements into one: const Colors = Object.freeze({ RED: Symbol(“red”), BLUE: Symbol(“blue”), GREEN: Symbol(“green”) }); If you don’t like the boilerplate, like the repeated Symbol calls, you can of course also write a helper function makeEnum … Read more

“unexpected token import” in Nodejs5 and babel?

by

From the babel 6 Release notes: Since Babel is focusing on being a platform for JavaScript tooling and not an ES2015 transpiler, we’ve decided to make all of the plugins opt-in. This means when you install Babel it will no longer transpile your ES2015 code by default. In my setup I installed the es2015 preset … Read more

Can ES6 template literals be substituted at runtime (or reused)?

by

To make these literals work like other template engines there needs to be an intermediary form. The best way to do this is to use the Function constructor. const templateString = “Hello ${this.name}!”; const templateVars = { name: “world” } const fillTemplate = function(templateString, templateVars){ return new Function(“return `”+templateString +”`;”).call(templateVars); } console.log(fillTemplate(templateString, templateVars)); As with … Read more

When should I use a return statement in ES6 arrow functions

by

Jackson has partially answered this in a similar question: Implicit return, but only if there is no block. This will result in errors when a one-liner expands to multiple lines and the programmer forgets to add a return. Implicit return is syntactically ambiguous. (name) => {id: name}returns the object {id: name}… right? Wrong. It returns … Read more

React functional stateless component, PureComponent, Component; what are the differences and when should we use what?

by

How do you decide, how do you choose between these three based on the purpose/size/props/behaviour of our components? Extending from React.PureComponent or from React.Component with a custom shouldComponentUpdate method have performance implications. Using stateless functional components is an “architectural” choice and doesn’t have any performance benefits out of the box (yet). For simple, presentational-only components … Read more