순수 함수와 불변성
부수 효과 없이 예측 가능한 함수를 작성합니다.
순수 함수와 불변성은(는) CoddyKit의 무료 TypeScript Academy 강의입니다. 이것은 4개 중 1번째 강의입니다. 아래에서 전체 강의를 무료로 읽을 수 있으며, 내장 코드 에디터와 24/7 AI 튜터와 함께 브라우저에서 직접 실습할 수 있습니다. 이 강의는 TypeScript Academy 학습 경로의 일부이며, 진행 상황이 웹과 CoddyKit 앱에 동기화됩니다. TypeScript Academy 강의에는 총 4개의 강의가 포함되어 있습니다.
순수 함수란 무엇인가요
순수 함수는 같은 입력에 대해 같은 출력을 반환하고 부작용이 없습니다. 외부 상태를 읽거나 쓰지 않고, 인수를 변경하지 않으며, 입출력을 수행하지도 않습니다.
순수 함수 예시
이 함수는 인수에만 의존하고 반환값만 생성합니다. 호출해도 함수 외부의 어떤 것도 변경되지 않습니다.
function add(a: number, b: number): number {
return a + b;
}
console.log(add(2, 3)); // 5, always비순수 함수 예시
이 함수는 범위 밖의 변수를 읽고 변경하므로 결과가 숨겨진 상태에 따라 달라지며 흔적도 남깁니다. 따라서 비순수 함수입니다.
let counter = 0;
function next(): number {
counter += 1; // side effect
return counter;
}
console.log(next(), next()); // 1 2, depends on history참조 투명성
순수 함수 호출은 참조 투명합니다. 프로그램을 변경하지 않고 호출을 그 결과로 바꿀 수 있습니다. 어디서든 add(2, 3)을 5로 바꿔 쓸 수 있습니다.
const x = add(2, 3) * 2;
const y = 5 * 2; // identical meaning
console.log(x === y); // true순수성이 도움이 되는 이유
순수 함수는 설정 없이도 테스트하기 쉽고, 캐시하기 쉬우며, 병렬로 실행해도 안전합니다. 숨은 의존성이 없기 때문에 동작을 추론하기도 쉽습니다.
인수를 변경하지 않기
입력 배열이나 객체를 변경하면 호출자가 예상하지 못한 부작용이 발생할 수 있습니다. 대신 새로운 값을 만들어 반환하십시오.
// Impure: mutates input
function pushImpure(xs: number[], v: number) { xs.push(v); return xs; }
// Pure: returns a new array
function pushPure(xs: number[], v: number): number[] { return [...xs, v]; }스프레드를 사용한 불변 업데이트
스프레드 연산자는 객체나 배열을 복사하여 원본을 건드리지 않고 필드를 덮어쓸 수 있게 합니다. 이는 TS에서 불변 업데이트에 사용하는 핵심 도구입니다.
interface User { name: string; age: number }
function birthday(u: User): User {
return { ...u, age: u.age + 1 };
}
const before = { name: "Ada", age: 30 };
const after = birthday(before);
console.log(before.age, after.age); // 30 31배열을 불변으로 업데이트하기
변경하는 대신 map, filter, 스프레드를 사용하여 새로운 배열을 만드십시오. 원본 배열은 다른 코드가 계속 사용할 수 있도록 그대로 유지됩니다.
const nums = [1, 2, 3];
const doubled = nums.map(n => n * 2);
console.log(nums, doubled); // [1,2,3] [2,4,6]안전을 위한 readonly
매개변수에 readonly를 표시하면 컴파일러와 코드를 읽는 사람에게 함수가 해당 매개변수를 변경하지 않는다는 사실을 알립니다. 이를 통해 타입 수준에서 순수성이 강화됩니다.
function sum(xs: readonly number[]): number {
return xs.reduce((a, b) => a + b, 0);
}
console.log(sum([1, 2, 3])); // 6부작용을 가장자리로 밀어내기
실제 프로그램에는 부작용이 필요합니다(로깅, 네트워크 통신 등). 함수형 스타일은 핵심을 순수하게 유지하고 부작용을 경계로 격리하므로 대부분의 코드가 예측 가능하게 됩니다.
사고를 위한 확인 목록
각 함수에 대해 다음과 같이 질문해 보십시오. 입력에만 의존합니까? 값만 반환합니까? 입력과 외부 세계를 변경하지 않습니까? 세 질문에 모두 그렇다고 답할 수 있다면 순수 함수입니다.
간단히 확인하기
이 수업을 간단히 확인합니다.
복습
순수 함수는 입력에만 의존하고 부작용을 만들지 않으므로 참조 투명성을 제공합니다. 불변 업데이트에는 스프레드, map/filter, readonly를 사용하고, 실제 세계의 부작용은 프로그램의 경계로 밀어내십시오.
자주 묻는 질문
“순수 함수와 불변성” 강의는 무료인가요?
네 — “순수 함수와 불변성” 전체 내용을 이 웹사이트에서 무료로 읽을 수 있습니다. 인터랙티브하게 실습하려면(내장 코드 에디터와 24/7 AI 튜터), CoddyKit PRO로 업그레이드하면 TypeScript Academy 강의 전체를 잠금 해제할 수 있습니다. TypeScript Academy 강의에는 총 4개의 강의가 포함되어 있습니다.
“순수 함수와 불변성”에서 뭘 배우나요?
부수 효과 없이 예측 가능한 함수를 작성합니다. 브라우저에서 직접 실행하는 실습 코드로 TypeScript Academy을(를) 배우며, 24/7 AI 튜터가 강의를 진행하면서 질문에 답변해줍니다.
TypeScript Academy을(를) 시작하는 데 경험이 필요한가요?
사전 경험은 필요하지 않습니다. CoddyKit의 TypeScript Academy은(는) 초급자부터 고급 학습자까지를 위해 구성되어 있으므로, 여기서 시작하거나 처음부터 시작할 수 있으며 자신의 속도대로 진행할 수 있습니다. 이것은 4개 중 1번째 강의입니다.
“순수 함수와 불변성” 강의는 얼마나 걸리나요?
대부분의 CoddyKit 강의는 약 5~10분이 소요됩니다. 각 강의는 간결하고 인터랙티브하여 꾸준한 진행이 가능하며, 웹과 앱에서 중단한 부분부터 바로 시작할 수 있습니다.
이 TypeScript Academy 강의에서 코드를 작성하고 실행할 수 있나요?
네. 모든 TypeScript Academy 강의에는 내장 코드 에디터가 포함되어 있으므로, 브라우저에서 바로 실제 코드를 작성하고 실행한 후 즉시 AI 피드백을 받을 수 있습니다 — 로컬 설정이 필요 없습니다.