핵심 내용

1. 각종 ES6 문법
2. 일급 객체로서의 함수
3. Map, Set

오늘 알게 된 내용

1. ES6 문법
   (1) let, const

• 1. let : 재할당 O, 재선언 X

  let a= 1
  console.log(a) // 1
  
  a = 2 // 재할당 가능
  console.log(a) // 2
  
  let a = 3 
  // 재선언 불가능
  // SyntaxError: Identifier 'value' has already been declared

• 2. const : 재할당 X, 재선언 X, 초기값 없으면 선언 불가능

  const a
  // 초기값 없이 선언 불가능
  // SyntaxError: Missing initializer in const declaration
  ---
  const a = 1
  console.log(a) // a1
  
  a = 2 
  // 재할당 불가능
  // TypeError: Assignment to constant variable.
  
  const a = 2 
  // 재선언 불가능
  // SyntaxError: Identifier 'value' has already been declared

(2) 화살표 함수 : function이나 return 키워드 없이 함수를 만드는 방버, 많은 개발자들이 키워드를 입력하는 것조차 귀찮아서 화살표 함수를 만들었다고 예전에 python 강의 들을 때 들어본 바 있음. 추가적으로 function은 호출할 때 this가 정해지지만, 화살표 함수는 선언할 때 this가 정해짐

//ES6
const func = () => true // return문이 한 줄일 땐 return 키워드도 생략가능
const func = () => {
	return true // 단 두 줄 이상일 땐 {} 안에 작성해야함
}

() => {}
parm => {}
(parm1, parm2, ...parms) -> {}

// 익명 화살표 함수
() => {}

(3) 삼항 연산자 : 항이 3개라 삼항 연산자

condition ? expr1 : expr2

console.log(true ? "참" : "거짓") // 참
console.log(false ? "참" : "거짓") // 거짓

// 기본 구조 => condition ? true인경우 : false인경우

(4) 구조 분해 할당 : 배열이나 객체의 값을 추출하여 변수에 할당하는 방법. 코드를 간결하게 작성 가능하고, 데이터를 효율적으로 관리하는데 유용함.

• 1. 배열 구조분해 할당: 배열에서 원하는 값을 추출하여 변수에 할당하는 방법. 대괄호[]를 사용하여 할당하려는 변수를 정의하고, 할당하려는 배열을 대상으로 함

  const numbers = [1, 2, 3]
  const [a, b, c] = numbers
  
  console.log(a) // 1
  console.log(b) // 2
  console.log(c) // 3
  

• 2. 객체 구조분해 할당: 객체에서 특정 속성 값을 추출하여 변수에 할당하는 방법. 중괄호{}를 사용하여 할당하려는 변수를 정의하고, 할당하려는 객체를 대상으로 함

  const person = { name: 'John', age: 30 }
  const { name, age } = person
  
  console.log(name) // 'John'
  console.log(age) // 30
  

(5) 단축 속성명 : 객체 리터럴에서 객체 속성을 정의할 때 키(key)와 값(value)을 간결하게 표현할 수 있는 문법. 변수의 이름과 동일한 속성명을 사용하고 속성 값을 할당할 때 변수의 값을 자동으로 사용할 수 있음

const name = 'John';
const age = 30;

// 객체 리터럴 문법
const person = {
  name: name,
  age: age
};

// 단축 속성명
const person = {
  name,
  age
};
// 변수 이름과 동일한 속성명을 사용하고 해당 변수의 값이 자동으로 할당됨

(6) 전개 구문 : 배열이나 객체의 내용을 새로운 배열이나 객체로 확장할 때 사용. 기존 배열이나 객체를 복제하거나 합치는 등의 작업을 수 있음

• 1. 배열 전개 구문: 배열의 요소를 새로운 배열에 복사하고 확장할 때 사용. 기존 배열의 내용을 변경하지 않고 새로운 배열을 생성

  const arr1 = [1, 2, 3];
  const arr2 = [...arr1, 4, 5];
  
  console.log(arr2); // [1, 2, 3, 4, 5]

• 2. 객체 전개 구문 : 객체의 속성을 새로운 객체로 복사하고 확장할 때 사용. 기존 객체의 내용을 변경하지 않고 새로운 객체를 생성

  const obj1 = { a: 1, b: 2 };
  const obj2 = { ...obj1, c: 3, d: 4 };
  console.log(obj2); // { a: 1, b: 2, c: 3, d: 4 }

(7) 나머지 매개변수 : ... (스프레드 연산자) 뒤에 오는 변수 이름으로 정의되며, 해당 변수에는 함수에 전달되는 나머지 모든 인수가 배열로 수집. 나머지 매개변수(...args)를 사용할 때, 매개변수로 전달된 값 중에서 ...args 이후의 값들만을 배열로 수집함

function func (a, b, ...args) {
	console.log(...args)
}

func(1, 2, 3) // 3
func(1, 2, 3, 4, 5, 6, 7) // 3 4 5 6 7

(8) 템플릿 리터럴 : 문자열을 생성하는 새로운 방법을 제공하는 문자열 리터럴의 형태. 문자열 내에서 변수나 표현식을 쉽게 삽입할 수 있음. 가독성이 높고 다양한 문자열 처리 기능을 제공함. 백틱(backtick) 문자인 `` 를 사용하여 정의함

• 1. 변수 삽입

  const name = "John"
  const age = 30
  
  const greeting = `안녕하세요, 저는 ${name}이고 나이는 ${age}세입니다.`
  // 안녕하세요, 저는 John이고 나이는 30세입니다.

• 2. 멀티라인 문자열

  const multiLineText = `
  여러 줄에 걸쳐
  문자열을 작성할 수 있습니다.
   `

• 3. 문자열 표현식

  const a = 5
  const b = 10
  
  const result = `a와 b의 합은 ${a + b}입니다.`

(9) Named Export vs Default Export

2. 일급 객체로서의 함수
   (1) 변수에 함수를 할당
   (2) 함수를 인자로 다른 함수에 전달
   (3) 함수를 반환
   (4) 객체의 프로퍼티로 함수를 할당
   (5) 배열의 요소로 함수를 할당

3. Map, Set
   (1) Map
   (2) Set

오늘 어떤 문제가 있었는지

어떻게 해결했고, 무엇을 시도했는지