(JavaScript) 6. ES6+ 주요 기능 정리

1. let, const – 블록 스코프 변수 선언

• let과 const는 ES6에서 도입된 변수 선언 키워드
• var와 달리 블록 스코프(중괄호 {} 기준)를 따르며, 재선언이 불가함
• let은 값 재할당이 가능하고, const는 상수로 재할당이 불가능!
  • 이 내용은 전에 javascript 1 블로그에도 썼었음!

let count = 1;
count = 2; // 가능

const name = "보성";
// name = "유진"; // ❌ 오류: const는 재할당 불가 -> 이런식으로 한번 더 하는거 안됨!

2. 화살표 함수 – 간결한 함수 표현

• function 키워드 없이 간단하게 함수를 정의할 수 있음
• this의 바인딩 방식이 기존 함수와 다르며, 상위 스코프의 this를 그대로 사용함

const add = (a, b) => a + b;

console.log(add(3, 5)); // 8

3. 템플릿 리터럴 – 문자열 보간

• 백틱(```)을 사용해 문자열을 만들고 ${} 안에 변수를 넣어 문자열을 동적으로 생성할 수 있음

const name = "보성";
console.log(`안녕하세요, ${name}님!`);
// 출력: 안녕하세요, 보성님!

4. 객체 분해 할당 – 필요한 속성만 추출

• 객체에서 필요한 값을 한 줄로 추출할 수 있어 가독성이 좋아짐

const person = {
  name: "보성",
  age: 25,
  job: "개발자"
};

const { name, age } = person;
console.log(name); // 보성
console.log(age);  // 25

---

5. 배열 전개 연산자 – 복사 및 합치기

• ... 연산자를 사용해 배열이나 객체를 복사하거나 결합할 수 있음

const arr1 = [1, 2];
const arr2 = [3, 4];

const newArr = [...arr1, ...arr2];
console.log(newArr); // [1, 2, 3, 4]
// 전개 연산자 알아두면 나중에 여러 배열을 합칠때 편하게 사용 가능

6. map(), filter(), reduce() – 배열 고차 함수

• 배열을 처리할 때 자주 사용하는 함수들!
  • 이걸로 서버에서 받아온 데이터들 배열로 많이 처리했었음!

const numbers = [1, 2, 3, 4, 5];

// map: 각 요소를 2배로 만든 새 배열 반환
const doubled = numbers.map(n => n * 2);
// [2, 4, 6, 8, 10]

// filter: 3보다 큰 값만 필터링
const filtered = numbers.filter(n => n > 3);
// [4, 5]

// reduce: 모든 요소를 더함
const total = numbers.reduce((acc, cur) => acc + cur, 0);
// 15