구문 설탕, 왜, 언제, 어떻게

Syntactic Sugar라는 용어는 1964년 Peter J. Landin에 의해 만들어졌습니다. 컴퓨터 과학에서 Syntactic Sugar는 더 쉽게 읽거나 표현하도록 설계된 프로그래밍 언어 내의 구문입니다. 그것은 인간이 사용하기에 언어를 "더 달콤"하게 만듭니다. 사물을 더 명확하고 간결하게 표현하거나 일부 사람들이 선호하는 대체 스타일로 표현할 수 있습니다.

왜
네이티브 API의 영역을 보여주고 코드에 더 많은 유연성과 가독성을 제공하며 다른 사람들이 더 짧고 간결한 코드를 작성하는 새로운 방법을 찾는 데 도움이 될 수 있으며 저는 하루 종일 진행할 수 있습니다.

언제
변화가 있을 때마다!

어떻게... 가자

 // don't
 let alex = personal.alex

 // do destructuring
 let {alex} = personal

// don't if variable asignation may not vary
var isSuperHuman = superhuman ? "is super human" : "nahh"

// use const instead
const isSuperHuman = superhuman ? "is super human" : "nahh"

// arrays to avoid for loops o foreach

arr.find(i => i.id === "01") // returns the object
// with destructuring
arr.find(({id}) => id === "01") // returns the object

arr.filter(({id}) => id === "01") // returns and array of matches elements

arr.some(({id}) => id === "01") // returns boolean value

arr.every(({type}) => type === "superhumen") // returns boolean value if every nodes matched the criteria

arr.reduce((acc, {age}) => acc + age, 0) // returns a reduced value in this case the sum of all ages

// concat and push are from the pass now we spread!

const a = [...arr, newElemet]
// or to place the new element at the top of the array
const a = [newElemet, ...arr]

// mergin to arrays
const a = [...arrB, ...arrC]
// or flatted!!
const a = [arrB, arrC].flat()


// get the unique values (names) from array, lets map?
const a = ...new Set(data.map(i => i.name))
// as array?
const a = [...new Set(data.map(i => i.name))]

하지만 Alex 나는 이미 그 사람을 알고 있습니다!

// number to strings?
100.toString() // "100"
what about!
100 + "" // "100"

// strings to number?
Number("100") // 100
parseInt("100") // 100
parseFloat("100").toFixed(2) // 100.00
what about!
"100" * 1 // 100

저주의, 나도 알아!

그렇다면 내 친구 당신은 세상에서 가장 달콤한 사람이 될 수 있습니다!

함수를 선언하는 방법을 알려주십시오.

// as a declaration
function sum(a,b) {
  return a + b
}

// as expression 
const sum = function(a,b) {
  return a + b;
};

// as an arrow?
const sum = (b,c) => b + c

// as shorthand method definition?
const operation = {
  add: (a,b) => a + b
}
// or 
const operation = {
  add(a,b){return a + b}

다음 설탕에서 만나요! 당신의 정보를 알려주세요.