※ 책 [혼자 공부하는 자바스크립트]를 공부하며 기록, 정리해 놓은 노트이다.
if 조건문
if 조건문
자바와 마찬가지로 한줄 짜리 실행 문장은 중괄호를 생략 가능하다.
스치듯 지나간 시각 객체 Date의 메소드들
- getFullYear() // 2022
- getMonth() // 1월이면 0을 반환함
- getDate() // 1
- getHours() // 21
- getMinutes() // 18
- getSeconds() // 38
if else 조건문
중첩 조건문
if else if 조건문
- ‘조건’이 한 문장이라면 if 조건문에서 중괄호를 생략해도 된다는 점에 기인하여 중첩 조건문에서 중괄호를 생략한 형태가 if else if 조건문이라고?? 분명 ‘실행’할 문장이 하나일 때 중괄호를 생략할 수 있다고 써져있는데(p131, 133)? 오타를 감안하고 봐도 잘 이해가 가지 않는 설명이다. 패스하자.
- 03-1 문제에서: 언제는 a === b처럼 비교하고 언제는 a == 0처럼 비교하고? (2번 4번, 5번 문제 참조)
switch 조건문과 짧은 조건문
switch 조건문
switch, case, break, default 키워드로 구현한다.
break: break 키워드를 감싼 switch 조건문이나 반복문을 완전히 빠져나간다.
기준이 되는 한 값이 여러 조건으로 딱딱 갈릴 때 사용하면 좋다.
기준값이 범위형으로 갈리는 경우라면 if 조건문을 활용하면 좋다.
한마디로 기준값이 이산분포/카테고리형이다 ⇒ switch 조건문. 기준값이 연속분포/산술형이다 ⇒ if 조건문!!
<script>
// switch 기본 - 입력받은 수가 짝수인지 홀수인지 출력해주는 프로그램
const input = Number(prompt('숫자를 입력하세요.', `숫자`))
switch (input % 2) {
case 0:
alert('짝수입니다')
break
case 1:
alert('홀수입니다')
break
default:
alert('숫자가 아닙니다')
break
}
</script>
조건부 연산자
불 표현식 ? 참일 때 실행할 결과 : 거짓일 때 결과<script>
// 조건부 연산자 - 입력받은 수가 0보다 작은지 큰지 출력해주는 프로그램
const number = Number(prompt('숫자를 입력해주세요.'))
const result = number >= 0 ? '0 이상의 숫자입니다.' : '0보다 작은 수입니다'
alert(result)
</script>유일한 삼항 연산자이기도 함.
짧은 조건문
논리합 연산자(||)를 이용한 짧은 조건문
좌변이 참이면 우변은 검사하지 않고 넘긴다.
불 표현식(오른쪽을 실행할 조건) || 불 표현식이 거짓일 때 실행할 문장보통은 참 값이 될 것이 확실한 상황에서, “혹시라도 false 패밀리가 결과로 뜨게 될 경우 그거 말고 오른쪽의 걸 대신 넣어라” 하고 안전장치를 거는 용도로 활용한다.
이쪽이 참이면 || 이쪽 문장은 실행하지 않는다.이쪽이 거짓이어야 || 이쪽 문장이 실행된다.// 예시: 매개변수로 들어오는 값이 false 또는 false로 변환되는 값이 아니라는 게 확실하다면 구 버전 자바스크립트에서는 이렇게 기본 매개변수를 구현했다.
function earnings (wage, hours) {
wage = wage || 8590
hours = hours || 52
return wage * hours
}
=> 해석:
wage에 1이나 9000같이 어떤 유효한 숫자가 들어왔다 -> wage에 그대로 저장.
wage에 0이나 null 등등의 알아먹을 수 없는 값(false패밀리)이 들어왔다 -> wage에 8590을 대신 저장
=> 이렇게 해도 예를 들어 wage에 '0원' 이런 값이 들어온 경우엔 그대로 '0원'을 저장하게 되는 문제가 있다. 논리곱 연산자(&&)를 이용한 짧은 조건문
좌변이 거짓이면 우변은 검사하지 않고 넘긴다.
결과가 거짓인 불 표현식 && 불 표현식이 참일 때 실행할 문장논리합(||)과는 반대로, 보통 거짓이 될 것이 확실한 상황에서 “혹시라도 true에 해당하는 값이 결과로 오게 될 경우 그거 말고 오른쪽 걸 대신 넣어라” 하고 안전장치를 거는 용도로 활용한다.
짝수와 홀수를 구분하는 프로그램 만들기
다음과 같을 때 타입까지 비교하는 ‘===’ 연산자를 써줘야 한다.
<script>
// if else - 짝수와 홀수 구분하기
const num = Number(prompt('정수를 입력해주세요.'))
if (num % 2 === 0) {
alert(`${num}은 짝수입니다.`)
} else {
alert(`${num}은 홀수입니다.`)
}
</script>- 이상하다. 왜 switch로 구현한 짝홀수 구분은 -3001을 ‘숫자가 아닙니다’라 그러고, 이렇게 if else로 구현한 건 ‘홀수입니다’라고…(03test_3강_조건문.html 파일의 1번 <script> 참고) 아!! -3001의 %2는 -1일 테니까!!!! 해결 완료ㅇㅇ.
학점을 기반으로 별명 붙여주는 프로그램 만들기
<script>
// if else if - 학점을 기반으로 별명 붙여주기
const score = Number(prompt('학점에 기반한 별명을 불러드립니다.', '학점:'))
if (score === 4.5) {
alert('신!!')
} else if (score >= 4.2) {
alert('교수님의 사랑')
} else if (score >= 3.5) {
alert('현 체제의 수호자')
} else if (score >= 2.8) {
alert('일반인')
} else if (score >= 2.3) {
alert('일탈을 꿈꾸는 소시민')
} else if (score >= 1.75) {
alert('오락문화의 선구자')
} else if (score >= 1.0) {
alert('가까이 해선 안될')
} else if (score >= 0.5) {
alert('자벌레;;')
} else if (score > 0) {
alert('플랑크톤')
} else {
alert('시대를 앞서가는 혁명의 씨앗(두둥)')
}
</script>
태어난 연도를 입력받아 띠 출력하는 프로그램
1. “1990년은 경오년, 하얀 말의 해입니다”
1. “1990년은 경오년, 하얀 말의 해입니다”
<script>
// '간'과 '띠'를 조합하여 '신미년'과 같이 출생 연도 계산하기
// 출생 연도를 12로 나눈 나머지가 0부터 원숭이띠이고,
// 출생 연도를 10으로 나눈 나머지가 0부터 '경신임계값을병정무기'이다.
// '갑을'이 파랑, '병정'이 빨강, '무기'가 노랑, '경신'이 하양, '임계'가 검정이므로...
const birth_year3 = Number(prompt('태어난 해의 육십갑자를 계산해드립니다.', '출생연도: '))
// 천간과 색
const 천간 = '경,신,임,계,갑,을,병,정,무,기'.split(',')
const color = '하얀,하얀,검은,검은,푸른,푸른,붉은,붉은,황금,황금'.split(',')
// 지지와 동물 한글명
const 지지 = ('신(申)\n' +
'유(酉)\n' +
'술(戌)\n' +
'해(亥)\n' +
'자(子)\n' +
'축(丑)\n' +
'인(寅)\n' +
'묘(卯)\n' +
'진(辰)\n' +
'사(巳)\n' +
'오(午)\n' +
'미(未)').split('\n')
const zodiac = "원숭이,닭,개,돼지,쥐,소,호랑이,토끼,용,뱀,말,양".split(',')
alert(`${birth_year3}년은 ${천간[birth_year3 % 10]}${지지[birth_year3 % 12]}년,
${color[birth_year3 % 10]} ${zodiac[birth_year3 % 12]}의 해입니다!`)
</script>
2. “정해년은 양력으로 2007,1947년 입니다”
2. “정해년은 양력으로 2007,1947년 입니다”
<script>
// 거꾸로, '정해년'같이 육십갑자를 입력하면 연도를 뱉어주게 만들어보기
const 천간2 = '경,신,임,계,갑,을,병,정,무,기'.split(',')
const 지지2 = '신,유,술,해,자,축,인,묘,진,사,오,미'.split(',')
const color2 = '하얀,하얀,검은,검은,푸른,푸른,붉은,붉은,황금,황금'.split(',')
const sexagesimal_korean = prompt('"정해년"과 같이 육십갑자 연도를 입력하면 서기 연도를 계산해줍니다.', '예) 정해년')
/*
예를 들어 '경신년'을 입력받았다면,
그냥 x % 10 === '경' 이고 x % 12 === '신'이 되는,
2030보다 크지않은 수 2개만 반환하도록 하자.
*/
const result = []
let temp_year = 2030
while (true) {
if (천간2[temp_year % 10] === sexagesimal_korean[0] && 지지2[temp_year % 12] === sexagesimal_korean[1]) {
break
}
if (temp_year < 1970) {
alert('잘못된 육십갑자를 입력하셨습니다')
temp_year = NaN
break
}
temp_year--
}
result.push(temp_year, temp_year-60)
alert(`${sexagesimal_korean}은 양력으로 ${result}년 입니다`)
</script>
3. "황금 용의 해"는 육십갑자로 "무진년"입니다
3. "황금 용의 해"는 육십갑자로 "무진년"입니다
<script>
// '검은 말'의 띠 같이 입력하면 연도를 뱉어주는 것도 만들어보기:
const 천간3 = '경,신,임,계,갑,을,병,정,무,기'.split(',')
const 지지3 = '신,유,술,해,자,축,인,묘,진,사,오,미'.split(',')
const color3 = '하얀,하얀,검은,검은,푸른,푸른,붉은,붉은,황금,황금'.split(',')
/* 예를 들면 '하얀 원숭이(신)'라고 하면 '경신년'은 되지만 '신신년'은 안된다.
반대로 '하얀 닭(유)'이라고 하면 '경유년'은 안되고 '신유년'이 가능하다.
어쨌든 모든 동물마다 색을 배정받을 수는 있다.
=>
그냥 '하얀'이 속한 인덱스(=0,1)을 뽑고,
'닭'에 해당하는 정확한 '지지'를 뽑고,
그 자리가 '지지'배열에서 짝수이면 'color'배열에서도 짝수걸로 가져오면 된다.
*/
const input = prompt('"하얀 원숭이"의 해와 같이 입력하면 해당하는 육십갑자년을 알려드립니다.', '예) 하얀 원숭이')
const zodiac3 = "원숭이,닭,개,돼지,쥐,소,호랑이,토끼,용,뱀,말,양".split(',')
let colored_animal = input.split(' ')
const 지지_index = zodiac3.indexOf(colored_animal[1])
const 천간_index = 지지_index % 2 === 0 ? color3.indexOf(colored_animal[0]) : color3.indexOf(colored_animal[0]) + 1
alert(`"${input}의 해"는 육십갑자로 "${천간3[천간_index]}${지지3[지지_index]}년"입니다`)
</script>
4. “하얀 원숭이의 해는 육십갑자로 경신년, 1980과 1920년입니다”
4. “하얀 원숭이의 해는 육십갑자로 경신년, 1980과 1920년입니다”
마지막으로 이거 만들기!
나중에 함수 배우고 나면 위의 것들을 써서 만들 수 있을 것 같다.
참고:
[책] 혼자 공부하는 자바스크립트 - 윤인성
Uploaded by N2T