ecmascript-6

Why React Hook useState uses const and not let

by

clearly going to be reassigned to a different primitive value Not really. When the component is rerendered, the function is executed again, creating a new scope, creating a new count variable, which has nothing to do with the previous variable. Example: let _state; let _initialized = false; function useState(initialValue) { if (!_initialized) { _state = … Read more

Spreading undefined in array vs object

by

As noted in the comments, and summarized by @ftor from #687, object spread is equivalent1 to Object.assign() (issues #687, #45), whereas spread in array literal context is iterable spread. Quoting Ecma-262 6.0, Object.assign() is defined as: 19.1.2.1 Object.assign ( target, …sources ) The assign function is used to copy the values of all of the … Read more

Difference between import React and import { Component } syntax [duplicate]

by

Here are the docs for import. import React from ‘react’ The above is a default import. Default imports are exported with export default …. There can be only a single default export. import { Component } from ‘react’ But this is a member import (named import). Member imports are exported with export …. There can … Read more

What do the curly braces do in switch statement after case in es6?

by

Curly braces used in this way establish their own block scope, in which you can define local let variables or const constants: switch (false) { case true: { let x = “bar”; console.log(x); break; } case false: { let x = “baz”; console.log(x); break; } } The example would throw without nested block scopes, since … Read more

Inlining ECMAScript Modules in HTML

by

Hacking Together Our Own import from ‘#id’ Exports/imports between inline scripts aren’t natively supported, but it was a fun exercise to hack together an implementation for my documents. Code-golfed down to a small block, I use it like this: <script type=”module” data-info=”https://stackoverflow.com/a/43834063″>let l,e,t=”script”,p=/(from\s+|import\s+)[‘”](#[\w\-]+)[‘”]/g,x=’textContent’,d=document, s,o;for(o of d.querySelectorAll(t+'[type=inline-module]’))l=d.createElement(t),o .id?l.id=o.id:0,l.type=”module”,l[x]=o[x].replace(p,(u,a,z)=>(e=d.querySelector( t+z+'[type=module][src]’))?a+`/* ${z} */’${e.src}’`:u),l.src=URL.createObjectURL (new Blob([l[x]],{type:’application/java’+t})),o.replaceWith(l)//inline</script> <script type=”inline-module” id=”utils”> … Read more

Output an ES module using webpack

by

Firstly I would like to state the difference between the commonJS and commonJS2 CommonJS doesn’t support the use of module.exports = function() {} which is used by node.js and many other commonJS implementations. Webpack2 employs the concept of the bundling the library code and for the widespread use of it and to make it compatible … Read more

What does “this” refer to in arrow functions in ES6?

by

Arrow functions capture the this value of the enclosing context function Person(){ this.age = 0; setInterval(() => { this.age++; // |this| properly refers to the person object }, 1000); } var p = new Person(); So, to directly answer your question, this inside your arrow function would have the same value as it did right … Read more