JavaScript 변수와 데이터 타입 | let, const, var 완벽 정리
이 글의 핵심
JavaScript 변수와 데이터 타입: let, const, var let, const, var·스코프 (Scope).
시리즈 안내
들어가며
변수란?
변수(Variable)는 데이터를 담는 상자와 같습니다. JavaScript는 동적 타입 언어(실행할 때 값에 따라 타입이 정해지는 방식)이므로, 값의 종류는 실행 시점에 정해집니다. 아래에서 다루는 호이스팅(선언이 마치 코드 맨 위로 끌어올려진 것처럼 처리되는 동작)은, 코드가 위에서 아래로만 읽힌다고 생각하기 쉽지만 실제로는 선언이 먼저 정리된 뒤 실행이 이어집니다. 엘리베이터가 먼저 층·호실을 인식한 뒤에 문이 열리듯, 선언이 스코프 상단으로 올라간 뒤에 할당과 실행이 이어진다고 이해하시면 됩니다.
실전 경험에서 배운 교훈
이 기술을 실무 프로젝트에 처음 도입했을 때, 공식 문서만으로는 알 수 없었던 많은 함정들이 있었습니다. 특히 프로덕션 환경에서 발생하는 엣지 케이스들은 로컬 개발 환경에서는 재현조차 되지 않았죠.
가장 어려웠던 점은 성능 최적화였습니다. 처음엔 “동작만 하면 되겠지”라고 생각했지만, 실제 사용자 트래픽이 몰리면서 병목 지점들이 하나씩 드러났습니다. 특히 데이터베이스 쿼리 최적화, 캐싱 전략, 에러 핸들링 구조 등은 여러 번의 장애를 겪으면서 개선해 나갔습니다.
이 글에서는 그런 시행착오를 통해 얻은 실전 노하우와, “이렇게 하면 안 된다”는 교훈들을 함께 정리했습니다. 특히 트러블슈팅 섹션은 실제 장애 대응 경험을 바탕으로 작성했으니, 비슷한 문제를 마주했을 때 참고하시면 도움이 될 것입니다.
1. 변수 선언: let, const, var
let: 재할당 가능
let age = 25;
console.log(age); // 25
age = 26; // 재할당 가능
console.log(age); // 26
// 선언만 하고 나중에 할당
let name;
console.log(name); // undefined
name = "홍길동";
console.log(name); // 홍길동const: 재할당 불가
const는 상수를 선언하며, 재할당이 불가능합니다:
const PI = 3.14159;
console.log(PI); // 3.14159
// 재할당 시도 시 에러
// PI = 3.14; // TypeError: Assignment to constant variable
// const로 선언된 변수는 다른 값으로 재할당 불가
// 선언과 동시에 초기화 필수
// const x; // SyntaxError: Missing initializer in const declaration
// const는 선언만 하고 나중에 할당할 수 없음
// 중요: 객체/배열의 내부는 변경 가능
const person = { name: "홍길동", age: 25 };
// person 변수 자체는 재할당 불가
// 하지만 객체의 프로퍼티는 변경 가능
person.age = 26; // ✅ OK (객체 내부 변경)
console.log(person); // { name: '홍길동', age: 26 }
// person = {}; // ❌ TypeError (재할당 불가)
// person 변수가 다른 객체를 가리키도록 할 수 없음
const arr = [1, 2, 3];
// arr 변수 자체는 재할당 불가
// 하지만 배열의 요소는 변경 가능
arr.push(4); // ✅ OK (배열 내부 변경)
console.log(arr); // [1, 2, 3, 4]
arr[0] = 10; // ✅ OK (요소 수정)
console.log(arr); // [10, 2, 3, 4]
// arr = []; // ❌ TypeError (재할당 불가)
// arr 변수가 다른 배열을 가리키도록 할 수 없음const의 의미:
// const는 "변수가 가리키는 참조"를 고정
// 참조 대상의 내용은 변경 가능
const obj = { x: 1 };
// obj는 특정 객체의 메모리 주소를 가리킴
obj.x = 2; // ✅ 객체 내용 변경 (주소는 그대로)
// obj = { x: 2 }; // ❌ 다른 객체로 교체 (주소 변경 시도)완전한 불변 객체 만들기:
// Object.freeze(): 객체를 완전히 동결
const person = Object.freeze({ name: "홍길동", age: 25 });
// person.age = 26; // 무시됨 (strict mode에서는 에러)
console.log(person.age); // 25 (변경 안 됨)
// 중첩 객체는 별도로 freeze 필요
const user = Object.freeze({
name: "홍길동",
address: { city: "서울" } // 이 객체는 freeze 안 됨
});
user.address.city = "부산"; // ✅ 변경됨
console.log(user.address.city); // 부산var: 구식 (사용 권장 안 함)
var x = 10;
var x = 20; // 재선언 가능 (문제!)
console.log(x); // 20
// 함수 스코프 (블록 스코프 무시)
if (true) {
var y = 30;
}
console.log(y); // 30 (블록 밖에서도 접근 가능!)
// 호이스팅 문제
console.log(z); // undefined (에러 아님!)
var z = 40;let vs const vs var 비교
| 특징 | let | const | var |
|---|---|---|---|
| 재할당 | ✅ | ❌ | ✅ |
| 재선언 | ❌ | ❌ | ✅ |
| 스코프 | 블록 | 블록 | 함수 |
| 호이스팅 | TDZ | TDZ | undefined |
| 권장 | ✅ | ✅ | ❌ |
| TDZ (Temporal Dead Zone): 선언 전에 접근하면 에러 |
// let/const: TDZ
// console.log(x); // ReferenceError
let x = 10;
// var: 호이스팅
console.log(y); // undefined (에러 아님)
var y = 20;2. 스코프 (Scope)
블록 스코프
let과 const는 블록 스코프를 가집니다:
// 블록 스코프: 중괄호 {} 내부에서만 유효
{
let x = 10;
const y = 20;
console.log(x, y); // 10 20
// 이 블록 안에서만 x, y 사용 가능
}
// 블록 밖에서는 접근 불가
// console.log(x); // ReferenceError: x is not defined
// console.log(y); // ReferenceError: y is not defined
// x, y는 블록이 끝나면 소멸
// if 블록 스코프
if (true) {
let z = 30;
console.log(z); // 30
// z는 이 if 블록 안에서만 유효
}
// console.log(z); // ReferenceError
// if 블록이 끝나면 z는 접근 불가
// for 블록 스코프
for (let i = 0; i < 3; i++) {
// i는 이 for 루프 안에서만 유효
console.log(i); // 0 1 2
}
// console.log(i); // ReferenceError
// 루프가 끝나면 i는 소멸
// 중첩 블록 스코프
{
let x = 10;
{
let x = 20; // 새로운 x (외부 x와 다름)
console.log(x); // 20 (내부 x)
}
console.log(x); // 10 (외부 x)
}
// 실전 예시: 루프에서 클로저 사용
for (let i = 0; i < 3; i++) {
// let은 각 반복마다 새로운 i 생성
setTimeout(() => {
console.log(i); // 0 1 2 (각각 다른 i)
}, 100);
}
// var를 사용하면?
for (var j = 0; j < 3; j++) {
// var는 함수 스코프 (같은 j 공유)
setTimeout(() => {
console.log(j); // 3 3 3 (모두 같은 j)
}, 100);
}블록 스코프의 장점:
- 변수 충돌 방지: 블록마다 독립적인 변수
- 메모리 효율: 블록이 끝나면 자동 해제
- 예측 가능: 변수의 생명주기가 명확
- 클로저 안전: 각 반복마다 새로운 변수
함수 스코프
// 함수 정의 및 구현
function test() {
let x = 10; // 함수 스코프
var y = 20; // 함수 스코프
if (true) {
let x = 30; // 블록 스코프 (새 변수)
var y = 40; // 함수 스코프 (같은 변수)
console.log(x, y); // 30 40
}
console.log(x, y); // 10 40
}
test();
// console.log(x); // ReferenceError전역 스코프
// 전역 변수
let globalVar = "전역";
function test() {
console.log(globalVar); // 전역 접근 가능
}
test(); // 전역
// 브라우저: window 객체
// var global = "test";
// console.log(window.global); // test
// Node.js: global 객체
// global.myVar = "test";3. 데이터 타입
원시 타입 (Primitive Types)
JavaScript에는 7가지 원시 타입이 있습니다.
1. Number (숫자)
let integer = 42;
let float = 3.14;
let negative = -10;
// 특수 값
let inf = Infinity;
let negInf = -Infinity;
let notANumber = NaN;
console.log(10 / 0); // Infinity
console.log("abc" / 2); // NaN
// NaN 체크
console.log(isNaN(NaN)); // true
console.log(isNaN(10)); // false
// 안전한 정수 범위
console.log(Number.MAX_SAFE_INTEGER); // 9007199254740991
console.log(Number.MIN_SAFE_INTEGER); // -90071992547409912. String (문자열)
let str1 = "작은따옴표";
let str2 = '큰따옴표';
let str3 = `백틱 (템플릿 리터럴)`;
// 템플릿 리터럴
let name = "홍길동";
let age = 25;
let message = `안녕하세요, ${name}님! ${age}살이시군요.`;
console.log(message); // 안녕하세요, 홍길동님! 25살이시군요.
// 여러 줄 문자열
let multiline = `첫 번째 줄
두 번째 줄
세 번째 줄`;
// 이스케이프 문자
let escaped = "He said \"Hello\"";
console.log(escaped); // He said "Hello"3. Boolean (불리언)
let isTrue = true;
let isFalse = false;
// 비교 연산
console.log(10 > 5); // true
console.log(10 === 5); // false4. undefined
let x;
console.log(x); // undefined
console.log(typeof x); // undefined
// 함수 반환값 없을 때
function test() {
// return 없음
}
console.log(test()); // undefined5. null
let empty = null;
console.log(empty); // null
console.log(typeof empty); // object (JavaScript 버그!)
// undefined vs null
let x; // undefined (선언만)
let y = null; // null (명시적 빈 값)6. Symbol (ES6+)
let sym1 = Symbol("description");
let sym2 = Symbol("description");
console.log(sym1 === sym2); // false (항상 고유)
// 객체 프로퍼티 키로 사용
let obj = {
[sym1]: "value1"
};
console.log(obj[sym1]); // value17. BigInt (ES2020+)
// Number의 안전 범위를 넘는 큰 정수
let bigNum = 9007199254740991n; // n 접미사
let bigNum2 = BigInt("9007199254740991");
console.log(bigNum + 1n); // 9007199254740992n
// Number와 혼용 불가
// console.log(bigNum + 1); // TypeError
console.log(bigNum + BigInt(1)); // OK참조 타입 (Reference Types)
Object (객체)
let person = {
name: "홍길동",
age: 25,
greet: function() {
console.log(`안녕하세요, ${this.name}입니다.`);
}
};
console.log(person.name); // 홍길동
person.greet(); // 안녕하세요, 홍길동입니다.Array (배열)
let numbers = [1, 2, 3, 4, 5];
let mixed = [1, "hello", true, null, { name: "홍길동" }];
console.log(numbers[0]); // 1
console.log(numbers.length); // 5Function (함수)
function add(a, b) {
return a + b;
}
// 함수도 객체
console.log(typeof add); // function4. 타입 확인과 변환
typeof 연산자
console.log(typeof 42); // number
console.log(typeof "hello"); // string
console.log(typeof true); // boolean
console.log(typeof undefined); // undefined
console.log(typeof null); // object (버그!)
console.log(typeof {}); // object
console.log(typeof []); // object (배열도 객체)
console.log(typeof function(){}); // function
// 배열 체크
console.log(Array.isArray([])); // true
console.log(Array.isArray({})); // false타입 변환
문자열 변환
// 명시적 변환
let num = 42;
let str = String(num);
console.log(str, typeof str); // 42 string
// toString()
let str2 = num.toString();
console.log(str2); // 42
// 암묵적 변환
let result = 42 + " apples";
console.log(result); // 42 apples (문자열)숫자 변환
// 명시적 변환
let str = "42";
let num = Number(str);
console.log(num, typeof num); // 42 number
// parseInt, parseFloat
console.log(parseInt("42px")); // 42
console.log(parseFloat("3.14abc")); // 3.14
console.log(parseInt("abc")); // NaN
// 암묵적 변환
console.log("42" - 10); // 32 (숫자)
console.log("42" * 2); // 84 (숫자)
console.log(+"42"); // 42 (단항 + 연산자)불리언 변환
// 명시적 변환
console.log(Boolean(1)); // true
console.log(Boolean(0)); // false
console.log(Boolean("hello")); // true
console.log(Boolean("")); // false
// Falsy 값 (false로 변환)
console.log(Boolean(false)); // false
console.log(Boolean(0)); // false
console.log(Boolean("")); // false
console.log(Boolean(null)); // false
console.log(Boolean(undefined)); // false
console.log(Boolean(NaN)); // false
// Truthy 값 (true로 변환)
console.log(Boolean(1)); // true
console.log(Boolean("hello")); // true
console.log(Boolean([])); // true
console.log(Boolean({})); // true
// 암묵적 변환
if ("hello") {
console.log("Truthy!"); // 실행됨
}5. 호이스팅 (Hoisting)
호이스팅이란?
호이스팅(Hoisting)은 변수와 함수 선언이 스코프 안에서 맨 위로 끌어올려지는 것처럼 동작하는 현상입니다. 엔진이 실행 전에 이름표를 붙이는 단계를 거친다고 보시면 됩니다.
비유(엘리베이터): 층마다 호실이 정해지기 전에 엘리베이터가 먼저 어느 층에 어떤 호실이 있는지 인식하는 것과 비슷합니다. var는 문이 열리기 전에도 호실 번호는 잡혀 있지만 안은 비어(undefined) 있고, let/const는 문이 열리기 전에는 임시 사각지대(TDZ) 때문에 들어갈 수 없습니다.
var 호이스팅
console.log(x); // undefined (에러 아님!)
var x = 10;
console.log(x); // 10
// 실제 동작 (내부적으로)
var x; // 선언이 최상단으로
console.log(x); // undefined
x = 10; // 할당은 원래 위치
console.log(x); // 10let/const 호이스팅 (TDZ)
// TDZ (Temporal Dead Zone): 선언 전 접근 불가
// console.log(x); // ReferenceError
let x = 10;
console.log(x); // 10
// const도 동일
// console.log(y); // ReferenceError
const y = 20;함수 호이스팅
// 함수 선언문: 호이스팅됨
greet(); // 안녕하세요! (선언 전 호출 가능)
function greet() {
console.log("안녕하세요!");
}
// 함수 표현식: 호이스팅 안 됨
// sayHello(); // ReferenceError
const sayHello = function() {
console.log("Hello!");
};
sayHello(); // Hello!6. 실전 예제
예제 1: 변수 스왑
// 방법 1: 임시 변수
let a = 10;
let b = 20;
let temp = a;
a = b;
b = temp;
console.log(a, b); // 20 10
// 방법 2: 구조 분해 (ES6+)
let x = 10;
let y = 20;
[x, y] = [y, x];
console.log(x, y); // 20 10예제 2: 타입 체크 함수
function getType(value) {
if (value === null) return "null";
if (Array.isArray(value)) return "array";
return typeof value;
}
console.log(getType(42)); // number
console.log(getType("hello")); // string
console.log(getType(true)); // boolean
console.log(getType(null)); // null
console.log(getType(undefined)); // undefined
console.log(getType([])); // array
console.log(getType({})); // object
console.log(getType(() => {})); // function예제 3: 안전한 숫자 변환
function safeParseInt(value, defaultValue = 0) {
const parsed = parseInt(value);
return isNaN(parsed) ? defaultValue : parsed;
}
console.log(safeParseInt("42")); // 42
console.log(safeParseInt("abc")); // 0
console.log(safeParseInt("abc", -1)); // -1
console.log(safeParseInt("3.14")); // 3예제 4: 객체 불변성 유지
// const는 재할당만 막음
const config = {
apiUrl: "https://api.example.com",
timeout: 5000
};
config.timeout = 10000; // OK (내부 변경)
console.log(config); // { apiUrl: '...', timeout: 10000 }
// 완전한 불변 객체: Object.freeze()
const frozenConfig = Object.freeze({
apiUrl: "https://api.example.com",
timeout: 5000
});
frozenConfig.timeout = 10000; // 무시됨 (strict mode에서는 에러)
console.log(frozenConfig.timeout); // 5000 (변경 안 됨)
// 중첩 객체는 freeze 안 됨
const user = Object.freeze({
name: "홍길동",
address: { city: "서울" }
});
// user.name = "김철수"; // 무시됨
user.address.city = "부산"; // OK (중첩 객체는 변경 가능)
console.log(user.address.city); // 부산
// 깊은 freeze (재귀)
function deepFreeze(obj) {
Object.freeze(obj);
Object.keys(obj).forEach(key => {
if (typeof obj[key] === 'object' && obj[key] !== null) {
deepFreeze(obj[key]);
}
});
return obj;
}7. 자주 하는 실수와 해결법
실수 1: var 사용
// ❌ 잘못된 방법
for (var i = 0; i < 3; i++) {
setTimeout(() => console.log(i), 100);
}
// 3 3 3 (의도: 0 1 2)
// ✅ 올바른 방법
for (let i = 0; i < 3; i++) {
setTimeout(() => console.log(i), 100);
}
// 0 1 2실수 2: const 오해
// ❌ 잘못된 이해
const arr = [1, 2, 3];
// arr = [4, 5, 6]; // TypeError (재할당 불가)
// ✅ 올바른 이해
const arr = [1, 2, 3];
arr.push(4); // OK (내부 변경)
arr[0] = 100; // OK
console.log(arr); // [100, 2, 3, 4]실수 3: == vs ===
// ❌ == (타입 변환 후 비교)
console.log(5 == "5"); // true (문제!)
console.log(0 == false); // true
console.log("" == false); // true
// ✅ === (타입까지 비교)
console.log(5 === "5"); // false
console.log(0 === false); // false
console.log("" === false); // false실수 4: 타입 변환 실수
// ❌ 의도하지 않은 문자열 연결
console.log("10" + 20); // 1020 (문자열)
// ✅ 명시적 변환
console.log(Number("10") + 20); // 30
console.log(parseInt("10") + 20); // 30실수 5: 전역 변수 오염
// ❌ 전역 변수
count = 0; // var/let/const 없이 선언 (전역 변수!)
function increment() {
count++;
}
// ✅ 명시적 선언
let count = 0;
function increment() {
count++;
}
// 또는 strict mode 사용
"use strict";
// count = 0; // ReferenceError8. 실전 팁
팁 1: const 우선, let 필요시
// ✅ 기본은 const
const API_URL = "https://api.example.com";
const MAX_RETRY = 3;
// ✅ 재할당 필요시 let
let retryCount = 0;
let result = null;팁 2: 의미 있는 변수명
// ❌ 나쁜 이름
let x = 25;
let data = [1, 2, 3];
let temp = "홍길동";
// ✅ 좋은 이름
let userAge = 25;
let scores = [1, 2, 3];
let userName = "홍길동";
// 상수는 대문자 + 언더스코어
const MAX_USERS = 100;
const API_BASE_URL = "https://api.example.com";팁 3: strict mode 사용
"use strict";
// 선언 없는 변수 사용 불가
// x = 10; // ReferenceError
// 읽기 전용 속성 수정 불가
// const obj = {};
// Object.defineProperty(obj, "x", { value: 42, writable: false });
// obj.x = 100; // TypeError
// 중복 매개변수 불가
// function test(a, a) {} // SyntaxError9. 연습 문제
문제 1: 변수 스왑 (3개)
3개의 변수를 회전시키세요. (a → b, b → c, c → a)
let a = 1;
let b = 2;
let c = 3;
// 풀이
[a, b, c] = [c, a, b];
console.log(a, b, c); // 3 1 2문제 2: 타입 변환 체크
주어진 값을 숫자로 변환하고, 실패하면 기본값을 반환하세요.
function toNumber(value, defaultValue = 0) {
const num = Number(value);
return isNaN(num) ? defaultValue : num;
}
// 테스트
console.log(toNumber("42")); // 42
console.log(toNumber("abc")); // 0
console.log(toNumber("abc", -1)); // -1
console.log(toNumber(null)); // 0
console.log(toNumber(undefined)); // 0문제 3: Truthy/Falsy 필터
배열에서 Falsy 값을 제거하세요.
function removeFalsy(arr) {
return arr.filter(item => item); // Truthy만 통과
}
// 또는
function removeFalsy(arr) {
return arr.filter(Boolean);
}
// 테스트
let arr = [0, 1, false, 2, "", 3, null, undefined, NaN, 4];
console.log(removeFalsy(arr)); // [1, 2, 3, 4]정리
핵심 요약
- 변수 선언:
const: 재할당 불가 (기본 선택)let: 재할당 가능var: 사용 금지 (구식)
- 스코프:
- 블록 스코프:
let,const - 함수 스코프:
var
- 블록 스코프:
- 데이터 타입:
- 원시 타입: Number, String, Boolean, undefined, null, Symbol, BigInt
- 참조 타입: Object, Array, Function
- 타입 변환:
Number(),String(),Boolean()parseInt(),parseFloat()- Truthy/Falsy 값
- 호이스팅:
var: undefined로 초기화let/const: TDZ (접근 불가)
베스트 프랙티스
- ✅
const우선, 재할당 필요시let - ✅
===사용 (==금지) - ✅
"use strict"사용 - ✅ 의미 있는 변수명
- ✅ 전역 변수 최소화
다음 단계
- JavaScript 함수
- JavaScript 배열과 객체
- JavaScript 조건문과 반복문
관련 글
심화 부록: 구현·운영 관점
이 부록은 앞선 본문에서 다룬 주제(「JavaScript 변수와 데이터 타입 | let, const, var 완벽 정리」)를 구현·런타임·운영 관점에서 다시 압축합니다. 도메인별 세부 구현은 글마다 다르지만, 입력 검증 → 핵심 연산 → 부작용(I/O·네트워크·동시성) → 관측의 흐름으로 장애를 나누면 원인 추적이 빨라집니다.
내부 동작과 핵심 메커니즘
flowchart TD A[입력·요청·이벤트] --> B[파싱·검증·디코딩] B --> C[핵심 연산·상태 전이] C --> D[부작용: I/O·네트워크·동시성] D --> E[결과·관측·저장]
sequenceDiagram participant C as 클라이언트/호출자 participant B as 경계(런타임·게이트웨이·프로세스) participant D as 의존성(API·DB·큐·파일) C->>B: 요청/이벤트 B->>D: 조회·쓰기·RPC D-->>B: 지연·부분 실패·재시도 가능 B-->>C: 응답 또는 오류(코드·상관 ID)
- 불변 조건(Invariant): 버퍼 경계, 프로토콜 상태, 트랜잭션 격리, FD 상한 등 단계별로 문장으로 적어 두면 디버깅 비용이 줄어듭니다.
- 결정성: 순수 층과 시간·네트워크·스케줄에 의존하는 층을 분리해야 테스트와 장애 분석이 쉬워집니다.
- 경계 비용: 직렬화, 인코딩, syscall 횟수, 락 경합, 할당·GC, 캐시 미스를 의심 목록에 둡니다.
- 백프레셔: 생산자가 소비자보다 빠를 때 버퍼·큐·스트림에서 속도를 줄이는 신호를 어디에 둘지 정의합니다.
프로덕션 운영 패턴
| 영역 | 운영 관점 질문 |
|---|---|
| 관측성 | 요청 단위 상관 ID, 에러율·지연 p95/p99, 의존성 타임아웃·재시도가 대시보드에 보이는가 |
| 안전성 | 입력 검증·권한·비밀·감사 로그가 코드 경로마다 일관적인가 |
| 신뢰성 | 재시도는 멱등 연산에만 적용되는가, 서킷 브레이커·백오프·DLQ가 있는가 |
| 성능 | 캐시·배치 크기·커넥션 풀·인덱스·백프레셔가 데이터 규모에 맞는가 |
| 배포 | 롤백 룬북, 카나리/블루그린, 마이그레이션·피처 플래그가 문서화되어 있는가 |
| 용량 | 피크 트래픽·디스크·FD·스레드 풀 상한을 주기적으로 검증하는가 |
스테이징은 데이터 양·네트워크 RTT·동시성을 프로덕션에 가깝게 맞출수록 재현율이 올라갑니다.
확장 예시: 엔드투엔드 미니 시나리오
앞선 본문 주제(「JavaScript 변수와 데이터 타입 | let, const, var 완벽 정리」)를 배포·운영 흐름에 맞춰 옮긴 체크리스트입니다. 도메인에 맞게 단계 이름만 바꿔 적용할 수 있습니다.
- 입력 계약 고정: 스키마·버전·최대 페이로드·타임아웃·에러 코드를 경계에 둔다.
- 핵심 경로 계측: 요청 ID, 단계별 지연, 외부 호출 결과 코드를 로그·메트릭·트레이스에서 한 흐름으로 본다.
- 실패 주입: 의존성 타임아웃·5xx·부분 데이터·락 대기를 스테이징에서 재현한다.
- 호환·롤백: 설정/마이그레이션/클라이언트 버전을 되돌릴 수 있는지 확인한다.
- 부하 후 검증: 피크 대비 p95/p99, 에러율, 리소스 상한, 알림 임계값을 점검한다.
handle(request):
ctx = newCorrelationId()
validated = validateSchema(request)
authorize(validated, ctx)
result = domainCore(validated)
persistOrEmit(result, idempotentKey)
recordMetrics(ctx, latency, outcome)
return result문제 해결(Troubleshooting)
| 증상 | 가능 원인 | 조치 |
|---|---|---|
| 간헐적 실패 | 레이스, 타임아웃, 외부 의존성, DNS | 최소 재현 스크립트, 분산 트레이스·로그 상관관계, 재시도·서킷 설정 점검 |
| 성능 저하 | N+1, 동기 I/O, 락 경합, 과도한 직렬화, 캐시 미스 | 프로파일러·APM으로 핫스팟 확인 후 한 가지씩 제거 |
| 메모리 증가 | 캐시 무제한, 구독/리스너 누수, 대용량 버퍼, 커넥션 미반납 | 상한·TTL·힙/FD 스냅샷 비교 |
| 빌드·배포만 실패 | 환경 변수, 권한, 플랫폼 차이, lockfile | CI 로그와 로컬 diff, 런타임·이미지 버전 핀 |
| 설정 불일치 | 프로필·시크릿·기본값, 리전 | 스키마 검증된 설정 단일 소스와 배포 매트릭스 표준화 |
| 데이터 불일치 | 비멱등 재시도, 부분 쓰기, 캐시 무효화 누락 | 멱등 키·아웃박스·트랜잭션 경계 재검토 |
권장 순서: (1) 최소 재현 (2) 최근 변경 범위 축소 (3) 환경·의존성 차이 (4) 관측으로 가설 검증 (5) 수정 후 회귀·부하 테스트.
배포 전에는 git add → git commit → git push 후 npm run deploy 순서를 권장합니다.
자주 묻는 질문 (FAQ)
Q. 이 내용을 실무에서 언제 쓰나요?
A. JavaScript 변수와 데이터 타입: let, const, var 완벽 정리. let, const, var·스코프 (Scope)로 흐름을 잡고 원리·코드·실무 적용을 한글로 정리합니다. Start now. 실무에서는 위 본문의 예제와 선택 가이드를 참고해 적용하면 됩니다.
Q. 선행으로 읽으면 좋은 글은?
A. 각 글 하단의 이전 글 또는 관련 글 링크를 따라가면 순서대로 배울 수 있습니다. JavaScript 시리즈 목차에서 전체 흐름을 확인할 수 있습니다.
Q. 더 깊이 공부하려면?
A. cppreference와 해당 라이브러리 공식 문서를 참고하세요. 글 말미의 참고 자료 링크도 활용하면 좋습니다.
같이 보면 좋은 글 (내부 링크)
이 주제와 연결되는 다른 글입니다.
- JavaScript var vs let vs const 완벽 비교 | 변수 선언 방식 선택 가이드
- C++ constexpr Lambda | ‘컴파일 타임 람다’ 가이드
- C++ Chrono Literals | ‘시간 리터럴’ 가이드
이 글에서 다루는 키워드 (관련 검색어)
JavaScript, 변수, let, const, var, 데이터타입, 호이스팅 등으로 검색하시면 이 글이 도움이 됩니다.