[코드스테이츠 FE 45기] _2023.04.19 _ Day 7

---

오늘은 Day 7

2023년 04월 19일

오늘도 자바스크립트!! 

오늘은 오전 9시부터 12시 전 까지는 자습시간이다.

오늘도 자습을 시작해 보자!!

오늘도!

오후에는 페어분과 코드 리뷰를 하고 

나머지 시간에는 자습및 복습을 할 생각이다.

---

조건문 if문

if문은 주어진 조건식이 참인 경우에 코드 블록을 실행하는 제어문입니다. 다음은 if문의 기본 구문입니다.

 

if (condition) {
  // code block to be executed if the condition is true
}

위의 구문에서 condition은 true 또는 false를 평가할 수 있는 표현식입니다. 만약 condition이 true라면 코드 블록이 실행됩니다.

 

if문은 조건이 참일 때 실행할 코드 블록 이외에도, 조건이 거짓일 때 실행할 코드 블록도 추가할 수 있습니다. 이 경우에는 else문을 사용합니다.

if (condition) {
  // code block to be executed if the condition is true
} else {
  // code block to be executed if the condition is false
}

또한, else문 대신에 else if문을 사용하여 여러 개의 조건을 체크할 수도 있습니다.

if (condition1) {
  // code block to be executed if condition1 is true
} else if (condition2) {
  // code block to be executed if condition1 is false and condition2 is true
} else {
  // code block to be executed if both condition1 and condition2 are false
}

이와 같이 if문은 다양한 조건을 체크하여 코드를 실행할 수 있도록 해줍니다.

---

동치연산자 (===)

동치 연산자(===)는 값 뿐만 아니라 값의 데이터 타입도 비교합니다. 좌항과 우항의 값과 데이터 타입이 모두 일치하면 true, 그 외의 경우에는 false를 반환합니다.

 

예를 들어, 다음과 같이 숫자 타입과 문자열 타입을 비교하는 경우를 생각해보겠습니다.

1 === 1 // true
1 === "1" // false

첫 번째 비교에서는 좌항과 우항의 값과 데이터 타입이 모두 일치하므로 true를 반환합니다. 그러나 두 번째 비교에서는 좌항의 값은 숫자 1이지만 우항의 값은 문자열 "1"입니다. 따라서 데이터 타입이 다르므로 false를 반환합니다.

 

동치 연산자를 사용할 때는 데이터 타입도 비교한다는 점에 주의해야 합니다. 데이터 타입까지 비교하지 않아도 되는 경우에는 동등 연산자(==)를 사용할 수 있습니다. 하지만 가능하면 동치 연산자(===)를 사용하는 것이 좋습니다.

---

비교연산자(> , < , >= , <=)

비교 연산자는 주어진 두 값의 크기를 비교하여 Boolean 값을 반환합니다.

 

연산자	설명
>	좌항의 값이 우항의 값보다 큰 경우 true, 그렇지 않은 경우 false를 반환합니다.
<	좌항의 값이 우항의 값보다 작은 경우 true, 그렇지 않은 경우 false를 반환합니다.
>=	좌항의 값이 우항의 값보다 크거나 같은 경우 true, 그렇지 않은 경우 false를 반환합니다.
<=	좌항의 값이 우항의 값보다 작거나 같은 경우 true, 그렇지 않은 경우 false를 반환합니다.

예제)

console.log(5 > 3); // true
console.log(10 < 5); // false
console.log(7 >= 7); // true
console.log(3 <= 1); // false

위 예시에서

1. 5 > 3은 좌항의 값인 5가 우항의 값인 3보다 크기 때문에 true를 반환합니다.
2. 10 < 5는 좌항의 값인 10이 우항의 값인 5보다 작기 때문에 false를 반환합니다.
3. 7 >= 7은 좌항과 우항의 값이 같기 때문에 true를 반환합니다.
4. 3 <= 1은 좌항의 값인 3이 우항의 값인 1보다 크기 때문에 false를 반환합니다.

 

---

논리연산자( && ,  ||  , ! )

논리합(||)과 논리곱(&&)을 사용하면 복수의 조건을 작성할 수 있습니다. ||은 여러 조건 중 하나만 true여도 true로 판단됩니다.

&&은 여러 조건 중 하나라도 false이면 false로 판단됩니다.

연산자		설명
논리곱 (AND)	&&	좌항과 우항의 값이 모두 true이면 true, 그 외에는 false를 반환합니다.
논리합(OR)	||	좌항 또는 우항의 값이 true이면 true, 그 외에는 false를 반환합니다.
부정 (NOT)	!	단항 연산자로, 피연산자의 논리 값을 반대로 반환합니다.

let x = 10;
let y = 5;

// && 연산자
if (x > 5 && y > 3) {
  console.log("x는 5보다 크고, y는 3보다 큽니다.");
} else {
  console.log("조건이 충족되지 않습니다.");
}

// || 연산자
if (x > 5 || y > 10) {
  console.log("x는 5보다 크거나, y는 10보다 큽니다.");
} else {
  console.log("조건이 충족되지 않습니다.");
}

위 코드에서는 && 연산자를 사용하여 x가 5보다 크고 y가 3보다 큰지, || 연산자를 사용하여 x가 5보다 크거나 y가 10보다 큰지를 판별하고 있습니다.

---

else문

else 문은 if 문과 함께 사용되며, if 조건식이 false일 경우 실행됩니다.

즉, if 조건식이 true이면 if 코드 블록이 실행되고, false이면 else 코드 블록이 실행됩니다.

 

아래는 if 문과 else 문을 사용하여 양수, 음수, 0을 판별하는 예제 코드입니다.

let num = -5;

if (num > 0) {
  console.log("양수입니다.");
} else if (num < 0) {
  console.log("음수입니다.");
} else {
  console.log("0입니다.");
}

위 코드에서 num 변수의 값이 -5 이므로 num < 0 조건식이 true가 되어 else if 코드 블록이 실행되고, "음수입니다."가 출력됩니다.

 

 

else문은 독립적으로 사용할 수 없고, if문 바로 뒤에 작성해야 합니다. 여기서 조건을 더 추가하고 싶으면 else if문을 사용합니다.

let name = 'kimcoding';
let course = 'seb be'

if(name === 'kimcoding' && course === 'seb fe') {
	console.log('정보가 일치합니다.')
} else if (name === 'kimcoding' && course !== 'seb fe') {
	console.log('코스를 확인하세요.') // '코스를 확인하세요.'
} else {
	console.log('일치하지 않는 정보입니다.')
}

if문과 else문은 두 번 이상 사용할 수 없지만 else if문은 여러 번 사용이 가능합니다.

let age = 15;
if (age < 8) {
  console.log('미취학아동입니다.');
} else if (age >= 8 && age < 14) {
  console.log('초등학생입니다.');
} else if (age >= 14 && age < 17) {
  console.log('중학생입니다.'); // '중학생입니다.'
} else if (age >= 17 && age < 20) {
  console.log('고등학생입니다.');
} else {
  console.log('성인입니다.');
}

---

삼항 조건 연산자

삼항 조건 연산자는 condition ? expression1 : expression2의 형태를 갖습니다.

 

• condition은 true 또는 false로 평가되는 표현식입니다.
• expression1은 condition이 true일 때 반환할 값입니다.
• expression2는 condition이 false일 때 반환할 값입니다.

예를 들어, x와 y가 주어졌을 때, x가 y보다 크면 "x is greater than y"를 출력하고, 그렇지 않으면 "y is greater than or equal to x"를 출력하는 코드를 삼항 조건 연산자를 이용하여 작성하면 다음과 같습니다.

const x = 10;
const y = 5;

x > y ? console.log("x is greater than y") : console.log("y is greater than or equal to x");

위 코드는 x가 y보다 크기 때문에 "x is greater than y"를 출력합니다.

---

반복문

for문

**반복문을 사용하면 불필요한 코드를 반복적으로 사용하지 않고 간결하게 코드를 작성할 수 있습니다.**

for문은 특정 코드 블록을 반복적으로 실행할 때 사용하는 반복문입니다. 일반적으로 for문은 특정 횟수만큼 반복하는 경우에 사용합니다.

 

for문은 다음과 같은 형식으로 이루어져 있습니다.

for (초기값; 조건식; 증감식) {
	// 실행할 코드
}

이렇게 for문을 사용하면 코드를 몇 번 반복하여 실행할지 결정할 수 있습니다. 조건식만 바꾸면 되기 때문에 1부터 5까지의 합을 구하는 코드와, 1부터 100,000까지의 합을 구하는 코드는 큰 차이가 없습니다.

 

for문의 각 부분에 대한 설명은 다음과 같습니다.

• 초기화식: for문이 시작될 때 단 한 번 실행되는 식으로, 일반적으로 반복 변수의 초기값을 설정합니다.
• 조건식: 반복문이 실행될 조건을 지정하는 식으로, 조건식이 참(true)일 경우에만 코드 블록이 실행됩니다.
• 증감식: 코드 블록이 실행된 후에 실행되는 식으로, 반복 변수의 값을 증가시키거나 감소시키는 등의 역할을 합니다.

 

for (let i = 0; i < 5; i++) {
  console.log(i);
}

위의 코드는 0부터 4까지의 정수를 출력하는 예제입니다.

반복 횟수는 초기화식에서 i 변수를 0으로 초기화하고, 조건식에서 i 변수가 5보다 작은 경우에만 반복하도록 설정하였습니다.

증감식에서는 i 변수를 1씩 증가시키도록 설정하였습니다.

따라서, for문이 총 5번 반복되며, 0부터 4까지의 정수가 출력됩니다.

 

 

---

내일은 이어서 while 반복문을 공부할 것이다!