[JavaScript] #07 Javascript 기본문법, JavaScript 연산자 완전 정리! 종류별 예제와 함께 배우기

2025. 10. 4. 13:00·Web Front/JavaScript
반응형

 

 

토스트데브입니다!
이번 글에서는 JavaScript의 연산자(Operators)에 대해 알아보겠습니다.
연산자는 값을 계산하거나 비교하고 조합하는 데 필수적인 문법 요소입니다.

JavaScript에서는 다양한 연산자가 있으며, 각 연산자는 특정한 역할을 가지고 있어요. 지금부터 하나씩 알아볼까요?

 

 

➕ 1. 산술 연산자 (Arithmetic Operators)

숫자 계산에 사용하는 기본적인 연산자입니다.

연산자 설명 예제
+ 더하기 5 + 2 → 7
- 빼기 5 - 2 → 3
* 곱하기 5 * 2 → 10
/ 나누기 5 / 2 → 2.5
% 나머지 5 % 2 → 1
** 거듭제곱 (ES6) 2 ** 3 → 8

 

 

🔁 2. 대입 연산자 (Assignment Operators)

변수에 값을 할당할 때 사용하는 연산자입니다.

연산자 설명 예제
= 대입 x = 10
+= 더한 후 대입 x += 5 → x = x + 5
-= 뺀 후 대입 x -= 3
*= 곱한 후 대입 x *= 2
/= 나눈 후 대입 x /= 4
%= 나머지를 대입 x %= 2

 

 

⚖️ 3. 비교 연산자 (Comparison Operators)

두 값을 비교해서 불리언(true/false) 결과를 반환합니다.

연산자 설명 예제
== 값만 비교 5 == '5' → true
=== 값과 타입까지 모두 비교 5 === '5' → false
!= 같지 않음 (값만 비교) 5 != '5' → false
!== 값 또는 타입 다름 5 !== '5' → true
> 크다 10 > 5 → true
< 작다 3 < 7 → true
>= 크거나 같다 5 >= 5 → true
<= 작거나 같다 4 <= 3 → false
🔍 항상 ===와 !==를 사용하는 것이 권장 됩니다. (암묵적 형 변환 방지)

 

 

🔀 4. 논리 연산자 (Logical Operators)

조건문이나 여러 불리언 값을 조합할 때 사용됩니다.

연산자 설명 예제
&& AND (그리고) true && false → false
`   `
! NOT (부정) !true → false

 

 

🧱 5. 타입 연산자

typeof – 값의 타입을 반환

typeof 123        // "number"
typeof "hello"    // "string"
typeof true       // "boolean"

instanceof – 해당 객체가 어떤 생성자 함수로부터 만들어졌는지 확인

const arr = [];
console.log(arr instanceof Array); // true

 

 

🔧 6. 기타 자주 쓰는 연산자

삼항 연산자 (조건부 연산자)

const result = (age >= 18) ? "성인" : "미성년자";

전위 / 후위 연산자

let x = 5;
console.log(++x); // 6 (전위)
console.log(x++); // 6 → 다음에 7 (후위)

 

 

✅ 마무리하며

연산자는 JavaScript의 가장 핵심적인 기능 중 하나입니다.
자료를 비교하고 계산하고 조건을 만들고 결과를 결정할 수 있기 때문이죠.

특히 ===, !==, &&, ||, 삼항 연산자 같은 것들은 실무에서 매우 자주 사용되니 꼭 익혀두세요!

다음 글에서는 조건문을 함께 정리해보겠습니다 😊

 

 

#JavaScript, #자바스크립트기초, #연산자, #비교연산자, #산술연산자, #논리연산자, #삼항연산자, #typeof, #코딩입문, #웹개발, #ToastDev

반응형
저작자표시 비영리 (새창열림)

'Web Front > JavaScript' 카테고리의 다른 글

[JavaScript] #08 Javascript 제어문, JavaScript 조건문 완전 정복! if, else, switch 문 제대로 배우기  (0) 2025.10.05
[JavaScript] #06 JavaScript 기본 문법, 데이터 타입 완벽 정리!  (0) 2025.10.03
[JavaScript] #05 Javascript 기본문법, JavaScript 변수 선언 완전 정리! var, let, const 차이점은?  (1) 2025.10.02
[JavaScript] #04 Javascript 소개, JavaScript 실행 환경 비교: 브라우저 vs Node.js, 뭐가 다를까?  (0) 2025.09.06
[JavaScript] #03 Javascript 소개 - JavaScript는 어디에 쓰일까? 웹부터 게임까지 활용 분야 총정리!  (2) 2025.09.05
'Web Front/JavaScript' 카테고리의 다른 글
  • [JavaScript] #08 Javascript 제어문, JavaScript 조건문 완전 정복! if, else, switch 문 제대로 배우기
  • [JavaScript] #06 JavaScript 기본 문법, 데이터 타입 완벽 정리!
  • [JavaScript] #05 Javascript 기본문법, JavaScript 변수 선언 완전 정리! var, let, const 차이점은?
  • [JavaScript] #04 Javascript 소개, JavaScript 실행 환경 비교: 브라우저 vs Node.js, 뭐가 다를까?
TOASTDEV
TOASTDEV
인스턴트 코딩 #토스트데브 #토스트뎁 #코딩공부 #개발입문
  • TOASTDEV
    토스트데브
    TOASTDEV
    • 분류 전체보기 (162) N
      • 알쓸신잡 (47)
        • 코딩에 대하여 (13)
        • 컴퓨터에 대하여 (12)
        • IT 국내외 소식 (22)
      • Web Front (33) N
        • HTML (11) N
        • CSS (14)
        • JavaScript (8) N
      • Programming (35)
        • PHP (35)
      • App Development (2)
        • Ionic Framework (2)
      • Database (12)
        • SQL (12)
        • MySQL (0)
      • Server (24)
        • Linux (24)
      • Review (9)
        • Overseas Trip (0)
        • Domestic Travel (0)
        • Product Use Review (4)
        • Football Sports Review (5)
  • 블로그 메뉴

    • 홈
    • 태그
    • 방명록
  • 링크

    • Youtube Toastdev
    • Naver Blog
  • 공지사항

    • [유튜브] 유튜브 영상 업로드 안내
  • 인기 글

  • 태그

    데이터분석
    html기초
    웹개발기초
    SQL문법
    ubuntu서버
    웹개발입문
    php기초
    웹프로그래밍
    코딩입문
    ubuntuserver
    자바스크립트기초
    css기초
    javascript
    php
    sql
    프론트엔드기초
    php입문
    리눅스보안
    프론트엔드
    SQL강의
    php문법
    SQL기초
    HTML
    서버입문
    리눅스기초
    PHP문자열
    웹디자인기초
    웹개발
    서버관리
    서버보안
  • 최근 댓글

  • 최근 글

  • 전체
    오늘
    어제
  • 반응형
  • hELLO· Designed By정상우.v4.10.3
TOASTDEV
[JavaScript] #07 Javascript 기본문법, JavaScript 연산자 완전 정리! 종류별 예제와 함께 배우기
상단으로

티스토리툴바