[JavaScript] 연산자 정리

카테고리 : 프로그래밍 언어
태그: javascript · 연산자 정리 · 산술연산자 · 관계연산자 · 대입연산자 · 논리연산자 · 증감연산자 · 조건연산자
등록일: 2023년 03월 22일
최근 업데이트: 2023년 03월 22일

1. 연산자

1. 연산자

이름	단축 연산자	뜻
할당	x = y	x = y
더하기 할당	x += y	x = x + y
빼기 할당	x -= y	x = x - y
곱하기 할당	x *= y	x = x * y
나누기 할당	x /= y	x = x / y
나머지 할당	x %= y	x = x % y
거듭제곱 할당	x **= y	x = x ** y
왼쪽 시프트 할당	x «= y	x = x « y
오른쪽 시프트 할당	x »= y	x = x » y
부호 없는 오른쪽 시프트 할당	x »>= y	x = x »> y
비트 AND 할당	x &= y	x = x & y
비트 XOR 할당	x ^= y	x = x ^ y
비트 OR 할당	x	= y	x = x	y
논리 AND 할당	x &&= y	x && (x = y)
논리 OR 할당	x		= y	x	(x = y)
널 병합 할당	x ??= y	x ?? (x = y)

1) 산술연산자

(1): + : 합

(2): - : 차

(3): * : 곱

(4): / : 나눗셈

(5): % : 나머지

{
		//초기값
    let a = 30; //(number)
    let b = 20; //(number)
    let result = 0; //(number)

    result = a+b;
    console.log("합 : "+result)

    result = a-b;
    console.log("차 : "+result)

    result = a*b;
    console.log("곱 : "+result)

    result = a/b;
    console.log("나눗셈 : "+result)

    result = a%b;
    console.log("나머지 : "+result)
}


=> 결과값

[Running] node "/workspaces/codespaces-blank/index.js"
합 : 50
차 : 10
곱 : 600
나눗셈 : 1.5
나머지 : 10

[Done] exited with code=0 in 0.045 seconds

2) 관계연산자

(1): true

(2): false

{
		//초기값
    let a = 10; //(number)
    let b = 30; //(number)
    let c= 40; //(number)
    let result = null; //(null)

    result = a>b;
    console.log("a>b : " + result)

    result = a<b ;
    console.log("a<b : " + result)

    result = a==b ;
    console.log("a=b : " + result)

    result = b>=c ;
    console.log("b>=c : " + result)

    result = b!=c ;
    console.log("b!=c : " + result)
}

=> 결과값

[Running] node "/workspaces/codespaces-blank/index.js"
a>b : false
a<b : true
a=b : false
b>=c : false
b!=c : true

[Done] exited with code=0 in 0.044 seconds

3) 대입연산자

(1) : a = 10 => a의 변수에 10의 값을 대입해라

{
		//초기값
    let a = 10; //(number)
    let b = 20; //(number)
    let result = 0; //(number)

    result = a+b;
    console.log("합:",result);
    a +=100
    console.log("a =a+100 : ",a);

    b -=5
    console.log("b =b-100 : ",a);

    a *=5
    console.log("a*=5 : ",a);
    b =b/5
    b /=5
    console.log("a/=5 : ",a);
}

=> 결과값

[Running] node "/workspaces/codespaces-blank/index.js"
합: 30
a =a+100 :  110
b =b-100 :  110
a*=5 :  550
a/=5 :  550

[Done] exited with code=0 in 0.094 seconds

4) 논리연산자

(1): && : 그리고 = 범위설정 =>AND

(2):

: 또는 둘중에 하나 => OR

(3): ! : !not(논리부정) = true=>false , false=>true

{
  //초기값
  let a = 10; //(number)
  let b = 20; //(number)
  let c = 30; //(number)
  let result = null; //(null)

  result = a > b && a > c;
  console.log("(a>b)&(a>c):", result);

  result = a < b && a < c;
  console.log("(a<b)&&(a<c):", result);

  result = a < b || a < c;
  console.log("(a<b)||(a<c):", result);

  result = !result;
  console.log("!result:", result);
}

5) 증감연산자

(1) : 증가

{
    //초기값
    let a = 10 ; //(number)

    a = a+1;
    console.log(a);
    a += 1;
    console.log(a);
    a ++;
    console.log(a);
    ++a;
    console.log(a);
}
=>결과값

[Running] node "/workspaces/codespaces-blank/index.js"
11
12
13
14

[Done] exited with code=0 in 0.046 seconds

(2): 감소

{
    //초기값
    let a = 10 ; //(number)

    a= a-1;
    console.log(a);

    a-=1;
    console.log(a);

    a--;
    console.log(a);

    --a;
    console.log(a);
}
=>결과값

[Running] node "/workspaces/codespaces-blank/index.js"
9
8
7
6

[Done] exited with code=0 in 0.048 seconds

6) _ 조건연산자 _ ( 자주씀)**

(1) : 삼항 조건 연산 (Ternary Operator)

{
		//초기값
    let a = 40; //(number);
    let b = 30; //(number);
    let result =""; //(string);

    result = (a>b) ? 'a가 b보다 크다' : "b가 a보다 크다";

    console.log('result?',result);
}
=>결과값

[Running] node "/workspaces/codespaces-blank/index.js"
result? a가 b보다 크다

[Done] exited with code=0 in 0.047 seconds

(2): 다중 삼항 연산 (Ternary Operator)

{
  const num = 0; //(number)
  const message =
    num <= 5
      ? "5 이하입니다."
      : num <= 10
      ? "10 이하입니다."
      : num <= 15
      ? "15 이하입니다."
      : "15보다 큽니다.";
}

(3): NULL 병합 연산 ( Nullish Coalescing Operator)

왼쪽 피연산자가 null 또는 undefined일 때 오른쪽 피연산자를 반환하고, 그렇지 않으면 왼쪽 피연산자를 반환하는 논리 연산자.

{
    console.log(null ?? '디폴트'); // 비교 대상이 null || undefined 값이므로 오른쪽 값 출력
    console.log('안녕' ?? '디폴트'); // 비교 대상이 null || undefined가 아니므로 왼쪽 값 출력

    const response_01 = null; // (null)
    const result_1 = response_01 ?? '디폴트';
    console.log("result_1:",result_1);

    const response_02 = "안녕"; // (string)
    const result_2 = response_02 ?? '디폴트';
    console.log("result_2:",result_2);


    const result_3 = null ?? null ?? '세번째';
    console.log("result_3:",result_3);


    const result_4 = null ?? "두번째" ?? '세번째';
    console.log("result_4:",result_4);
}

=> 결과값

[Running] node "/workspaces/codespaces-blank/index.js"
디폴트
안녕
result_1: 디폴트
result_2: 안녕
result_3: 세번째
result_4: 두번째

[Done] exited with code=0 in 0.05 seconds

(4): !! : 부정 연산자 (_JS에서 거의 Boolean형 변환시 사용 _)

기존 데이터를 그대로 사용했을때와 !! 사용시 결과는 변하는건 없음 하지만

다른 타입의 데이터를 boolean 타입으로 명시적으로 형 변환(Type Conversion)하기 위해 사용

{
    let booleanChk_1 = !!true
    console.log("booleanChk_1?",booleanChk_1)

    let booleanChk_2 = !!null
    console.log("booleanChk_2?",booleanChk_2)

    let booleanChk_3 = !"test";
    console.log("booleanChk_3?",booleanChk_3)

    let booleanChk_4 = !!"test";
    console.log("booleanChk_4?",booleanChk_4)
}

=> 결과값
[Running] node "/workspaces/codespaces-blank/index.js"
booleanChk_1? true
booleanChk_2? false
booleanChk_3? false
booleanChk_4? true

[Done] exited with code=0 in 0.06 seconds

[JavaScript] 연산자 정리

1. 연산자

1) 산술연산자

2) 관계연산자

3) 대입연산자

4) 논리연산자

5) 증감연산자

6) _ 조건연산자 _ ( 자주씀)**

DONGNYEONG FRONTELIO

Error

1. 연산자

1) 산술연산자

2) 관계연산자

3) 대입연산자

4) 논리연산자

5) 증감연산자

6) _ 조건연산자 _ ( 자주씀)**

Templates (for web app):

Error