johnborges

run().
  catch(function handleError(err) {
    err.message; // Oops!
  }).
  // Handle any errors in `handleError()`. If the error handler
  // throws an error, kill the process.
  catch(err => { process.nextTick(() => { throw err; }) });

async function run() {
  await Promise.reject(new Error('Oops!'));

johnborges

const Animal = ({ id, name, legCount, isFriendly }) => {
  const url = `url/animal/${id}`
  const legCountStr = toString(legCount) || '?'
  const friendliness = { true: 'Friendly', false: 'Unfriendly' }[isFriendly]
  const hasNotEnoughData = legCount === undefined && isFriendly === undefined

  return (
    <li>
      <a href={url}>{name}</a> - {legCountStr} legs
      {friendliness && ` - ${friendliness}`}

johnborges

10 React Component Commandments

1. Document the Usage If you don't document how your component is supposed to be used, it's by definition useless.

2. Allow for contextual semantics Allow your components to accept an as prop, which will consistently let you override what DOM element is being rendered.

function Grid({ as: Element, ...props }) {
 return 

johnborges

const js = `console.log('Hello everyone!');`;
const encodedJs = encodeURIComponent(js);
const dataUri = 'data:text/javascript;charset=utf-8,'
  + encodedJs;
import(dataUri);

// Output:
// 'Hello everyone!'

johnborges

// skip items
let [a , , b] = [1, 2, 3];

// quick swap variables
let a = 1;
let b = 3;

[a, b] = [b, a];

// assignment without declaration

johnborges

/* Default span styling - hidden on desktop */
table td span {
    background: #eee;
    color: dimgrey;
    display: none;
    font-size: 10px;
    font-weight: bold;
    padding: 5px;
    position: absolute;
    text-transform: uppercase;

johnborges

// simplified createStore function
const createStore = (reducer) => {
  let listeners = [];
  let currentState = reducer(undefined, {});
  return {
    getState: () => currentState,
    dispatch: (action) => {
      currentState = reducer(currentState, action);
      listeners.forEach((listener) => {
        listener();

johnborges

Because the JSON grammar is much simpler than JavaScript’s grammar, JSON can be parsed more efficiently than JavaScript. This knowledge can be applied to improve start-up performance for web apps that ship large JSON-like configuration object literals (such as inline Redux stores).

const data = { foo: 42, bar: 1337 }; // 🐌
const data = JSON.parse('{"foo":42,"bar":1337}'); // 🚀

johnborges

coming soon

johnborges

1. Constructor

// This creates a new empty Object
var newObject = {};

// This creates a new empty Object
var newObject = Object.create(Object.prototype);

var newObject = new Object();