본문 바로가기
728x90
300x250
SMALL

2025/0227

reduce() 기본 개념부터 활용까지 쉽게 이해하기 reduce()란?reduce()는 배열의 요소를 하나씩 순회하면서 누적된 값을 만들어내는 함수다.array.reduce((누적값(prev), 현재값(curr), 인덱스(i)) => { }, 초기값) prev : 이전까지의 누적된 값(첫 번째 실행 때는 "초기값"이 들어감)curr : 현재 순회 중이 요소i : 현재 순회중인 요소의 인덱스 (0부터 시작)초기값 : reduce()가 처음 실행될 때 prev에 들어갈 값숫자 더하기const numbers = [1, 2, 3, 4];const sum = numbers.reduce((prev, curr) => prev + curr, 0);console.log(sum); // 10 최종적으로 prev에 10이 저장돼서 반환됨 2025. 2. 28.
태그드 템플릿 리터럴 태그드 템플릿 리터럴이란?간단히 말해, 템플릿 리터럴 앞에 함수(예: myTag)를 붙여서 문자열을 가공할 수 있는 기능const name = "철수";console.log(myTag`${name}입니다.`);위 코드에서 myTag는 태그 함수이다.즉, 템플릿 리터럴을 가공할 함수를 지정하는 것이다.2. 태그드 템플릿 리터럴 동작 방식일반적인 템플릿 리터럴(`${name}입니다.`)을 쓰면, 그냥 변수가 문자열에 삽입된다.하지만 태그 함수가 붙으면, 문자열과 변수를 따로 전달받아 가공할 수 있다.function myTag(strings, ...values) { console.log(strings); // ['','입니다.'] console.log(values); // ['철수']}const name .. 2025. 2. 27.
템플릿 리터럴 심화! 태그드 vs 언태그드 차이점 태그드 탬플릿 이란?태그 함수를 사용하여 템플릿 리터럴을 커스터마이즈할 수 있다.백틱 앞에 함수 이름(태그 함수)을 붙여서 템플릿 리터럴을 처리한다.태그함수는 템플릿 리터럴을 입력받아 직접 조작하거나 결과를 반환한다.문법tagFunction`문자열 템플릿`; 예제function myTag(strings, ...values) { console.log(strings); // 문자열 배열 console.log(values); // 삽입된 값들 return "Processed Template";}const name = "Alice";const age = 30;const result = myTag`My name is ${name}, and I am ${age} years old.`;console.log(r.. 2025. 2. 26.
템플릿 리터럴의 기본! 언태그드 템플릿 리터럴이란? 우리가 일반적으로 사용하는 템플릿 리터럴이다.백틱(`) 안에 변수를 삽입하거나 표현식을 사용해 문자열을 작성한다.추가적인 처리가 필요 없으며 그대로 문자열로 평가됩니다.const name = "Alice";const age = 30;const message = `My name is ${name}, and I am ${age} years old.`;console.log(message);// 출력: My name is Alice, and I am 30 years old. 2025. 2. 25.
728x90
반응형
LIST