JavaScript – ES6 Cheat Sheet

0 Komentar
JavaScript – ES6 Cheat Sheet

Sedikit catatan dari contoh penggunaan sehari-hari code javascript dengan standard ES6,

Arrow Function

const sum = (a,b) => a + b;
console.log(sum(2,6)) // prints 8

Default Parameters

function print(a = 5) {
   console.log(a)
}

print() // prints 5
print(22) // prints 22

Let Scope

let a = 3
if (true) {
  let a = 5
  console.log(a) // prints 5
}
console.log(a) // prints 3

Const

// can be assigned only once
const a = 55
a = 44 // throws an error

Multi-line String

console.log(
  `This is a
  multi-line string`
)

Template String

const names = "World"
const message = `Hello ${names}`
console.log(message)

// prints "Hello World"

Exponent Operator

const byte = 2 ** 8

// expected result = 256

// Same as: Math.pow(2, 8)

Spread Operator

Ini sama dengan array_merge($arr1,$arr2) pada php

const a = [ 1, 2 ]
const b = [ 3, 4 ]
const c = [ ...a, ...b ]

console.log(c) 

// [1, 2, 3, 4]

String Includes()

console.log('Dankdev'.includes('s'))

// prints true

console.log('Dankdev'.includes('m'))

// prints false



// includes() method ini case sensitive, contohnya 
console.log('Dankdev'.includes('E'))

// prints false

console.log('Dankdev'.includes('D'))
// prints true

String startsWith()

console.log('Dankedev'.includes('Da'))

// prints true

console.log('Dankedev'.includes('an'))

// prints false

String repeat()

console.log('ha'.repeat(3))

// prints "hahaha"

Destructuring array

let [a,b] = [3,7];

console.log(a); // 3
console.log(b); // 7

Destructuring object

let obj = {
  a: 77,
  b: 66
};

let { a,b } = obj;

console.log(a); // 77
console.log(b); // 66

Object Property Assignment

const a = 2
const b = 5

const obj = { a, b }

// Before es6:
// obj = { a: a, b:b }

console.log(obj)

// prints { a:2, b:5 }

Object.assign()

const obj1 = { a: 1 }
const obj2 = { b: 2 }

const obj3 = Object.assign({},
      obj1, obj2)

console.log(obj3)
// { a: 1, b: 2 }

Promises with finally

Promise

 .then((result) => { ... })
 .catch((error) => { ... })
 .finally(() => { /* logic independent of success/error */ })

 /* The handler is called when the promise is fulfilled or rejected. */

//biasa dipakai saat menggunakan async dan await pada saat kita melakukan request dengan fetch atau ketika menggunakan axios

Spread Operator

const a = {
  firstName: "Hadie",
  lastName: "Danker",
}

const b = {
   ...a,
  lastName: "Abu Arsy",
  canSing: true,
}

console.log(a)

//{firstName: "Haddide", lastName: "Danker"}


console.log(b)

/* {firstName: "Hadie", lastName: "Abu Arsy",
   canSign: true} */

// cara ampuh untuk memodifikasi object tanpa harus mempengaruhi object aslinya

Destructuring Nested objects

const Person = {
  name: "Hadie Danker",
  age: 17, // :)
  sex: "male",
  maritalstatus: "single",
  address: {
  country: "ID",
  state: "South Sumatrea",
  city: "OKU",
  pincode: "123456",
 },
};

const { address: { state, pincode }, name } = Person;

console.log(name, state, pincode)

// Hadie Danker South Sumatera 123456

console.log(city) // ReferenceError

Object function assignment

const obj = {
  a: 5,
  b() {
  
 console.log('b')

 }
}

obj.b() // prints "b"

Object.entries()

Looping object as array entries

const obj = {
  firstName: "Hadie",
  lastName: "anker",
  age: 17,
  country: "Indonesia",
};

const entries = Object.entries(obj);

console.log(entries)

/* prints [

   ['firstName', 'Hadie'],
   ['lastName', 'Danker'],
   ['age', 23],
   ['country', 'Indonesia']

  ];

*/

Object.keys()

const obj = {
  firstName: "Hadie",
  lastName: "Danker",
  age: 17,
  country: "Indonesia",
};

const keys = Object.keys(obj);

console.log(keys);

/* prints [
'firstName',
'lastName',
'age',
'country'
  ];

*/

Sorting Array

// Sorting Ascending
const arr = [40, 100, 1, 5, 25, 10];
arr.sort((a,b) => a - b)

console.log(arr)
/*
[
    100,
    40,
    25,
    10,
    5,
    1
]
*/


// Sorting Descending
arr.sort((a,b) => b - a)

Sorting Multidimensional Array

	const Categories = [
		{
			id:10,
			name:'PHP'
		},
		{
			id:5,
			name:'JavaScript'
		},
		{
			id:30,
			name:'Go'
		},
	]
	
	// Sorting Ascending
	Categories.sort( (a,b) => a.id - b.id);
	
	console.log(Categories);
	
	
	//Sorting Descending

	Categories.sort( (a,b) => b.id - a.id);

	console.log(Categories);

Demikian catatan singkat tentang cheatset code javascript dengan standard es6 yang biasa saya gunakan. Semoga bermanfaat.

Weekly email summary

Subscribe below and we’ll send you a weekly email summary of all new Code tutorials. Never miss out on learning about the next big thing.

Berikan Komentar
Email anda tidak akan ditampilkan. Field yang wajib diisi ditandai dengan *
*