First Step

if

if문은 말 그대로 특정 조건일 때 실행되는 구문을 뜻합니다. 즉, JavaScript 코드로 조건을 제시해주면 그 조건이 성립될 때, 코드가 실행됩니다. 기본 구조는 다음과 같습니다.

if (조건) {
  실행할 코드
}

그럼, JavaScript로 조건을 작성하는 방법을 배워봅시다. JavaScript에는 truthy, **falsy**라는 개념(링크를 확인해주세요)이 있습니다. JavaScript는 조건이 truthy한 값일 때 조건이 성립된다고 해석하며, 조건이 falsy한 값일 때 조건이 성립되지 않는다고 해석합니다. 조건이 성립되는 경우를 몇 가지 살펴봅시다.

if (true) {
  console.log('true!');
}

if (123) {
  console.log('true!');
}

if ([]) {
  console.log('true!');
}

위의 조건문들은 전부 console.log가 작동합니다. 그러면 조건이 성립되지 않는 경우를 몇 가지 살펴봅시다.

if (false) {
  console.log('false!');
}

if (null) {
  console.log('false!');
}

if (undefined) {
  console.log('false!');
}

if (0) {
  console.log('false!');
}

위의 조건문들은 전부 falsy한 경우이므로 console.log가 찍히지 않습니다. 지금까지 간단한 예를 알아보았는데, 공교롭게도 간단한 조건만 존재하지는 않죠. 조금 더 복잡한 경우에는 어떤 식으로 조건을 작성하는지 알아봅시다. 예를 들어, a라는 변수가 1이고, b라는 변수가 2일 때 작동하는 코드를 짜고 싶다면 다음과 같이 작성합니다.

if (a === 1 && b === 2) {
  // 원하는 코드
}

위와 같이 여러 조건을 중복해서 써야할 때에는 비교 연산자논리 연산자를 사용합니다. 비교 연산자 중에서 일치 연산자는 ==과 !=의 사용을 피하고, 대신 ===과 !==을 사용합니다. 그 이유는 ==과 != 연산자는 피연산자들의 타입이 서로 다르면 강제로 타입을 변환하여 비교하기 때문에, 원하지 않는 결과가 나올 수도 있기 때문입니다. 논리 연산자는 여러 조건에 대한 논리를 구성하기 위해 사용합니다. 여기서 논리는 &&(AND), ||(OR), !(NOT)입니다. 간단하게 말해서 && 연산자는 두 조건이 모두 충족됐을 때 통과되고, || 연산자는 두 조건 중 하나라도 충족되면 통과됩니다. ! 연산자는 조건을 뒤집어 줍니다. 즉, truthy한 값에 ! 연산을 하면 false가 나오고, falsy한 값에 ! 연산을 하면 true가 나옵니다. 몇 가지 예를 봅시다.

var a = 1;
var b = 2;

if (a === 1 && b === 2) {
  console.log('Wow!');
}

if (a === 1 || b === 2) {
  console.log('Wow!');
}

if (!a === false) {
  console.log('Wow!');
}

위의 코드들은 모두 console.log가 찍힙니다.


if문 활용하기

1. 큰 수에서 작은 수 빼기

두 수를 정한 후, if문을 이용해 큰 수에서 작은 수를 뺀 값을 console.log로 찍는 코드를 작성해봅시다.

2. 큰 수에서 작은 수를 나누었을 때의 나머지 구하기

두 수를 정하고, if문을 이용해 큰 수에서 작은 수를 나누었을 때의 나머지를

console.log
로 찍어주는 작성해봅시다.

3. 1 ~ N 까지 2의 배수만 더하기

for문과 if문을 이용해 1부터 원하는 숫자까지의 정수 중 2의 배수만 더해주는 코드를 작성해봅시다. 그리고 더한 값을

console.log
로 확인해주세요.

4. 1 ~ N 까지의 정수 중, 3의 배수와 5의 배수만 배열에 넣기

빈 배열을 만들고, for문을 이용해 1부터 원하는 숫자까지의 정수 중 3의 배수와 5의 배수만 배열에 넣는 코드를 작성해봅시다. 그리고 제대로 들어갔는지

console.log
를 이용해 확인해봅시다.

5. 평균을 넘는 학생들의 비율 구하기

var scores = [50, 55, 60, 65, 70, 75, 80, 85, 90, 95, 100];

위와 같이 학생들의 점수가 배열로 주어졌을 때, 평균을 넘는 학생이 몇 %인지 구해봅시다.


학습자료