본문 바로가기
기획자・디자이너를 위한 넓고 얕은 개발 지식/Javascript

5화. 자바스크립트 연산자 완벽정리!

by theblnc 2024. 10. 28.
반응형

자바스크립트 연산자 쉽게 알아보기!

안녕하세요! 오늘은 자바스크립트에서 자주 사용하는 연산자들을 쉽게 설명해드릴게요. 자바스크립트에서 연산자는 숫자를 계산하거나, 값을 비교하거나, 조건을 확인할 때 사용하는 중요한 도구예요. 하나씩 알아볼까요?


1. 더하기 연산자 (+)

더하기 연산자는 두 숫자를 더하는 연산자예요. 예를 들어, 사과 2개와 3개를 더하면 총 5개가 되겠죠?

5 + 3; // 결과: 8

2. 빼기 연산자 (-)

빼기 연산자는 두 숫자를 빼는 연산자예요. 10에서 4를 빼면 6이 남아요.

10 - 4; // 결과: 6

3. 곱하기 연산자 (*)

곱하기 연산자는 두 숫자를 곱하는 연산자예요. 예를 들어, 4와 2를 곱하면 8이 돼요.

4 * 2; // 결과: 8

4. 나머지 연산자 (%)

나머지 연산자나눗셈의 나머지를 구할 때 사용해요. 예를 들어, 7을 3으로 나누면 나머지가 1이 남아요.

7 % 3; // 결과: 1

5. 그리고 연산자 (&&)

그리고 연산자두 조건이 모두 맞을 때 참(true)이라고 판단해요. 즉, 두 개 다 맞아야 참이에요.

true && true; // 결과: true 
true && false; // 결과: false

6. 또는 연산자 (||)

또는 연산자하나라도 맞으면 참(true)이라고 판단해요. 두 개 중 하나만 맞아도 괜찮아요.

true || false; // 결과: true 
false || false; // 결과: false

7. 작거나 같은 연산자 (<=)

작거나 같은 연산자는 두 숫자를 비교해서 첫 번째 값이 작거나 같으면 참(true)이라고 판단해요.

5 <= 10; // 결과: true 
10 <= 10; // 결과: true 
15 <= 10; // 결과: false

 

반응형

8. 같지 않다 ( != )

같지 않다 연산자두 값이 다르면 참(true)이라고 판단해요. 만약 값이 같다면 거짓(false)이에요.

5 != 3; // 결과: true (값이 다르니까 맞아요) 
5 != 5; // 결과: false (값이 같으니까 틀려요)

9. 완전히 같지 않다 ( !== )

완전히 같지 않다 연산자값과 타입이 둘 다 다를 때 참(true)라고 판단해요. 값이 같아도 타입이 다르면 참이에요.

5 !== "5"; // 결과: true (값은 같지만, 타입이 다르니까 맞아요) 
5 !== 5; // 결과: false (값과 타입이 모두 같으니까 틀려요)

10. 같다 ( == )

같다 연산자값만 같으면 참(true)이라고 판단해요. 숫자와 문자열도 값이 같으면 참이에요.

5 == "5"; // 결과: true (숫자 5와 문자열 "5"는 값이 같으니까 맞아요) 
5 == 5; // 결과: true

11. 완전히 같다 ( === )

완전히 같다 연산자값과 타입이 모두 같아야 참(true)라고 판단해요. 값이 같아도 타입이 다르면 거짓이에요.

5 === "5"; // 결과: false (값은 같지만 타입이 다르니까 틀려요) 
5 === 5; // 결과: true (값과 타입이 모두 같아요)
 

결론

  • +: 더하기
  • -: 빼기
  • *: 곱하기
  • %: 나머지 구하기
  • &&: 둘 다 맞아야 참
  • ||: 하나만 맞아도 참
  • <=: 작거나 같으면 참
  • !=: 값이 다르면 참
  • !==: 값이나 타입이 다르면 참
  • ==: 값만 같으면 참
  • ===: 값과 타입이 모두 같아야 참

이제 자바스크립트에서 사용하는 다양한 연산자들이 어떤 역할을 하는지 쉽게 알겠죠? 😊 여러분도 직접 써보면서 더 재미있게 자바스크립트를 배워보세요!

반응형