JavaScript

[JS] 코딩테스트 014~017 - 자바스크립트 연산자 정리, NOT 연산자

Irene1988 2025. 2. 16. 19:25
제14 : 3의 배수 인가요?
영희는 친구와 게임을 하고 있습니다.
서로 돌아가며 랜덤으로 숫자를 하나 말하고 그게 3의 배수이면 박수를 치고 아니면
그 숫자를 그대로 말하는 게임입니다.

입력으로 랜덤한 숫자 n이 주어집니다.

만약 그 수가 3의 배수라면 '짝'이라는 글자를,
3의 배수가 아니라면 n을 그대로 출력해 주세요.

입출력

입력 : 3
출력 : 짝

입력 : 2
출력 : 2

 

1. prompt를 이용하여 값을 받는다.

2. 입력받은 값에 대해서 3의 배수인지 판단을 해야 한다. % 나머지 연산을 이용한다.

3. if문을 이용하여 출력조건을 작성한다.

const n = prompt("입력");

if(n%3 == 0 && n != 0){
    console.log("짝");
} else {
    console.log(n);
}

 


문제15 : 자기소개
신학기가 시작되고, 아이들이 돌아가면서 자기소개를 하기로 했습니다.

만약 입력으로 김다정이라는 이름이 주어지면
"안녕하세요. 저는 김다정입니다."라고 출력하게 해주세요.

 

const inputName = prompt('이름입력');

console.log(`안녕하세요! 저는 ${inputName}입니다!`);

문제16 : 로꾸거
문장이 입력되면 거꾸로 출력하는 프로그램을 만들어 봅시다.

 

* 입력한 문자열을 배열을 만든다음에 이걸 거꾸로 처리를 해야한다.

순서를 차분하게 정리해보자!

1. 문자를 입력받는다. => prompt 사용

2. 입력받은 문자를 배열로 만든다. => split('') : 문자열을 배열로 변환

3. 위 배열을 거꾸로 한다. => reverse() 사용: 배열순서 뒤집기

4. reverse()를 사용한 배열을 다시 문자열로 만든다 => join('') 사용

const inputText = prompt('문자입력');
console.log(inputText.split('').reverse().join(''));

 

https://irene2023.tistory.com/23

 

[JS] 코딩테스트 001~003 - 배열개념 정리

자바스크립트의 배열(Array) 은 여러 개의 값을 하나의 변수에 저장할 수 있는 객체 타입입니다. 배열의 선언 방법let arr1 = []; // 빈 배열let arr2 = [1, 2, 3, 4, 5]; // 숫자 배열let arr3 = ["apple", "banana", "ch

irene2023.tistory.com


문제17 : 놀이기구 키 제한

유주는 놀이공원 아르바이트 중입니다.
그런데 놀이기구마다 키 제한이 있습니다.
유주가 담당하는 놀이기구는 키가 150cm 이상만 탈 수 있습니다.

입력으로 키가 주어지면 키가 150이 넘으면 YES를
틀리면 NO를 출력하는 프로그램을 작성하세요.

 

const inputHeight = prompt('키 입력');

if(inputHeight >= 150){
    console.log('YES');
} else {
    console.log('NO');
}

 

좀 더 코드를 보강하면서 재복습

// 1. 키를 입력받는다.
// 2. 입력받은 키에 대한 조건문을 작성한다.
let height = Number(prompt('키 입력'));

if(isNaN(height)){
    alert('숫자를 입력해야 합니다!');
} else if(height>=150) {
    console.log('YES');
} else {
    console.log('NO');
}

1.Number(prompt('키 입력')) 을 사용해 입력 값을 숫자로 변환

2.입력값이 숫자가 아닐 경우 예외 처리 추가

 

삼항연산자를 활용하기

let height = Number(prompt('키 입력'));

console.log(isNaN(height) ? '숫자를 입력하세요!' : height >= 150 ? 'YES' : 'NO');

삼항연산자는 은근 자주 사용된다. 무엇보다 리액트 실무에서 자주 사용되니 잘 알아두자!


🔹 자바스크립트 연산자 종류

1️⃣ 산술 연산자 (Arithmetic Operators)

 

  • + : 더하기
  • - : 빼기
  • * : 곱하기
  • / : 나누기
  • % : 나머지 연산자
  • ** : 거듭제곱 (ES6부터 지원)

 


2️⃣ 대입 연산자 (Assignment Operators)

 

  • = : 대입
  • += : 더한 후 대입
  • -= : 뺀 후 대입
  • *= : 곱한 후 대입
  • /= : 나눈 후 대입
  • %= : 나머지를 구한 후 대입

 


3️⃣ 비교 연산자 (Comparison Operators)

 

  • == : 값이 같으면 true
  • === : 값과 타입이 모두 같으면 true
  • != : 값이 다르면 true
  • !== : 값 또는 타입이 다르면 true
  • > : 초과
  • < : 미만
  • >= : 이상
  • <= : 이하

 


4️⃣ 논리 연산자 (Logical Operators)

  • && : AND 연산 (둘 다 true여야 true)
  • || : OR 연산 (하나라도 true면 true)
  • ! : NOT 연산 (true → false, false → true)

🔸 나머지 연산자 (%) 자세히 알아보기

% 연산자는 나누기 후 남은 나머지를 반환하는 연산자

기본적인 예제

console.log(10 % 3); // 1  (10을 3으로 나누면 몫 3, 나머지 1)
console.log(15 % 4); // 3  (15를 4로 나누면 몫 3, 나머지 3)
console.log(9 % 2);  // 1  (9를 2로 나누면 몫 4, 나머지 1)
console.log(8 % 2);  // 0  (8을 2로 나누면 나머지 0)

짝수, 홀수 판별

function isEven(num) {
  return num % 2 === 0; // 나머지가 0이면 짝수
}

console.log(isEven(4)); // true
console.log(isEven(7)); // false

배수 판별

어떤 숫자가 특정 수의 배수인지 확인할 때도 % 연산자를 사용해요.
예를 들어, 10이 5의 배수인지 확인하려면:

console.log(10 % 5 === 0); // true (10은 5의 배수)
console.log(14 % 5 === 0); // false (14는 5의 배수가 아님)

 


순환 패턴 만들기

% 연산자를 활용하면 일정한 패턴을 만들 수 있다.

for (let i = 0; i < 10; i++) {
  console.log(i % 3); // 0, 1, 2, 0, 1, 2, 0, 1, 2, 0
}

이런 식으로 나머지를 이용하면 주기적인 반복 패턴을 만들 때 유용하다.


 ✅ 추가 팁: 음수에서의 나머지 연산

자바스크립트에서 % 연산자는 부호를 유지하므로, 음수를 다룰 때 주의해야 해요.

console.log(-10 % 3); // -1
console.log(10 % -3); // 1

 

일반적으로 양수로 변환할 경우에는 아래처럼 처리하면 돼요.

console.log(Math.abs(-10) % 3); // 1

✨ 정리

  • % 연산자는 나누기 후 나머지를 반환
  • 짝수/홀수, 배수 판별 등에 사용 가능
  • 반복 패턴을 만들 때 유용
  • 음수 값을 다룰 때 주의 필요

🔸 NOT (!) 연산자 자세히 알아보기

✔ 기본 개념 

! 연산자는 논리값을 반대로 뒤집는 역할을 해요.

console.log(!true);  // false
console.log(!false); // true

즉, true → false, false → true 가 됩니다.

 

예제: 조건 반전하기

예를 들어, 어떤 변수가 true일 때 특정 작업을 하지 않도록 하고 싶다면?

let isLoggedIn = true;

if (!isLoggedIn) {
  console.log("로그인이 필요합니다.");
} else {
  console.log("환영합니다!");
}
// 결과: "환영합니다!" (isLoggedIn이 true니까 NOT 연산 후 false가 되어 else 실행)

!isLoggedIn은 false가 되므로 if 문이 실행되지 않고, else가 실행됩니다.


🔸 NOT 연산자의 활용법

✅ 1. !! (이중 NOT 연산) → Boolean 변환

자바스크립트에서 !을 두 번 사용하면 **"true 또는 false로 변환"**하는 효과가 있어요.

console.log(!!"Hello");  // true  (문자열이 존재하므로 true)
console.log(!!0);        // false (0은 false 값)
console.log(!!null);     // false
console.log(!!undefined); // false
console.log(!!{});       // true  (빈 객체도 true)
console.log(!![]);       // true  (빈 배열도 true)

💡 !! 연산자는 값을 명확하게 true 또는 false로 변환할 때 유용

 

✅ 2. NOT 연산자로 "비어있는 값" 확인하기

어떤 값이 **"없다"**는 것을 판별할 때 !을 사용하면 편리

let username = "";

if (!username) {
  console.log("이름을 입력하세요!"); 
} else {
  console.log(`안녕하세요, ${username}!`);
}
// 결과: "이름을 입력하세요!" (username이 빈 문자열이라 false가 됨)

💡 !username은 true이므로, "이름을 입력하세요!"가 출력


🔥 결론

 

  • ! 연산자는 논리 값을 반대로 뒤집는 연산자
  • !!을 사용하면 Boolean 변환
  • 조건문에서 값이 비었는지 확인하는 용도로 많이 사용됨

 

 

 

 

*위 포스팅은 챗GPT 답변을 기반으로 작성되었습니다.