Today's JavaScript
조건문 반복문
세미콜론 ; 위치가 헷갈리고, console.log() 를 어디에 둬야하는지 잘 모르겠다,,
계속 쓰다보면 익숙해지겠지? 하는 생각에 예시 코드도 한번씩 다시 써본다
종합문제도 풀어봤는데 엉겁결에 다맞움🤭
근데 왜 다 맞았는지 설명을 해보시오 하면 못 할 것 같아서 내일 다시 한 번 풀어볼 생각이다!
조건문
특정한 조건에 따라 코드 실행되도록 할 수 있는 것
if문
- 조건문 중 가장 대표적인 if문
- 주어진 조건식의
true,false여부에 따라 실행 결정 - 그런데
true,false이거는 javascript 에서Boolean 타입이니까 - 조건식 결과가
boolean 타입이 되도록 작성해야 함 if문은else문없이 단독적으로 사용 가능
🚨🚨 실수하지 말자
if문안에는;넣지 말기!
에러가else라고 나와도 이게 명확한 문자가 나오는게 아니고 맥락으로 안내할 때가 있다
let num = 3; // number 리턴은 숫자로, string 리턴은 '', boolean 리턴은 없어도 돼
if (num <= 9 && num >= 2); { // 소괄호 ) 뒤에 ; 넣으면 안돼!!!!!
console.log(num * 1);
...
console.log(num * 9);
} else {
console.log('2와 9사이의 수를 입력하세요.');
} // if 문 ) 괄호 마지막에 ; 이거 넣었더니 else 에러남
SyntaxError: Unexpected token 'else'- 근데 이런 에러는
;이거 찍어야되는데:이거 찍은 경우에도 에러가 나와
SyntaxError: Unexpected token ':'동치연산자 (===)
두 피연산자 동일하면 true 아니면 false
!== 는 반대로
let name = 'kimcoding';
if (name === 'kimcoding') {
console.log('중복된 이름입니다.'); // 중복된 이름입니다.
}
let name = 'parkcode';
if (name !== 'kimcoding') {
console.log('가입할 수 있는 이름입니다.'); // 가입할 수 있는 이름입니다.
}비교연산자 (> , < , >= , <=), 논리연산자(||, &&), 부정연산자(!)
📎📎 연습문제
age가 19보다 크고, job이 student가 아닐 경우 코드가 실행되도록 조건식 작성
let age = 25;
let job = 'sw engineer';
if (age > 19 && job !== 'student') {
console.log('조건 만족') // 조건 만족
}//비교연산자(>), 논리연산자(논리곱&&), 동치연산자 사용else문
- 조건이
true,false일때 각각 다른 코드 실행 - 독립적 사용x,
if문바로 뒤에 작성해야 함 - 조건 더 추가 시
else if문사용(여러번 사용 가능) if문과else문은 한번밖에 사용 안됨ifelse ifelse순서
let num = 5;
if (num % 2 === 0) {
console.log ('짝수');
} else {
console.log ('홀수');
}switch문
- 동일한 조건 값에 따라 다른 명령을 실행할 수 있게 분기
- 조건에 따라 분기하는건 if문과 비슷하지만, 맞는 조건을 만나면
break로 루프를 벗어날 수 있다.
⇒ 조건이 일치하는 케이스 확인 > break 까지의 명령 실행하고 조건문 나오기 switch옆 () 안에 조건 지정,case 값:형식으로 참이 될 케이스 작성switch는break를 누락하면break만날때까지 내부 모든 코드를 실행
⇒ 각 케이스 정의할 때 break 명령어가 짝을 이뤄야 함 (defalt 제외)- if === switch , if, elseif === case 값: , else === defalt 느낌?
// if 문
let number = 10;
if(number % 2 === 0) {
console.log('짝수입니다')
} else {
console.log('홀수입니다')
}
// switch 문
let number = 10;
switch(number % 2) {
case 0:
console.log('짝수입니다')
break;
case 1:
console.log('홀수입니다')
break;
}반복문
불필요한 코드를 반복적으로 사용하지 않고 간결하게 코드를 작성
우리가 의도한 만큼 같은 동작 반복
for문
- javascript의 대표적인 반복문
for문 의 형식
초기값: 증감식 반복횟수를 카운트 하는 역할을 하는 변수
(이때 변수는 정수를 의미하는 integer의 약자인i를 주로 사용)
초기값은 반복문의 코드블록 내부에서만 유효조건식: 코드블록 내부의 코드 실행 여부를 결정.
true일 경우 코드 실행,false경우 반복문 종료증감식: 코드블록 내부의 코드를 실행 후 초기값으로 선언된 변수를 증가 또는 감소시키기 위한 표현식
for (초기값; 조건식; 증감식) {
//실행할 코드
}
//초기값 : 초기값 (i)을 선언하고 1을 할당
for (let i = 1; 조건식; 증감식) {
console.log (i);
}
//조건식 : i가 3보다 작거나 같을 경우 코드 실행, 3보다 클 경우 반복문 종료
for (let i = 1; i <= 3; 증감식) {
console.log (i);
}
//증감식 : 코드가 실행될 때마다 i가 1씩 증가
for (let i = 1; i <= 3; i++) {
console.log (i); // 1 2 3
}📎📎 연습문제
0부터 10까지 숫자를 출력하는 코드를 반복문으로
for (let i = 0; i <= 10; i++) {
console.log(i); // 0 1 2 3 4 5 6 7 8 9 10
}반복문 활용
if 를 for 로 간단하게 정리
let num = 3;
if (num >= 2 && num <= 9) {
console.log(num * 1); //3
console.log(num * 2); //6
...
console.log(num * 9); // 27
} else {
console.log('2와 9사이의 수를 입력하세요.');
}
--------^^^^^^---------
let num = 3
if (num >= 2 && num <= 9) {
for (i=1; i <= 9; i++) {
console.log(num * i)
}
} else {
console.log('2와 9사이의 수를 입력하세요.');
}continue
전체 반복문이 아닌 현재 반복문을 종료하고 다음 반복으로 넘기는 명령어
for(let i = 0; i < 10; i++) {
if (i === 5) {
continue;
}
console.log(i); // 0 1 2 3 4 6 7 8 9
}⇒ i 값이 5인 경우 출력하지 않고 다음 차례 반복으로 넘어감
break
보통 반복문은 주어진 조건의 결과값이 거짓일때 빠져아노는데
break 명령어는 조건 관계 없이 원하는 지점에서 빠져나올 수 있다.
for(let i = 0; i < 10; i++) {
if (i === 5) {
break;
}
console.log(i); // 0 1 2 3 4
}⇒ i 값이 5인 경우 출력하지 않고 다음 차례 반복으로 넘어감
문자열과 반복문
인덱스(index)
문자열의 각 문자 순서 찾기
특정 문자의 인덱스를 확인하는 메서드 indexOf()
let str = 'kimcoding';
console.log (str[0]); // k
console.log (str[3]); // c
-----------------
let str = 'kimcoding';
console.log (str.indexOf('k')); // 0
console.log (str.indexOf('o')); // 4
console.log (str.indexOf('l')); // -1 (찾는 문자열이 없는 경우 -1 리턴)길이(length)
문자열의 길이는 문자열 뒤에 .length 붙여 조회 가능
let str = 'kimcoding';
console.log (str.length); // 9for문으로 문자열의 처음부터 끝까지 출력 코드 구하면 변수 i가 0부터 8까지 1씩 증가하며 반복문 실행
let str = 'kimcoding';
for (let i=0; i <= 8; i++) {
console.log (str[1]);
}그런데 위에 처럼 구현하려면 문자열의 길이를 알고 있어야 함
만약 문자열의 길이가 매우 길거나 알 수 없다면 아래 처럼 구현해야 함
문자열의 마지막 문자의 인덱스는 문자열 길이보다 1만큼 작으니
i <= str.length -1 또는 i < str.length 로 조건식 작성
let str = 'kimcoding';
for (let i=0; i <= str.length - 1; i++) {
console.log (str[1]);
}반복문과 조건문
- 반복이 진행되는 동안
특정 조건에 따라 문제를 해결하도록 코드 작성하면 복잡한 문제를 해결 가능
(특정한 조건은 조건문의 성격)
📎📎 연습문제
0부터 10까지 숫자 중 홀수만 출력되도록 코드 작성
for (let i = 1; i <= 10; i++) { // i 가 10까지 실행된 후 11 에서 반복문 종료
if (i % 2 === 1) { // i를 2로 나누었을때 나머지가 1이라면(홀수 여부 확인)
console.log(i); // 1 3 5 7 9
}
}📎📎 연습문제
0부터 10까지 숫자 중 홀수인지 짝수인지 여부 확인
for (let i = 1; i <= 10; i++) { // i 가 10까지 실행된 후 11 에서 반복문 종료
if (i % 2 === 1) { // i를 2로 나누었을때 나머지가 1이라면(홀수 여부 확인)
console.log(`${i}는 홀수`);
} else {
console.log(`${i}는 짝수`);
}📎📎 연습문제
주어진 문자열의 문자들 중 인덱스가 짝수인 문자만 출력하도록 코드 구현
변수 str에 할당된 문자열의 모든 문자를 순회하도록 for문 작성
let str = 'software engineering bootcamp';
for (let i = 0; i < str.length; i++) {
// 문자열 0번째 부터 i가 str 변수명의 길이보다 작으면 1씩 더해라
if (i % 2 === 0) { // 만약 i 숫자가 2로 나눴을 때 0이면(짝수)
console.log(str[i]);
}
}이중반복문
- 반복문은 중첩이 가능. 다시 말해 반복문 내부에 또 다른 반복문 사용 가능
📎📎 연습문제
이중반복문으로 구구단 전체를 출력하는 코드 구현
for (let i = 2; i <= 9; i++) {
console.log(`${i}단`);
for (let j = 1; j <= 9; j++) {
console.log(`${i} x ${j} = ${i*j}`);
}while문
- 또 다른 반복문
- 조건이 만족할 동안 내부 코드를 반복
for문은 초기화,조건식, 증감식이 전부 필요
Butwhile문은조건식만 입력 후조건식의 결과가true이면 코드블록 내부의 코드를 반복 실행- while문 참조링크
let num = 0; // 초기화
while (num < 3) { // 조건문
console.log(num); // 결과값 : 0 1 2
num ++ // 증감식
} // 초기화를 while문 위에, 증감식은 while문 내부에while문은 무한루프에 주의.
반복문이 종료되는조건식이 항상true면무한루프발생
while문은 조건식이false로 평가되는 순간이 반드시 있어야 함- 조건문에
true가 들어가는 코드를 작성할 땐,break문사용해서 반복문 끝나는 조건 명시
let i = 1; // 초기화
while(true) { // 조건문 (true면 계속 돌아라)
const text = i + '번 째 반복문<br>';
document.write(text);
if(i == 5) {
break;
} // while문이 끝나는 조건 (i 가 5 면 종료)
i++; // 증감식
}do...while문 과 while문의 차이
do...while문은while문과 비슷하지만,조건문판단 전에do블록의 코드를먼저실행
조건문이true면do블록 코드다시실행, 이 과정 반복- do while문 참조링크
let i = 1; // 초기화
do { // 반복할 코드
const text = i + "번 째 반복문<br>";
document.write(text);
i++;
}
while (i <= 5); // 조건문차이점
처음 while문 실행 했을 때 결과가 false 면 내부의 코드블록은 한번도 실행되지 않을 수 있지만
do...while문 은 조건문의 결과와 상관없이 무조건 do 블록의 코드가 최소 1번은 실행
// do..while문
let i = 0;
do {
console.log ('코드블록 내부의 코드 최소 한번 실행')
i++
} while (false) // 조건문 'false' 와 관계없이 콘솔 결과값 한번 실행
--------
// while문
while (false) { // 조건문
console.log ('코드블록 내부의 코드 최소 한번 실행')
} // 조건문 'false' 라 결과값 실행 x
// 만약 조건문 'true' 면 무한루프 발생for문 과 while문의 차이
-
for문사용 하는 경우- 반복 횟수가 비교적
명확할 때 - 배열, 문자열 내부 순회할 때
이중반복문이 필요할 때
- 반복 횟수가 비교적
-
while문사용 하는 경우- 반복 횟수가
불명확할 때
- 반복 횟수가
