앞에서 비교 연산의 결과로 true or false를 얻을 수 있다 배웠는데 여기서 true or false은 숫자와 문자처럼 언어에서 제공하는 데이터 형이다. 불린으로 올 수 있는 값은 true와 false 두가지 밖에 없고 불린은 조건문에서 핵심적인 역할을 한다.
조건문은 if로 시작하며 if뒤 괄호에 조건이 오고, 괄호안에 들어가는 조건을 평가하는데, 그 결과가 true면 코드 블록이 실행된다.
if(ture){
alert('result : true');
} /result : true 이다.
if(false){
alert('result : true');
} /아무것도 출력하지 않는다. if 뒤에 false가 왔기 때문에
if(ture){
alert(1);
alert(2);
alert(3);
alert(4);
}
alert(5);
/12345가 출력된다.
if(false){
alert(1);
alert(2);
alert(3);
alert(4);
}
alert(5);
/5만 출력된다.왜냐하면 if문의 조건이 true이면 중괄호 시작,끝까지의 구간이 실행되고 false
이면 중괄호 구간이 실행되지 않기 때문에 alert(5);만 실행된 것이다.
if문에 else절을 붙일 수 있고 else뒤에 이어지는 코드 블록은 조건이 거짓일 때 실행된다.
if(ture){
alert(1);
} else {
alert(2);
}
/결과는 1이다.
if(false){
alert(1);
} else {
alert(2);
}
/결과는 2이다.
const age = parseInt(promt("How old are you?"));
if(isNaN){
console.log("Please write a number");
} else {
console.log("Thank you for writing your age");
}
/true : prompt에 문자를 넣으면 please wirte a number이 뜨고,
fasle : prompt에 숫자를 넣으면 Thank you for wirting your age가 뜬다.
유사하지만 약간씩 차이가 있는 조건 여러 개를 처리할 때 사용한다. else if의 모든 조건이 false라면 else가 실행된다. else는 생략 가능하다.
if(false){
alert(1);
} else if(ture) {
alert(2);
} else if(ture) {
alert(3);
} else {
alert(4);
}
/결과는 2이다.true가 나오면 그 뒤 조건은 보지 않는다.
if(false){
alert(1);
} else if(false) {
alert(2);
} else if(ture) {
alert(3);
} else {
alert(4);
}
/결과는 3이다.true가 나오면 그 뒤 조건은 보지 않는다.
if(false){
alert(1);
} else if(false) {
alert(2);
} else if(fasle) {
alert(3);
} else {
alert(4);
}
/결과는 4이다.
자바스크립트에는 세 종류의 논리 연산자 ||(or), &&(and),!(not)
이 있습니다.
result = a || b;
모두 false인 경우를 제외하고, 둘 중 하나면 true이면 결과는 항상 true이다.
alert(true || true); //true
alert(false || true); //true
alert(true || false); //true
alert(false || false); //false
result = a && b;
모두가 true일 때 true를 반환한다. 하나라도 false가 있으면, false를 반환한다.
alert(true && true); //true
alert(false && true); //false
alert(true && false); //false
alert(false && false); //false
부정의 의미로, 불린의 값을 역전시킨다. true를 false로 false를 true로 만든다.
result = !value;
NOT 연산자는 인수를 하나만 받고, 다음 순서대로 연산을 수행합니다.
1. 피연산자를 불린형 (true/false)으로 변환한다.
2. 1에서 변환된 값의 역을 반환한다.
alert(!true); //false
alert(!0); //true
NOT을 두개 연달아 사용하면 값을 불린형을 변환할 수 있다.
alert(!!"non-emptu string"); //true
alert(!!null); //false
if(!''){
alert('빈 문자열');
}
if(!undefined){
alert('undefined);
}
if(!''){
alert('빈 문자열');
}
var a;
if(!a){
alert('값이 할당되지 않은 변수');
}
if(!null){
alert('null');
}
if(!NaN){
alert('NaN');
}
while(condition){
//code
//'반복문 본문(body)'이라 불린다.
}
let i = 0;
//종료조건으로 i의 값이 10보다 작다면 true, 같거나 크다면 false가 된다.
while(i < 0){
//반복이 실행될 때마다 coding everybody이 출력된다.
document.write('coding everybody');
//i의 값이 1씩 증가한다 .
i++
}
for(begin; condition; step){
반복해서 실행될 코드
}
아래 반복문을 실행하면 i가 0부터 3이 될때까지(단, 3은 포함하지 않음)
alert( i )가 호출됩니다.
for (let i = 0; i < 3; i++){ //0,1,2가 출력된다.
alert(i);
}
구성 | 요소 | 특징 |
---|---|---|
begin | i = 0 | 반복문에 집일할 때 단 한 번 실행됩니다. |
conditon | i < 3 | 반복마다 해당 조건이 확인됩니다. false이면 반복문을 멈춥니다. |
body | alert( i ) | condition이 truthy일 동안 계속해서 실행됩니다. |
step | i++ | 각 반복의 body가 실행된 이후에 실행됩니다. |
일반적인 반복문 알고리즘
begin을 실행함
👉 (condition이 truthy이면 👉 body를 실행한 후 step을 실행함)
👉 (condition이 truthy이면 👉 body를 실행한 후 step을 실행함)
👉 (condition이 truthy이면 👉 body를 실행한 후 step을 실행함)
👉 ...
반복작업을 중간에 중단시키고 싶을 때 사용할 수 있다.
for (let i = 0; i < 10; i++){
if( i === 5 ) {
break;
}
alert(i);
}
실행을 즉시 중단하면서 반복은 지속되게 할 때 사용할 수 있다.
for (let i = 0; i < 10; i++){
if( i === 5 ) {
continue;
}
alert(i);
}
여러 개의 중첩 반복문을 한 번에 빠져나와야 하는 경우에 사용한다.
for (let i = 0; i < 3; i++){
for (let i = 0; i < 3; i++){
let input = prompt('(${i},${j}의 값', '');
//여기서 멈추고 아래쪽 '완료'가 출력되게 하려면 어떻게 해야할까?
}
}
alert('완료');
for (let i = 0; i < 3; i++){
outer : for (let i = 0; i < 3; i++){
let input = prompt('(${i},${j}의 값', '');
//사용자가 아무것도 입력하지 않거나 cancel 버튼을 누르면 두 반복문 모두를 빠져나온다.
if (!input) break outer;
//입력받은 값을 가지고 무언가를 한다.
}
}
alert('완료');
'무한' 반복문은 보통 while(true)를 사용하는데 여타 반복문과 마찬가지로 break 지시자를 사용해 멈출 수 있다. 현재 실행 중인 반복에서 더는 무언가를 하지 않고 다음 반복으로 넘어가고 싶다면 continue 지시자를 사용하면 된다.
반복문 앞에 레이블을 붙이고, break/continue에 이 레이블을 함께 사용할 수 있다. 레이블은 중첩반복문을 빠져나와 바깥의 반복문으로 갈 수 있게 해주는 유일한 방법이다.
조건문, 논리 연산자까지는 좋았는데 반복문부터 머리가 아프기 시작했다😢
처음 접했을 때보다는 정리하면서 이해가 되긴 했지만 그래도 헷갈리는건 역시나 똑같다😩
정리하고 이 부분은 계속 더 공부해야겠다 아자아자😄