본문 바로가기
Language/JavaScript

Javascript 연산자

by Krystal K 2022. 5. 18.

<Today's Goals>

  • 연산자에 대해 이해한다.
  • 연산자의 종류와 특징

<What i learned>

  • 증감연산자를 이용해서 순서대로 숫자가 변하는 목록의 값을 한번에 수정 할 수 있다. (1,2,3,4,5 → 5,6,7,8로 변경)

<Questions>

  • 도대체 후위연산자는 어디에 쓰이는걸까? 헷갈린다. 

연산자

1.산술 연산자(arithmetic operator)

산술 연산자는 사칙연산 및 기본적인 연산을 하는 연산자
두 개의 피연산자를 가지는 이항 연산자
피연산자 결합 방향 : 왼쪽 → 오른쪽
 
산술 연산자 설명
+ 왼쪽 피연산자 값에 오른쪽 피연산자 값을 더함
- 왼쪽 피연산자 값에서 오른쪽 피연산자 값을 뺌
* 왼쪽 피연산자 값에 오른쪽 피연산자 값을 곱함
/ 왼쪽 피연산자 값을 오른쪽 피연산자 값을 나눔
% 왼쪽 피연산자 값을 오른쪽 피연산자 값으로 나눈 후, 나머지를 반환 
** 왼쪽 피연산자 값에 오른쪽 피연산자 값을 거듭제곱함

산술 연산자 예시

prompt

 첫번째 값으로 10, 두번째 값으로 3을 입력했을 경우, 콘솔에 다음과 같이 나타난다.

 

 

 

2. 대입 연산자 (assignment operator)

변수나 상수에 값을 대입할 때 사용하는 이항연산자

산술연산자와 결합한 복합 대입 연산자

피연산자 결합 방향 : 오른쪽 → 왼쪽

대입 연산자 설명
= 왼쪽 피연산자 값에 오른쪽 피연산자 값을 대입
+= 왼쪽 피연산자의 값에 오른쪽 피연산자의 값을 더한 후,
그 결과값을 왼쪽 피연산자에 대입
-= 왼쪽 피연산자의 값에 오른쪽 피연산자의 값을 뺀 후,
그 결과값을 왼쪽 피연산자에 대입
*= 왼쪽 피연산자의 값에 오른쪽 피연산자의 값을 곱한 후,
그 결과값을 왼쪽 피연산자에 대입
/= 왼쪽 피연산자의 값에 오른쪽 피연산자의 값을 나눈 후,
그 결과값을 왼쪽 피연산자에 대입
%= 왼쪽 피연산자의 값에 오른쪽 피연산자의 값을 나눈 후,
그 나머지를 왼쪽 피연산자에 대입
**= 왼쪽 피연산자의 값에 오른쪽 피연산자의 값을 거듭제곱 후,
그 결과값을 왼쪽 피연산자에 대입

대입 연산자 예시

콘솔에서 확인하면 다음과 같다.

 

 

 

3. 증감 연산자(increment and decrement operator)

증감 연산자는 피연산자를 1씩 값을 증가 또는 감소시킬 때 사용하는 단항 연산자

피연산자(변수)의 위치에 따라 결과가 달라짐

증감 연산자 설명
++변수
먼저 변수의 값을 1 증가시킨 후,  연산을 진행 (전위연산자)
변수++ 해당 연산을 수행한 후, 변수의 값을 1 증가 (후위연산자)
--변수 먼저 변수의 값을 1 감소시킨 후,  연산을 진행 (전위연산자)
변수-- 해당 연산을 수행한 후, 변수의 값을 1 감소 (후위연산자)

증감 연산자 예시

콘솔에서 확인하면 다음과 같다.

num2 + ++num1 의 경우 ++num1이 전위연산자이기때문에 +보다 우선적으로 연산한다.

따라서 ++num1을 1 증가한 후  num2와 더한다.

만약 후위연산자일 경우는 반대로 num1과 num2를 먼저 더한다.

 

 

 

 

4. 비교 연산자(comparison operator)

비교 연산자는 피연산자 사이의 상대적인 크기를 판단하여, 참(true)과 거짓(false)을 반환하는 이항연산자
피연산자 결합 방향 : 왼쪽→ 오른쪽
비교 연산자 설명
==
 양쪽 피연산자의 타입이 달라도 값이 같으면 참(true)를 반환
=== 양쪽 피연산자의값과 타입이 모두 같을 때만 참(true)를 반환
!= 양쪽 피연산자의 값이 같지 않으면 참(true)을 반환
!== 양쪽 피연산자의 값이 같지 않거나 타입이 같지 않을 때 참(true)을 반환
> 왼쪽 피연산자의 값이 오른쪽 피연산자의 값보다 크면 참(true)을 반환함.
>= 왼쪽 피연산자의 값이 오른쪽 피연산자의 값보다 크거나 같으면 참(true)을 반환함.
< 왼쪽 피연산자의 값이 오른쪽 피연산자의 값보다 작으면 참(true)을 반환함.
<= 왼쪽 피연산자의 값이 오른쪽 피연산자의 값보다 작거나 같으면 참(true)을 반환함.

비교 연산자 예시

콘솔에서 확인하면 다음과 같다.

 

 

 

5. 논리 연산자 (logical operator)

논리 연산자는 주어진 논리식을 판단하여, 참(true)과 거짓(false)을 반환

  • && 연산자와 || 연산자 : 이항 연산자

       피연산자 결합 방향 : 왼쪽 → 오른쪽

  • ! 연산자 : 단항 연산자 

      피연산자 결합 방향 : 오른쪽 → 왼쪽

논리 연산자
설명
&&(and)
두 논리식 모두 참이면 참을 반환
||(or)
두 논리식 중 하나라도 참이면 참을 반환
!(not)
논리식의 결과가 참이면 거짓을, 거짓이면 참을 변환

논리 연산자 예시

콘솔에서 확인하면 다음과 같다.

 

 

 

6. 삼항 연산자(ternary operator)

피연산자를 3개 가지는 조건 연산자

조건식에 따른 참, 거짓에 따라 반환값이 달라지는 연산자 

조건식 ? 반환값1 :반환값2
? 앞의 조건식이 참이면 반환값1을 실행
조건식이 거짓이면 반환값2를 실행
 
삼항 연산자 예시
 

콘솔에서 확인하면 다음과 같다.

 

728x90

'Language > JavaScript' 카테고리의 다른 글

Javascript 반복문 for문  (0) 2022.05.19
Javascript 조건문 if  (0) 2022.05.19
Javascript 조건문 switch  (0) 2022.05.19
Javascript 주석  (0) 2022.05.17
Javascript 변수와 데이터  (0) 2022.05.17