🔹 변수: 정보를 저장하는 상자
// 변수 만들기
var 이름 = "홍길동"; // 문자열(텍스트) 저장
var 나이 = 25; // 숫자 저장
var 합격여부 = true; // 논리값(참/거짓) 저장
🔹 기본 데이터 타입
- 문자열 (String): 텍스트 -
"안녕"
,'홍길동'
- 숫자 (Number): 정수, 소수 -
5
,3.14
- 논리값 (Boolean): 참/거짓 -
true
,false
🔹 기본 연산자
- 산술 연산자:
+
(더하기),-
(빼기),*
(곱하기),/
(나누기) - 비교 연산자:
==
(같다),!=
(다르다),>
(크다),<
(작다) - 논리 연산자:
&&
(그리고),||
(또는),!
(아니다)
🔹 기본 입출력
- 입력 받기:
prompt("질문")
- 사용자에게 정보 요청 - 출력하기:
console.log()
- 콘솔에 출력alert()
- 팝업창으로 출력document.write()
- HTML 페이지에 출력
문제 해결 접근법: 단계별 코딩
가장 중요한 것은 문제를 작은 단계로 나누는 방법입니다.
단계 1: 문제를 글로 써보기
예시 문제: "숫자를 입력받아 짝수인지 홀수인지 판별하기"
- 사용자에게 숫자를 입력받는다
- 입력받은 값을 숫자로 변환한다
- 숫자를 2로 나눠 나머지를 확인한다
- 나머지가 0이면 "짝수", 아니면 "홀수"라고 출력한다
단계 2: 각 단계를 코드로 변환하기
// 1. 사용자에게 숫자를 입력받는다
var 입력값 = prompt("숫자를 입력하세요");
// 2. 입력받은 값을 숫자로 변환한다
var 숫자 = Number(입력값);
// 3 & 4. 짝수/홀수 판별하고 출력하기
if (숫자 % 2 == 0) {
alert("짝수입니다");
} else {
alert("홀수입니다");
}
초보자가 자주 놓치는 기본 개념 3가지
1. 형 변환 (Type Conversion)
사용자 입력은 항상 문자열로 받아집니다. 계산이 필요하면 숫자로 변환해야 해요!
var 나이_문자열 = prompt("나이를 입력하세요"); // "25" (문자열)
var 나이_숫자 = Number(나이_문자열); // 25 (숫자)
// 변환하지 않으면 예상치 못한 결과가 나옴:
console.log(나이_문자열 + 5); // "255" (문자열 이어붙이기)
console.log(나이_숫자 + 5); // 30 (숫자 덧셈)
2. 조건식 평가 (Condition Evaluation)
조건식은 항상 논리값(true/false)으로 평가됩니다.
var 점수 = 85;
// 점수 >= 60 은 true 또는 false로 평가됨
var 합격여부 = 점수 >= 60; // true
if (합격여부) {
console.log("합격!");
}
// 위 코드는 이렇게 쓸 수도 있음
if (점수 >= 60) {
console.log("합격!");
}
3. 코드 블록 (Code Blocks)
중괄호 { }
안에 있는 코드는 하나의 단위로 실행됩니다.
if (조건) {
// 이 안의 모든 코드는
// 조건이 참일 때만 실행됨
var a = 10;
console.log(a);
}
실전 연습: 기초 문제와 해결 방법
문제 1: 두 수의 합 구하기
// 1. 첫 번째 숫자 입력받기
var 첫번째 = prompt("첫 번째 숫자를 입력하세요");
// 2. 두 번째 숫자 입력받기
var 두번째 = prompt("두 번째 숫자를 입력하세요");
// 3. 문자열을 숫자로 변환하기
첫번째 = Number(첫번째); // 형 변환
두번째 = Number(두번째); // 형 변환
// 4. 합계 계산하기
var 합계 = 첫번째 + 두번째;
// 5. 결과 출력하기
alert("두 수의 합: " + 합계);
문제 2: 온도 변환하기 (섭씨 → 화씨)
// 1. 섭씨 온도 입력받기
var 섭씨 = prompt("섭씨 온도를 입력하세요");
// 2. 문자열을 숫자로 변환하기
섭씨 = Number(섭씨);
// 3. 섭씨를 화씨로 변환하기 (화씨 = 섭씨 × 9/5 + 32)
var 화씨 = 섭씨 * 9/5 + 32;
// 4. 결과 출력하기
alert("화씨 온도: " + 화씨 + "°F");
문제 3: 합격/불합격 판정하기
// 1. 점수 입력받기
var 점수 = prompt("시험 점수를 입력하세요 (0-100)");
// 2. 문자열을 숫자로 변환하기
점수 = Number(점수);
// 3. 합격 여부 확인하기 (60점 이상)
if (점수 >= 60) {
alert("합격입니다!");
} else {
alert("불합격입니다.");
}
코딩할 때 기억해야 할 핵심 원칙 3가지
1️⃣ "계획 먼저, 코딩은 나중에"
문제를 보면 바로 코딩하지 말고, 먼저 종이에 단계별로 적어보세요. 이것을 의사코드(pseudocode)라고 합니다.
2️⃣ "한 번에 한 단계씩"
전체 문제를 한 번에 해결하려 하지 말고, 한 단계가 제대로 작동하는지 확인한 후 다음 단계로 넘어가세요.
3️⃣ "오류는 학습의 기회"
오류가 발생하면 당황하지 말고, 무엇이 잘못됐는지 생각해보세요. 프로그래밍에서 오류는 자연스러운 부분입니다.
문제가 막막할 때 쓰는 자기 질문 체크리스트
코딩 문제가 주어졌을 때 스스로에게 물어보세요:
- 무엇을 입력받아야 하나요? (숫자? 텍스트?)
- 무슨 계산이 필요한가요? (덧셈? 뺄셈? 비교?)
- 어떤 결정을 내려야 하나요? (if문이 필요한가?)
- 무엇을 출력해야 하나요? (결과? 메시지?)
'JS' 카테고리의 다른 글
[JS] 조건문과 반복문 🌟 (0) | 2025.04.03 |
---|---|
[JS] 조건문 (0) | 2025.04.03 |
[js] 자바스크립트 연산자 (0) | 2025.04.02 |
[JS] 데이터 출력/입력의 핵심 개념 (0) | 2025.04.02 |
[JS] 자바스크립트 데이터 입출력 방식📝 (0) | 2025.04.02 |