Last active
October 4, 2018 13:35
-
-
Save VishwasShashidhar/b33e87ab98a273f73d63e5a15d9d6b5d to your computer and use it in GitHub Desktop.
ES6, ES7, ES8 Features
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// This is sourced from the video -> https://www.youtube.com/watch?v=nZ1DMMsyVyI&t=2s | |
// Template Literals | |
const firstName = 'John'; | |
const lastName = 'Doe'; | |
console.log(`Hello: ${firstName} ${lastName}`); // Hello: John Doe | |
// Object Destructuring | |
const person = { | |
name: 'Jon', | |
age: 30, | |
house: 'Stark', | |
strength: 'Leader' | |
}; | |
let {name, age} = person; | |
console.log(`${name} is ${age} years old!`); // Jon is 30 years old | |
// Array Destructuring | |
let [stark, targareyan, lannister] = ['Jon', 'Dany', 'Tyrion', 'Arya']; | |
console.log(stark); // Jon | |
console.log(lannister); // Tyrion | |
stark = 'Ned'; // You can update the index of the array like this! | |
console.log(stark); // Ned | |
// Object Literals | |
function kingMaker(house, name) { | |
const supporter = {house, name}; // You don't need to write the key part, by default, it is assigned to the same key name | |
console.log(`${name} of house ${house} is a king maker!`); | |
} | |
kingMaker('Mormont', 'Lyanna'); | |
// for-of loop | |
let prices = [20, 30, 40, 50, 60]; | |
let total = 0; | |
for (const price of prices) { | |
console.log(price); | |
total += price; | |
} | |
console.log(total); | |
let kingdoms = "Starks"; | |
// Iterable - Maps, sets, arrays etc. | |
for (const char of kingdoms) { | |
console.log(char); | |
} | |
// Spread operator | |
let direwolves = ['Nymeria', 'Ghost']; | |
let wolves = [...direwolves]; | |
wolves.push('Lady'); | |
console.log(wolves); | |
let direwolvesObj = { | |
name: 'Nymeria' | |
}; | |
let wolvesObj = { | |
...direwolvesObj | |
}; | |
console.log(wolvesObj); | |
// Rest operator | |
function battle(...kings) { | |
console.log(kings); | |
} | |
battle('Jon', 'Ramsay'); | |
// Arrow Functions | |
let nums = [1, 2, 3]; | |
let sum = nums.reduce((x, y) => x + y); | |
console.log(sum); | |
// Default parameters | |
function add(numArray = []) { | |
let total = 0; | |
numArray.forEach((element) => { | |
total += element; | |
}); | |
console.log(total); | |
} | |
add(); | |
add([1, 2, 3]); | |
// Includes function | |
let numbers = [1, 2, 3]; | |
console.log(numbers.includes(2)); | |
console.log(numbers.includes(5)); | |
// Pad start and pad end methods | |
let example = 'Jon'; | |
console.log(example.padStart(10, 'J')); | |
console.log(example.padEnd(5, 'n')); | |
// Classes | |
class Animal { | |
constructor(type, legs) { | |
this.type = type; | |
this.legs = legs; | |
} | |
sayHello() { | |
console.log(`Hi, I'm a ${this.type} and I have ${this.legs} legs`); | |
} | |
static sayHi() { | |
console.log("Hello there!"); | |
} | |
// getters | |
get metaData() { | |
return `Type: ${this.type}, Legs: ${this.legs}`; | |
} | |
} | |
let cat = new Animal('cat', 4); | |
cat.sayHello(); | |
console.log(cat.metaData); // metadata is now a property on our object | |
// static function | |
Animal.sayHi(); | |
// Inheritance | |
class Mammal extends Animal { | |
constructor(type, legs, vegetarian) { | |
super(type, legs); | |
this.vegetarian = vegetarian; | |
} | |
sayHello() { | |
console.log(`Hi, I'm a ${this.type} and I have ${this.legs} legs. And, I'm a vegetarian? ${this.vegetarian}`); | |
} | |
} | |
let mam = new Mammal('cow', 4, true); | |
mam.sayHello(); | |
console.log(mam.metaData); | |
// Async and await | |
const apiUrl = 'https://jsonplaceholder.typicode.com/todos/1'; | |
const fetch = require("node-fetch"); | |
const getTodos = async () => { | |
let res = await fetch(apiUrl); | |
let json = await res.json(); | |
console.log(json); | |
}; | |
getTodos(); | |
// Sets | |
const exampleSet = new Set(['a', 'a', 'b', 'c', 'd', 'd']); | |
exampleSet.add('e'); | |
exampleSet.add('a'); | |
exampleSet.delete('c'); | |
console.log(exampleSet); | |
console.log(exampleSet.has('a')); | |
console.log(exampleSet.has('c')); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment