연산자는 하나 이상의 표현식을 대상으로 산술,할당,비교,논리,타입,지수 연산 등을 수행해 하나의 값을 만든다.

산술연산자

산술연산자는 피연산자를 대상으로 수학적 계산을 이루어 새로운 숫자 값을 만든다.

피연산자란? 5 + 2 // 7 라는 코드가 있다면 ( +는 더하기 연산자이다)
5 , 2 는 +연산자로부터 연산을 당하는 대상이므로 피연산자이다.

산술 연산이 불가능한 경우 NaN을 반환한다.NaN은 (not a number) 뜻한다. 즉 숫자가 아니라는 뜻이다. 우리가 앞으로 종종 보게 될 녀석이니 이쯤에서 눈도장을 찍어두자.

이항 산술 연산자

이항 산술 연산자는 2개의 피연산자를 산술 연산하여 숫자 값을 만들어낸다.

5 + 2; // 7   (덧셈)
5 - 2; // 3   (뺄셈)
5 * 2; // 10  (곱셈)

5 / 2; // 2.5 (이녀석이 나누기)
5 % 2; // 1 (이 녀석은 나누고 나머지 값 표출)

단항 산술 연산자

단항 산술 연산자는 1개의 피연산자를 산술 연산하여 값을 만든다.

단항 산술 연산자에는 특이한 점이 있다.

코드로 예를 들어보겠다.

<script>
var x = 1;
x++; // x = x + 1
console.log(x); //2
</script>

왜 x가 2가 되어있을까?
단항 산술 연산자는 + 기호를 두번쓰게되면 피연산자의 값을 변경하는 부수효과가 있다.

그렇다면 -를 두번쓰면 어떻게 될까? 코드로 다시 예를 들어보자.

<script>
var x = 1;

x++; // x = x + 1
console.log(x); // 2

x--; // x = x - 1;
console.log(x); // 1 
</script>

이렇듯 ++ (+1) 이란 뜻이고 --(-1)이라는 뜻이다. 이게 단항 산술 연산자의 특이한 점이다.

그리고 단항 산술 연산자에서 + , - 의 의미는 조금 다르다.

<script>
+10 ; // 아무런 효과가없다

+(-10) //  - 10

var x = "1" // 저는 숫자가 아닌 문자열 1입니다.

console.log(+x) // 1  문자열을 숫자 1로 타입변환 .
//조심해야 할 거는 "hello" 이런 대놓고 문자열인 애들은 nan이 출력된다.

console.log(x) // "1" 
</script>

그리고 true는 1로취급 , false는 0으로 취급한다. 컴퓨터에서의 1 과 0 은 켜져있다 꺼져있다의 의미로 해석된다. true는 1 , false는 0 기억하자.
또한 null 은 0으로 타입이 변환 된다는것도 추가로 기억해두자.

할당연산자

할당 연산자의 종류에는 6가지 종류가 있다.

1. =  //  ( x = 5) //  동일 표현으로는 x = 5 해석된다.

2.+=  // ( x += 5)  동일 표현으로는 x = x + 5 해석된다.

3.-= //   ( x -= 5)  동일 표현으로는 x = x - 5 해석된다.

4.*= // ( x *= 5)  동일 표현으로는 x = x * 5 해석된다.

5./= // ( x /= 5)  동일 표현으로는 x = x / 5 해석된다.

6.%= // ( x %= 5)  동일 표현으로는 x = x % 5 해석된다.

헷갈린다면 x += 5 라는 코드가 존재 할 때 (x +)를 우항으로 그대로 가져와

= x +5 를 만들고 할당 받을 녀석을 적어주면 끝이다 . x였기 때문에 x를 그대로 넣어주는 느낌으로 하면 더 이해가 빠를 것이다.

비교연산자

비교 연산자는 좌항과 우항의 피연산자를 비교한다.
그 결과를 불리언 값으로 반환한다. (true , false )
비교 연산자는 if문 for문과 같은 제어문의 조건식에서 주로 사용한다.

비교연산자는 이렇게 4가지 종류가있다.
== 동등비교 x == y (x와 y 값이 같다.)
=== 일치비교 x === y (x와 y의 값과 타입이 같다.)
!= 부동등비교 x != y (x와 y의 값이 다르다.)
!== 불일치 비교 x !== y (x와 y의 값과 타입이 다르다.)

동등비교 연산자 == 는 좌항과 우항의 피연산자를 비교 할 때 암묵적 타입 변환을 통해

타입을 일치시킨 후 같은 값인지 비교한다.

(이는 개발자의 의도와는 상관없이 자바스크립트 엔진에 의해 암묵적으로 타입이 자동적으로 변환된다.)

7 == 7 ; //true

7 == "7" ; // true 타입이 다르지만 암묵적 타입변환을 통해 일치시키면 동등하다.

동등 비교 연산자가 편한 경우도 물론있다.
하지만 결과를 예측하기 어렵고 실수하기 쉽다.
따라서 동등 비교 연산자는 사용하지 않는 편이 좋고 , 일치비교 연산자를 사용한다 (===)

삼항 조건 연산자

삼항 조건 연산자는 조건식의 평가 결과에 따라 반환할 값을 결정한다.
삼항 조건 연산자는 다음과 같이 사용한다.

조건식 ? 조건식이 true일 때 반환할 값 : 조건식이 false일 때 반활할 값

<script>
var x = 2;
//해설코드
var result = x % 2 (저는 조건식)?"홀수"(저는 트루일때 반환값):"짝수"(저는 펄스일때)
;
//가독성을위해 해설코드 아닌코드를 적어보자면
var result = x % 2 ? "홀수":"짝수";
//2 % 2 는 0 이고 0은 false로 간주된다 . 
console.log(result); // 짝수

</script>

삼항 조건 연산자는 코드의 양을 줄여주고 코드를 효율적으로 만든다.

눈에 익히고 사용하는 습관을 들이면 좋겠다.

논리 연산자

논리 연산자는 우항과 좌항의 피연산자를 논리 연산한다.
논리 연산자에는 논리합 , 논리곱 , 부정 연산자가 존재한다.

논리합 연산자는 || 두개로 만들고
논리곱 연산자는 && 두개로 만든다.
부정 연산자는 우리가 비교연산자에서 봤듯이 ! 로 만든다.

논리합 연산자

논리합 연산자는 둘중에 하나만 true여도 true라는 값을 반환한다.
그리고 연산자라고도 부른다.

<script>
true || true; // true
false || true; // true
true || false; // true
false || false; // false
</script>

논리곱 연산자

논리곱 연산자는 양쪽의 항이 둘 다 트루가 아니라면 false를 반환한다.
또는 연산자라고도 부른다.

<script>
true && true; // true
false && true; // false
true && false; // false
false && false; // false
</script>

논리 부정 연산자

논리 부정(!)연산자는 언제나 불리언 값을 반환한다.
피연산자가 불리언 값이 아니면 불리언 타입으로 암묵적 타입 변환된다.

<script>
!true; // false
!false; // true
!0; // true
!"hi"; // false
</script>

typeof 연산자

typeof 연산자는 피연산자의 데이터 타입을 문자열로 반환한다.

<script>
typeof ""  // "string"
typeof 1  // "number"
typeof NaN // "number"
typeof true // "boolean"
typeof undefined // "undefined"
typeof Symbol()  // "symbol"
typeof null  // "object"
typeof []   // "object"
typeof {}    // "object"
typeof new Date()  // "object"
typeof /test/gi   // "object"
typeof funtion(){} // "funtion"
</script>

typeof 연산자로 null 값을 연산해보면 "null"이 아닌 "object"를 반환하는데 주의하자.
이것은 자바스크립트의 첫 번째 버전의 버그이다.
하지만 기존 코드에 영향을 줄 수 있기 때문에 아직까지 수정되지 못하고 있다.
따라서 값이 null 타입인지 확일할 때는 typeof 연산자를 사용하지 말고 일치 연산자 (===)를 사용하자.

오늘은 여러 개념들을 배웠다 다 자주 사용하고 우리가 손에 익혀야할 개념들이 가득하다.

꾸준하게 공부하다보면 쌓일 지식이니 한번에 외울 생각보단 적용하며 기억해보자.