2.6.1 명시적 형변환 (String(), Number()) - 상자 안 내용물을 섬세하게 바꾸는 방법

📘 2.6.1 명시적 형변환 (String(), Number()) - 상자 안 내용물을 섬세하게 바꾸는 방법

햇살이 창가에 살며시 내려앉는 이 오후, 여러분이 그동안 정성스럽게 만들어온 데이터 상자들을 떠올려봅니다. 숫자를 품은 상자, 글자를 간직한 상자, 참과 거짓을 담은 상자들까지. 저마다의 이야기를 간직한 이 상자들이 때로는 서로 다른 모습으로 변화해야 할 순간들이 찾아와요.

문득 이런 순간이 있지요. "이 숫자 상자에 있는 소중한 내용을 글자 상자로 옮기고 싶어요" 또는 "이 글자 상자 안의 숫자를 진짜 숫자로 바꾸고 싶어요" 하는 마음이 생기는 순간들 말이에요. 이럴 때 우리에게는 상자 변환의 기능 String()과 Number()가 필요하답니다.

🧠 새로운 말들과 친해지기

오늘 새롭게 만날 말들을 차근차근 알아보겠습니다.

어려운 말	쉬운 설명
형변환	한 상자의 내용물을 다른 종류 상자로 옮겨 담는 것이에요.
명시적 형변환	개발자가 직접 "이걸 이렇게 바꿔줘!"라고 명령해서 바꾸는 것이에요.
String()	다른 종류의 내용물을 글자로 바꿔주는 기능이에요.
Number()	다른 종류의 내용물을 숫자로 바꿔주는 기능이에요.

명시적이라는 말은 "분명하게 드러내 보이는"이라는 의미를 담고 있어요. 즉, 개발자가 "이 값을 글자로 바꿔주세요"라고 분명하게 요청하는 것이 명시적 형변환이랍니다. 반대로 컴퓨터가 스스로 타입을 바꾸는 것을 암시적 형변환이라고 하는데, 이는 나중에 배우게 될 거예요.

✨ 명시적 형변환의 핵심 이해하기

명시적 형변환은 프로그래밍에서 서로 다른 상자의 내용물을 함께 사용할 수 있게 해주는 소중한 도구예요. 마치 서로 다른 언어를 사용하는 친구들이 대화하기 위해 번역을 부탁하는 것처럼, 서로 다른 종류의 정보들이 함께 작업하기 위해서는 형변환이 필요하답니다.

자바스크립트는 같은 상자에 오늘은 숫자를 담았다가, 내일은 글자를 담을 수도 있어요. 이런 자유로움이 때로는 우리를 당황스럽게 만들기도 하지요. 특히 웹 페이지에서 사용자가 입력한 모든 정보는 글자 형태로 전달되기 때문에, 계산을 위해서는 숫자로 바꾸는 과정이 반드시 필요해요.

명시적 형변환의 가장 큰 장점은 예측할 수 있다는 것이에요. 개발자가 언제, 어떤 종류로 바꿀지 명확하게 조절할 수 있기 때문에 코드가 어떻게 동작할지 정확히 예측할 수 있답니다.

재미있는 이야기: 다국적 회사의 번역 시스템

명시적 형변환을 더 쉽게 이해하기 위해 '다국적 회사의 번역 시스템' 이야기를 들려드리겠습니다.

세계 곳곳에서 온 사람들이 함께 일하는 회사가 있었어요. 한국어로 작성된 문서를 영어로 번역해야 하고, 일본어로 된 이메일을 한국어로 번역해야 하는 일이 자주 생겼답니다. 이때 번역가에게 명확하게 부탁을 드려요.

"이 한국어 문서를 영어로 번역해주세요" → String(koreanDocument)
"이 숫자를 한국어 설명으로 바꿔주세요" → String(numberValue)
"이 영어 숫자 표현을 실제 숫자로 바꿔주세요" → Number(englishNumber)

번역가는 요청받은 대로 정성스럽게 번역을 수행해요. 원본 문서는 그대로 두고, 새로운 언어로 된 사본을 만들어주지요. 마찬가지로 형변환 기능들도 원본 값은 바꾸지 않고, 새로운 종류의 값을 만들어서 돌려준답니다.

만약 번역할 수 없는 내용이 있다면(예: 한국 고유의 문화적 표현), 번역가는 "번역 불가"라고 알려줘요. 형변환에서도 마찬가지로 바꿀 수 없는 값(예: "안녕하세요"를 숫자로 바꾸기)이 있으면 NaN(숫자가 아니라는 뜻)이라는 특별한 값을 돌려준답니다.

🎯 명시적 형변환을 사용하는 이유

명시적 형변환이 실제 프로그래밍에서 중요한 이유는 여러 가지가 있어요.

🔹 1. 사용자 입력값 처리의 꼭 필요한 과정

웹 개발에서 가장 흔한 상황이에요. HTML 입력창을 통해 사용자가 입력한 모든 정보는 글자로 전달돼요. 나이를 입력했든, 점수를 입력했든 상관없이 모두 글자로 온답니다. 이를 숫자로 바꿔야만 수학적 계산이 가능해요.

🔹 2. 서로 다른 종류 정보들 함께 사용하기

서로 다른 출처에서 온 정보들을 함께 처리할 때, 종류가 다르면 예상치 못한 결과가 생길 수 있어요. 명시적 형변환을 통해 모든 정보를 같은 종류로 맞춰주면 안전한 처리가 가능하답니다.

🔹 3. 코드 의도를 명확하게 보여주기

다른 개발자가 코드를 볼 때, 형변환 기능이 있으면 "아, 여기서 종류를 바꾸려고 하는구나"라고 즉시 이해할 수 있어요.

⚙️ 기본 사용법 알아보기

명시적 형변환의 기본 사용법은 매우 간단해요.

// 글자로 바꾸기
String(바꿀값)

// 숫자로 바꾸기
Number(바꿀값)

// 참거짓으로 바꾸기
Boolean(바꿀값)

이 중에서 가장 자주 사용되는 것은 String()과 Number() 기능이에요.

String() 기능의 변환 규칙:

String() 기능은 거의 모든 값을 글자로 바꿀 수 있어요. 변환 규칙은 매우 직관적이에요.

• 숫자 → 그 숫자의 글자 표현
• 참거짓 → "true" 또는 "false"
• null → "null"
• undefined → "undefined"

Number() 기능의 변환 규칙:

Number() 기능은 조금 더 섬세한 규칙을 따라요.

• 숫자 모양 글자 → 해당 숫자
• 빈 글자 또는 공백만 있는 글자 → 0
• true → 1, false → 0
• null → 0
• undefined → NaN
• 숫자로 바꿀 수 없는 글자 → NaN

🧪 직접 해보면서 배우기

이제 실제 예시를 통해 명시적 형변환이 어떻게 동작하는지 자세히 살펴보겠습니다.

🔹 첫 번째 예시: 숫자를 글자로 바꾸기

첫 번째 예시에서는 다양한 종류의 숫자를 글자로 바꾸는 방법을 알아보겠습니다.

// 여러 가지 숫자들 준비하기
let wholeNumber = 42;           // 일반적인 정수
let decimalNumber = 3.14159;    // 소수점이 있는 숫자
let negativeNumber = -25;       // 음수
let zeroNumber = 0;             // 영(0)

console.log("=== 원본 숫자들 확인하기 ===");
console.log("정수:", wholeNumber, "/ 종류:", typeof wholeNumber);
console.log("소수:", decimalNumber, "/ 종류:", typeof decimalNumber);
console.log("음수:", negativeNumber, "/ 종류:", typeof negativeNumber);
console.log("영:", zeroNumber, "/ 종류:", typeof zeroNumber);

// String()을 사용해서 글자로 바꾸기
console.log("\n=== String()으로 글자로 바꾸기 ===");
let stringFromWhole = String(wholeNumber);        // 42 → "42"
let stringFromDecimal = String(decimalNumber);    // 3.14159 → "3.14159"
let stringFromNegative = String(negativeNumber);  // -25 → "-25"
let stringFromZero = String(zeroNumber);          // 0 → "0"

console.log("바뀐 정수:", stringFromWhole, "/ 종류:", typeof stringFromWhole);
console.log("바뀐 소수:", stringFromDecimal, "/ 종류:", typeof stringFromDecimal);
console.log("바뀐 음수:", stringFromNegative, "/ 종류:", typeof stringFromNegative);
console.log("바뀐 영:", stringFromZero, "/ 종류:", typeof stringFromZero);

// 바뀐 글자들로 메시지 만들기
console.log("\n=== 바뀐 글자들로 메시지 만들기 ===");
let message1 = "제가 좋아하는 숫자는 " + stringFromWhole + "번이에요!";
let message2 = "원주율은 약 " + stringFromDecimal + "이에요.";
let message3 = "온도는 " + stringFromNegative + "도예요.";
let message4 = "아무것도 없다는 뜻으로 " + stringFromZero + "을 써요.";

console.log(message1);
console.log(message2);
console.log(message3);
console.log(message4);

🔹 두 번째 예시: 참거짓을 글자로 바꾸기

두 번째 예시에서는 참거짓 값들을 글자로 바꾸는 방법을 알아보겠습니다.

// 여러 가지 참거짓 값들 준비하기
let isRaining = true;           // 비가 와요
let isWeekend = false;          // 주말이 아니에요  
let hasHomework = true;         // 숙제가 있어요
let isHungry = false;           // 배가 고프지 않아요

console.log("=== 원본 참거짓 값들 확인하기 ===");
console.log("비 오는 중:", isRaining, "/ 종류:", typeof isRaining);
console.log("주말인지:", isWeekend, "/ 종류:", typeof isWeekend);
console.log("숙제 있는지:", hasHomework, "/ 종류:", typeof hasHomework);
console.log("배고픈지:", isHungry, "/ 종류:", typeof isHungry);

// String()을 사용해서 글자로 바꾸기
console.log("\n=== String()으로 글자로 바꾸기 ===");
let rainString = String(isRaining);     // true → "true"
let weekendString = String(isWeekend);  // false → "false"
let homeworkString = String(hasHomework); // true → "true"
let hungryString = String(isHungry);    // false → "false"

console.log("바뀐 비:", rainString, "/ 종류:", typeof rainString);
console.log("바뀐 주말:", weekendString, "/ 종류:", typeof weekendString);
console.log("바뀐 숙제:", homeworkString, "/ 종류:", typeof homeworkString);
console.log("바뀐 배고픔:", hungryString, "/ 종류:", typeof hungryString);

// 바뀐 글자들로 상태 리포트 만들기
console.log("\n=== 상태 리포트 만들기 ===");
let weatherReport = "비 오는 중: " + rainString;
let scheduleReport = "주말인가요: " + weekendString;
let studyReport = "숙제 있나요: " + homeworkString;
let feelingReport = "배고프나요: " + hungryString;

console.log("🌦️  " + weatherReport);
console.log("📅 " + scheduleReport);
console.log("📚 " + studyReport);
console.log("🍽️  " + feelingReport);

🔹 세 번째 예시: 글자를 숫자로 바꾸기

세 번째 예시에서는 여러 종류의 글자를 숫자로 바꾸는 방법을 알아보겠습니다.

// 여러 가지 글자들 준비하기 (숫자로 바뀔 수 있는 것들)
let numberString1 = "42";           // 정수 형태의 글자
let numberString2 = "3.14";         // 소수 형태의 글자
let numberString3 = "-10";          // 음수 형태의 글자
let emptyString = "";               // 빈 글자
let spaceString = "   ";            // 공백만 있는 글자

console.log("=== 원본 글자들 확인하기 ===");
console.log("정수 글자:", numberString1, "/ 종류:", typeof numberString1);
console.log("소수 글자:", numberString2, "/ 종류:", typeof numberString2);
console.log("음수 글자:", numberString3, "/ 종류:", typeof numberString3);
console.log("빈 글자:", emptyString);
console.log("공백 글자:", spaceString);

// Number()를 사용해서 숫자로 바꾸기
console.log("\n=== Number()로 숫자로 바꾸기 ===");
let numberFromString1 = Number(numberString1);   // "42" → 42
let numberFromString2 = Number(numberString2);   // "3.14" → 3.14
let numberFromString3 = Number(numberString3);   // "-10" → -10
let numberFromEmpty = Number(emptyString);       // "" → 0
let numberFromSpace = Number(spaceString);       // "   " → 0

console.log("바뀐 정수:", numberFromString1, "/ 종류:", typeof numberFromString1);
console.log("바뀐 소수:", numberFromString2, "/ 종류:", typeof numberFromString2);
console.log("바뀐 음수:", numberFromString3, "/ 종류:", typeof numberFromString3);
console.log("바뀐 빈 글자:", numberFromEmpty, "/ 종류:", typeof numberFromEmpty);
console.log("바뀐 공백:", numberFromSpace, "/ 종류:", typeof numberFromSpace);

// 바뀐 숫자들로 계산해보기
console.log("\n=== 바뀐 숫자들로 계산해보기 ===");
let sum1 = numberFromString1 + numberFromString2;    // 42 + 3.14 = 45.14
let sum2 = numberFromString1 + numberFromString3;    // 42 + (-10) = 32
let sum3 = numberFromString1 + numberFromEmpty;      // 42 + 0 = 42

console.log("42 + 3.14 =", sum1);
console.log("42 + (-10) =", sum2);
console.log("42 + 0 =", sum3);

🔹 네 번째 예시: 바꿀 수 없는 경우들 알아보기

네 번째 예시에서는 숫자로 바꿀 수 없는 글자들을 다뤄보겠습니다.

// 숫자로 바꿀 수 없는 글자들
let textString = "안녕하세요";       // 일반 텍스트
let mixedString = "123abc";         // 숫자와 글자가 섞인 것
let specialString = "!@#$%";        // 특수 문자들
let koreanNumber = "오십";          // 한글 숫자

console.log("=== 바꾸기 어려운 글자들 ===");
console.log("일반 텍스트:", textString);
console.log("혼합 텍스트:", mixedString);
console.log("특수 문자:", specialString);
console.log("한글 숫자:", koreanNumber);

// Number()로 바꾸기 시도해보기
console.log("\n=== Number()로 바꾸기 시도 ===");
let resultText = Number(textString);        // "안녕하세요" → NaN
let resultMixed = Number(mixedString);      // "123abc" → NaN
let resultSpecial = Number(specialString);  // "!@#$%" → NaN
let resultKorean = Number(koreanNumber);    // "오십" → NaN

console.log("바뀐 일반 텍스트:", resultText, "/ 종류:", typeof resultText);
console.log("바뀐 혼합 텍스트:", resultMixed, "/ 종류:", typeof resultMixed);
console.log("바뀐 특수 문자:", resultSpecial, "/ 종류:", typeof resultSpecial);
console.log("바뀐 한글 숫자:", resultKorean, "/ 종류:", typeof resultKorean);

// NaN의 특별한 성질 확인하기
console.log("\n=== NaN의 특별한 성질 ===");
console.log("NaN + 10 =", resultText + 10);        // NaN + 10 = NaN
console.log("NaN * 2 =", resultText * 2);          // NaN * 2 = NaN
console.log("NaN은 특별해서 자기 자신과도 다르다고 나와요.");

// typeof로 NaN의 종류 확인
console.log("NaN의 종류:", typeof resultText);      // "number" (놀랍게도 숫자 종류!)

🔹 다섯 번째 예시: 실용적인 형변환 활용

다섯 번째 예시에서는 실제로 유용한 형변환 활용법을 알아보겠습니다.

// 사용자 입력을 시뮬레이션한 상황
let userAge = "15";           // 사용자가 입력한 나이 (글자)
let userScore = "85";         // 사용자가 입력한 점수 (글자)
let currentYear = 2025;       // 프로그램에서 정한 현재 연도 (숫자)

console.log("=== 사용자 입력 정보 ===");
console.log("입력받은 나이:", userAge, "(" + typeof userAge + ")");
console.log("입력받은 점수:", userScore, "(" + typeof userScore + ")");
console.log("현재 연도:", currentYear, "(" + typeof currentYear + ")");

// 글자를 숫자로 바꿔서 계산에 사용하기
console.log("\n=== 형변환으로 계산 가능하게 만들기 ===");
let ageNumber = Number(userAge);      // "15" → 15
let scoreNumber = Number(userScore);  // "85" → 85

console.log("바뀐 나이:", ageNumber, "(" + typeof ageNumber + ")");
console.log("바뀐 점수:", scoreNumber, "(" + typeof scoreNumber + ")");

// 이제 수학적 계산이 가능해요
let birthYear = currentYear - ageNumber;        // 2025 - 15 = 2010
let nextAge = ageNumber + 1;                    // 15 + 1 = 16
let doubleScore = scoreNumber * 2;              // 85 * 2 = 170

console.log("\n=== 계산 결과들 ===");
console.log("태어난 연도:", birthYear);
console.log("내년 나이:", nextAge);
console.log("점수 2배:", doubleScore);

// 계산 결과를 다시 글자로 바꿔서 메시지 만들기
console.log("\n=== 결과를 글자로 바꿔서 메시지 만들기 ===");
let birthYearString = String(birthYear);        // 2010 → "2010"
let nextAgeString = String(nextAge);            // 16 → "16"
let doubleScoreString = String(doubleScore);    // 170 → "170"

let message1 = userAge + "살이시면 " + birthYearString + "년생이시네요!";
let message2 = "내년에는 " + nextAgeString + "살이 되세요.";
let message3 = "점수 " + userScore + "점의 2배는 " + doubleScoreString + "점이에요!";

console.log("✅ " + message1);
console.log("✅ " + message2);
console.log("✅ " + message3);

// 원본 값들은 변하지 않았는지 확인
console.log("\n=== 원본 값들 확인 ===");
console.log("원본 나이는 여전히:", userAge, "(" + typeof userAge + ")");
console.log("원본 점수는 여전히:", userScore, "(" + typeof userScore + ")");

🔄 명시적 형변환 사용하는 순서 정리하기

지금까지 배운 명시적 형변환의 사용 순서를 단계별로 정리해보겠습니다.

1단계: 현재 종류 확인하기

• typeof 연산자를 사용해서 바꾸려는 값의 현재 종류를 확인해요.

2단계: 목표 종류 정하기

• 정보를 어떤 용도로 사용할지에 따라 바꿀 종류를 정해요.

3단계: 적절한 변환 기능 선택하기

• String(), Number(), Boolean() 중에서 목적에 맞는 기능을 선택해요.

4단계: 결과 확인하기

• 변환이 성공했는지 확인해요. 특히 Number() 변환의 경우 NaN이 결과로 나올 수 있어요.

🧠 자주 하는 실수와 주의할 점

명시적 형변환을 사용할 때 초보자들이 자주 하는 실수들을 알아보겠습니다.

❌ 실수 1: 원본 변수가 바뀐다고 착각하기

// 착각하기 쉬운 상황
let originalScore = 100;
let stringScore = String(originalScore);        // originalScore를 String()으로 바꾸기

console.log("원본 점수:", originalScore);        // 100 (여전히 숫자)
console.log("원본 종류:", typeof originalScore); // "number" (종류 변화 없음)
console.log("바뀐 점수:", stringScore);          // "100" (새로운 글자)
console.log("바뀐 종류:", typeof stringScore);   // "string"

// 원본을 실제로 바꾸려면 다시 저장 필요
originalScore = String(originalScore);          // 바뀐 값을 다시 저장
console.log("다시 저장 후 종류:", typeof originalScore); // "string"

❌ 실수 2: NaN을 일반 숫자처럼 사용하기

// 위험한 코드: NaN 확인 없이 사용
let userInput = "안녕하세요";
let number = Number(userInput);                 // "안녕하세요"를 숫자로? → NaN
let result = number * 2;                        // NaN * 2 = NaN
console.log("결과:", result);                   // NaN

// 주의깊게 사용하기
let userInputSafe = "안녕하세요";
let numberSafe = Number(userInputSafe);
console.log("변환 결과:", numberSafe);           // NaN
console.log("이 값은 NaN이므로 계산에 사용할 수 없어요.");

🎯 기본 연습 문제들

조용한 오후, 책상에 앉아 차분히 연습해보는 시간을 가져볼까요.

기본 문제 1. 여러 종류를 글자로 바꿔보기

// 다양한 종류의 값들 준비
let number1 = 25;
let number2 = 3.14;
let boolean1 = true;
let boolean2 = false;

console.log("=== 연습 문제 1: 글자로 바꾸기 ===");

// 각각을 String()으로 바꿔보세요
let stringNumber1 = String(number1);
let stringNumber2 = String(number2);  
let stringBoolean1 = String(boolean1);
let stringBoolean2 = String(boolean2);

// 결과 확인하기
console.log("숫자 25 → 글자:", stringNumber1, "/ 종류:", typeof stringNumber1);
console.log("숫자 3.14 → 글자:", stringNumber2, "/ 종류:", typeof stringNumber2);
console.log("true → 글자:", stringBoolean1, "/ 종류:", typeof stringBoolean1);
console.log("false → 글자:", stringBoolean2, "/ 종류:", typeof stringBoolean2);

// 바뀐 글자들로 문장 만들기
let sentence = "저는 " + stringNumber1 + "살이고, 파이는 약 " + stringNumber2 + "예요.";
console.log("만든 문장:", sentence);

기본 문제 2. 글자를 숫자로 바꿔서 계산하기

// 글자 형태의 숫자들 준비
let stringNum1 = "30";
let stringNum2 = "45";
let stringNum3 = "12.5";

console.log("=== 연습 문제 2: 숫자로 바꿔서 계산하기 ===");

// 각각을 Number()로 바꿔보세요
let realNum1 = Number(stringNum1);    // "30" → 30
let realNum2 = Number(stringNum2);    // "45" → 45
let realNum3 = Number(stringNum3);    // "12.5" → 12.5

// 바뀐 결과 확인
console.log("글자 '30' → 숫자:", realNum1, "/ 종류:", typeof realNum1);
console.log("글자 '45' → 숫자:", realNum2, "/ 종류:", typeof realNum2);
console.log("글자 '12.5' → 숫자:", realNum3, "/ 종류:", typeof realNum3);

// 이제 계산이 가능해요
let sum = realNum1 + realNum2;        // 30 + 45 = 75
let average = (realNum1 + realNum2) / 2;  // (30 + 45) / 2 = 37.5
let total = realNum1 + realNum2 + realNum3; // 30 + 45 + 12.5 = 87.5

console.log("30 + 45 =", sum);
console.log("30과 45의 평균 =", average);
console.log("모든 수의 합 =", total);

✅ 학습 완료 체크리스트

이번 시간에 배운 내용들을 모두 마음에 담았는지 확인해보세요.

학습 내용	이해했나요?
명시적 형변환의 기본 개념	✅
String()과 Number() 사용법	✅
변환 규칙과 NaN 이해	✅
자주 하는 실수들	✅
실전 예제 이해	✅

🔄 1단원과 2단원 종합 복습하기

2.6단원까지 차근차근 공부했으니, 1단원과 2단원에서 배운 소중한 내용들을 종합적으로 복습해보는 시간을 가져볼까요?

종합 복습 문제 1. 변수 선언부터 형변환까지

// 1단원: 다양한 방법으로 변수 선언하기
let studentName = "김민지";        // 학생 이름 (변수)
const PI = 3.14159;                // 원주율 (상수)
let age = 12;                      // 나이 (변수)
let isElementary = true;           // 초등학생인지 (변수)

console.log("=== 1단원 복습: 변수와 상수 ===");
console.log("이름:", studentName, "(" + typeof studentName + ")");
console.log("원주율:", PI, "(" + typeof PI + ")");
console.log("나이:", age, "(" + typeof age + ")");
console.log("초등학생:", isElementary, "(" + typeof isElementary + ")");

// 2.6단원: 명시적 형변환 적용하기
console.log("\n=== 2.6단원: 형변환 적용하기 ===");
// 이름 정보는 그대로 사용
let ageString = String(age);                // 나이를 글자로 바꾸기
let piString = String(PI);                  // 원주율을 글자로 바꾸기
let statusString = String(isElementary);    // 참거짓을 글자로 바꾸기

console.log("이름:", studentName);
console.log("나이 → 글자:", ageString, "(" + typeof ageString + ")");
console.log("원주율 → 글자:", piString, "(" + typeof piString + ")");
console.log("상태 → 글자:", statusString, "(" + typeof statusString + ")");

// 바뀐 값들로 자기소개 만들기
let introduction = "안녕하세요! 저는 " + studentName + "이고, " + 
                  ageString + "살 " + 
                  "초등학생입니다!";

console.log("자기소개:", introduction);

종합 복습 문제 2. 연산자와 형변환 조합하기

// 2.1-2.5단원에서 배운 연산자들과 2.6단원 형변환 조합
let score1 = "85";      // 글자 형태의 점수1
let score2 = "92";      // 글자 형태의 점수2
let bonus = "5";        // 글자 형태의 보너스

console.log("=== 연산자와 형변환 조합 ===");
console.log("점수1:", score1, "(" + typeof score1 + ")");
console.log("점수2:", score2, "(" + typeof score2 + ")");
console.log("보너스:", bonus, "(" + typeof bonus + ")");

// 형변환 후 계산하기
let num1 = Number(score1);      // "85" → 85
let num2 = Number(score2);      // "92" → 92
let bonusNum = Number(bonus);   // "5" → 5

// 2.1단원 복습: 산술 연산자 사용
let total = num1 + num2;        // 덧셈
let average = total / 2;        // 나눗셈
let withBonus = average + bonusNum; // 보너스 점수 추가

// 2.4단원 복습: 복합 할당 연산자 사용
num1 += bonusNum;               // num1 = num1 + bonusNum

// 2.2단원 복습: 비교 연산자 사용
let isHighScore = average >= 90;
let isPerfect = total === 200;

// 결과를 다시 글자로 바꿔서 보고서 만들기
let totalString = String(total);
let averageString = String(average);
let withBonusString = String(withBonus);

console.log("총점:", totalString + "점");
console.log("평균:", averageString + "점");  
console.log("보너스 포함:", withBonusString + "점");
console.log("고득점 여부:", String(isHighScore));
console.log("만점 여부:", String(isPerfect));

지금까지 명시적 형변환 String()과 Number() 기능의 모든 특성과 활용법을 자세히 알아보았습니다. 이 기능들은 서로 다른 종류의 정보를 안전하고 예측 가능한 방식으로 바꿀 수 있게 해주는 소중한 도구예요. 웹 개발에서 사용자 입력을 처리하거나, 다양한 출처의 정보를 통합할 때 반드시 필요한 기능이므로, 변환 규칙과 예외 상황들을 잘 이해하고 활용할 수 있어야 해요.

📂 마무리 정보

오늘 배운 2.6.1 내용이 여러분의 자바스크립트 지식 상자에 잘 자리잡았나요? 다음 시간에는 더욱 흥미로운 내용으로 만나뵙겠습니다.

기억할 점:

• String()은 거의 모든 값을 글자로 바꿔줘요

• Number()는 숫자로 바꿀 수 있는 값만 숫자로 바꿔주고, 안 되면 NaN을 줘요

• 원본 값은 바뀌지 않고 새로운 값이 만들어져요
  
  
  

  🚀 더 체계적인 JavaScript 학습을 원하신다면?

  이 포스팅에서 다룬 내용을 실제로 실습해보세요!
  무료 JavaScript 학습 플랫폼에서 단계별 학습과 실시간 코드 실행을 통해
  더욱 효과적이고 재미있게 학습하실 수 있습니다.

  📝 실시간 코드 실행 📊 학습 진도 관리 👥 체계적 커리큘럼

  📚 171개 체계적 학습레슨 · 📋 855개 4지선다 연습문제 · 🆓 완전 무료 · ⚡ 즉시 시작

  💻 무료로 학습하러 가기

---