Javascript & ES6

Design Section 9 Crash Course Basics

WHAT DO YOU NEED?

Functions = Arrows

function print(a) {
    console.log(a);
}

function add (x, y) {
    return x + 1;
}


setTimeout(function() {
    console.log("timeout");
}, 1000);

var b = [1, 2, 3];
var c = b.map(function(item) {
    return item + 1;
})

function add (x, y) {
    if (x === undefined || x === null) x = 2;
    if (y === undefined || y === null) y = 5;
    return x + y; 
}

const print = (a) => {
    console.log(a);
}

const add = (x, y) => {
    return x + y;
}

// OR

const add = (x, y) => (x + y);

setTimeout(() => {
    console.log("timeout")
}, 1000);

const b = [1, 2, 3];
const c = b.map((item) => (item + 1));

const add (x = 2, y = 3) => (x + y);

Template strings

var x = 18;
var y = 'Jet';

var z = y + 'is ' + x + ' years old';

var a = 'this is a multiline ' +
        'string that is readable on code ' +
        'but is not a multiline string ' +
        'on print';

const x = 18;
const y = 'Jet';

const z = `${y} is ${x} years old`;

const a = `this is a multiline
          string that is readable on code
          but is also a multiline string 
          on print`;

Const and let

var x = 18;
var y = 'Jet';
var z = {
    a: 1
};

x = 19;   // possible
y = 'TJ'; // possible
z = 1;    // possible
z.a = 2;  // possible

const x = 18;
let y = 'Jet';
const z = {
    a: 1
}

x = 19;   // not possible
y = 'TJ'; // possible
z = 1;    // not possible
z.a = 2;  // possible

destructuring

var x = [1,2,3];
var a = x[0];
var b = x[3];

var y = {
    c: 4,
    d: 5,
    e: 6
};

var c = y.c;
var d = y.d;
var z = y.e;

const [a, ,b] = [1,2,3];

const y = {
    c: 4,
    d: 5,
    e: 6
};

const {c, d, e: z} = y;

Module import and export

// file.js
module.exports = {
    one: 1,
    add: function (x, y) {
        return x + y;
    }
}

// another.js
var x = require('./another.js');
var _ = require('underscore');

console.log(x.one);
console.log(x.add(1, 3));

// file.js

export default {
    one: 1,
    add: (x, y) => (x+y)
}

// another.js

import x from './another.js';
import _ from 'underscore';

console.log(x.one);
console.log(x.add(1, 3));

Module import and export

// file.js
module.exports = {
    one: 1,
    add: function (x, y) {
        return x + y;
    }
}

// another.js
var x = require('./another.js');
var _ = require('underscore');

console.log(x.one);
console.log(x.add(1, 3));

// file.js

export const one = 1;
export const add = (x, y) => (x + y)

// another.js

import {one, add} from './another.js';
import _ from 'underscore';

console.log(one);
console.log(add(1, 3));