ES6: Difference between revisions

From Bitpost wiki
(Created page with "==== Arrow functions ==== Simple things that have no this pointer. People love them. Whatever. const myfunc = onevar => { console.log( onevar ); }; const myfunc = (...")
 
Line 1: Line 1:
==== Arrow functions ====
==== Arrow functions ====
Simple things that have no this pointer.  People love them.  Whatever.
Simplified functions that have no this pointer.
  const myfunc = onevar => {
  const myfunc = onevar => {
     console.log( onevar );
     console.log( onevar );

Revision as of 13:32, 20 September 2020

Arrow functions

Simplified functions that have no this pointer.

const myfunc = onevar => {
   console.log( onevar );
};

const myfunc = ( v1, v2 ) => {
   console.log( `v1 = ${v1}, v2 = ${v2}` );
};

// One liners are simple, no curly braces or return statement needed:
const doubleIt = onevar => onevar * 2;

Destructuring

  • Destructure internal variables with curly braces on left side:
const { internalprop1, prop2 } = myobj;
  • Arrow + destructure:
const myFuncThatTakesOneObjectParam = ({ id, name, desc }) => {
  console.log( id, name, desc );
};
myFunc( { id: 2, name: 'internal name', desc: 'My desc' } );
  • Deeper destructure:
const nameChange = ({ target: { value }}) => setName( value );