ES6

  • const, let, var
  • arrow function
  • deconstruct
  • template string
  • import, export
  • class

Why ES6?

  • They are nice things missing from Javascript older version
  • Whatever written in ES6, works in Typescript

Arrow function

const plus = (x) => x + 1;
  • simplified
  • one line no return

Deconstruct

// deconstruct variables
const team = {
  andy: 'Andy',
  bob: 'Bob'
}

const showNames = ({andy, bob}) => {
  console.log(andy);
  console.log(bob);
}

showNames(team)

// deconstruct array
const teamList = ['Andy', 'Bob', 'Chris'];
let [andy, bob] = teamList;

console.log(andy);
console.log(bob);
console.log(...teamList)

// construct object
let teamObj = {andy, bob}
console.log(teamObj)

Import export

  • non-default export
  • default export

Non-default

// file1.js
export const andy = 'Andy';
export const bob = 'Bob';

// file2.js
import {andy, bob} from './file1.js';
console.log(andy);

Default

// file1.js
export default const andy = 'Andy';

// file2.js
import andy from './file1.js';
console.log(andy);

Class

// ES6 - new but no private. However, Typescript can have private and the code looks very similar to this
class Person {
  name = 'Andy'; // public, no concept of private

  setName( name ) {
    this.name = name;
  }

  getName() {
    return this.name;
  }
}

// Old but better
function Person(){
  var self = this; // private
  self.name = 'Andy';  // public

  this.setName = function(name){
    self.name = name;
  }

  this.getName = function(){
    return self.name;
  }
}

Videos for in depth explanation:

part1 - https://www.youtube.com/watch?v=AfWYO8t7ed4

part2 - https://www.youtube.com/watch?v=LmL0Gh193M0

results matching ""

    No results matching ""