#7. 연산자

피연산자는 연산의 대상이 되어야 하므로 값으로 평가할 수 있어야 하고 연산자는 값으로 평가된 피연산자를 연산해 새로운 값을 만든다.

1. 산술 연산자

피연산자를 대상으로 수학적 계산을 수행해 새로운 숫자 값을 만든다. 산술 연산이 불가능 한 경우, NaN을 반환한다.

 

이항 산술 연산자

• 2개의 피연산자를 산술 연산하여 숫자 값을 만든다.
• 이항 산술 연산자는 부수효과가 없다.
  • 여기서 부수 효과란 피연산자의 값 자체를 변경하는 것을 의미한다.

 

단항 산술 연산자

• 1개의 피연산자를 산술 연산하여 숫자 값을 만든다.
• ++ / -- 단항 산술 연산자는 피연산자의 값을 변경하는 부수 효과가 있다.
• 숫자 타입이 아닌 피연산자에 + 단항 연산자를 사용하면 피연산자를 숫자 타입으로 변환한 값을 반환한다. 값을 생성해서 반환하므로 부수효과는 없다.

var x ="1";
//문자열을 숫자 타입으로 변환
console.log(+x); //1

console.log(x) //"1"

x= true;
//불리언 값을 숫자 타입으로 변환
console.log(+x); //1

console.log(x) //true

x= false;
//불리언 값을 숫자 타입으로 변환
console.log(+x); //0

console.log(x) //false

x='Hello';
//문자열을 숫자 타입 변환할 수 없으므로 NaN을 반환한다.
console.log(+x); //NaN

console.log(x); //"Hello"

• - 단항 연산자를 사용할 때도 마찬가지로 피연산자를 숫자 타입으로 변환한 값을 생성해서 반환한다. 반환 시에는 부호를 반전한 값을 생성해 반환한다.

-'10'; -> -10 //문자열을 숫자로 변환
-true; -> -1 //불리언 값을 숫자로 변환
-'Hello'; -> NaN //문자열을 숫자 타입으로 변환할 수 없으므로 NaN 반환

 

문자열 연결 연산자

• + 연산자는 피연산자 중 하나 이상이 문자열인 경우 문자열 연결 연산자로 동작한다. 
• 암묵적 타입 변환 / 타입 강제 변환 : 개발자의 의도와는 상관없이 자바스크립트 엔진에 의해 암묵적으로 타입이 자동 변환되기도 한다. 

//문자열 연결 연산자
'1'+2; -> 12
1+'2'; -> 12

//산술 연산자
1+2; -> 3

//true는 1로, false는 0으로 강제 타입 변환
1+true; -> 2
1+false; -> 1

//null은 0으로 강제 타입 변환
1+null; -> 1

//undefined는 숫자로 타입 변환되지 않는다.
+undefined; -> NaN
1+undefined; -> NaN

---

2. 할당 연산자

할당 연산자는 우항에 있는 피연산자의 평가 결과를 좌항에 있는 변수에 할당한다. 

• 할당 연산자는 좌항의 변수에 값을 할당하므로 변수 값이 변하는 부수 효과가 있다.
• 할당문은 값으로 평가되는 표현식인 문으로서 할당된 값으로 평가된다.

• 할당문을 다른 변수에 할당할 수도 있다. => 여러 변수에 동일한 값을 연쇄 할당할 수 있다.

var a, b, c;

a=b=c=0;

console.log(a,b,c) // 0 0 0

---

3. 비교 연산자

좌항과 우항의 피연산자를 비교한 후 결과를 불리언 값으로 반환한다. 주로 if문이나 for문과 같은 제어문의 조건식에서 사용한다.

동등/일치 비교 연산자

암묵적으로 타입이 자동 변환되기도 한다. 

• 동등 비교 연산자(==) : 느슨한 비교, 값이 같은지 비교한다.
  
  • 좌항과 우항의 피연산자를 비교할 때 먼저 암묵적 타입 변환을 통해 타입을 일치시킨 후 같은지 비교한다.
  • 암묵적 타입 변환 후 같은 값일 수 있다면 true를 반환한다.
  • 동등 비교 연산자는 예측하기 어려운 결과를 만들어 내므로 사용을 지양하는 것이 좋다.

5==5; //true
5=='5'; //true

• 일치 비교 연산자(===) : 엄격한 비교, 값과 타입이 같은지 비교한다.
  • 좌항과 우항의 피연산자가 타입도 같고 값도 같은 경우에 한하여 true를 반환한다. 즉, 암묵적 타입 변환을 하지 않고 값을 비교한다.
  • NaN은 자신과 일치하지 않는 유일한 값이다. 숫자가 NaN인지 조사하려면 빌트인 함수인 Number.isNaN()을 사용한다.

Number.isNaN(NaN); //true
Number.isNaN(10); //false
Number.isNaN(1+undefined); //true

• Object.is 메서드 : 동등/비교 연산자는 +0과 -0을 동일하다고 평가하고 동일한 값이 NaN과 NaN을 비교하면 다른 값이라고 평가한다. Object.is 메서드는 예측 가능한 정확한 비교 결과를 반환한다. (이 외에는 일치 비교 연산자와 동일하게 동작)

-0 === +0; //true
Object.is(+0,-0); //false

NaN == NaN; //false
Object.is(NaN, NaN) //true

 

대소 관계 비교 연산자

피연산자의 크기를 비교하여 불리언 값을 반환한다.

---

4. 삼항 조건 연산자

조건식의 평가 결과에 따라 반환할 값을 결정한다.

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

• 조건식의 평가 결과가 불리언 값이 아니면 불리언 값으로 암묵적 타입 변환된다.
• if else문과 비슷하게 사용할 수 있지만, if else문은 표현식이 아닌 문인 반면 삼항 조건 연산자를 사용한 표현식은 값으로 평가할 수 있는 표현식인 문이다.

---

5. 논리 연산자

우항과 좌항의 피연산자(부정 논리 연산자의 경우 우항의 피연산자)를 논리 연산한다.

• 피연산자가 불리언 값이 아니면 불리언 타입으로 암묵적 타입 변환된다.

!0; //true
!'Hello'; //false

 

cf)
Truthy : 자바스크립트가 조건식에서 참으로 평가하는 타입

빈 배열 [ ]
객체 리터럴 { }
숫자형, Infinity (양의 무한대)
문자열

Falsy : 자바스크립트가 조건식에서 거짓으로 평가하는 타입
null
undefined
숫자 0, 숫자가 아님을 의미하는 NaN
“” (빈 문자열)

• 논리 부정 연산자 (!) 는 언제나 불리언 값을 반환하지만, 논리합(||) 또는 논리곱(&&) 연산자 표현식의 평가 결과는 불리언 값이 아닐 수도 있다.
• 논리합(||) 또는 논리곱(&&) 연산자 표현식은 언제나 2개의 피연산자 중 한쪽으로 평가된다.

---

6. 쉼표 연산자

쉼표 연산자는 왼쪽 피연산자부터 차례대로 피연산자를 평가하고 마지막 피연산자의 평가가 끝나면 마지막 피연산자의 평가 결과를 반환한다.

 

let a = (obj, value) => {
   obj+=value;
   obj+=value;
   return obj;
}

//위 코드를 아래처럼 바꿀 수 있다.

let a = (obj, value) => (obj+=value, obj+=value, obj);

a(1,2); // 5

출처: https://inpa.tistory.com/entry/JS-📚-콤마연산자-a-b-c [Inpa Dev 👨‍💻:티스토리]

---

7. 그룹 연산자

소괄호로 피연산자를 감싸는 그룹 연산자는 자신의 피연산자인 표현식을 가장 먼저 평가한다.

• 그룹 연산자 ('( )')는 연산자 우선순위가 가장 높다.

---

8. typeof 연산자

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

• 7가지 문자열 "string", "number", "boolean", "undefined", "symbol", "object", "function" 중 하나를 반환한다.
• "null"을 반환하지는 않는다. null 타입인지 확인하고자 할 때는 typeof 연산자를 사용하지 않고 일치 연산자(===)를 사용하는 것이 좋다.

typeof ' ' // - "string"
typeof 1 // - "number"
typeof NaN // - "number"
typeof true // - "bootean"
typeof undefined // - "undefined"
typeof Symbol() // - "symbo' "
typeof null // - "object"
typeof [] // - "object"
typeof {} // - "object"
typeof new Date() // - "object"
typeof /test/gi // - "object"
typeof function () {} // → "function"

var foo = null;

typeof foo === null; //false
foo === null //true

//undeclared 식별자를 선언한 적이 없으므로 undefined를 반환한다.
typeof undeclared; //undefined

---

9. 지수 연산자 

지수 연산자 ('**')는 좌항의 피연산자를 밑으로, 우항의 피연산자를 지수로 거듭 제곱하여 숫자 값을 반환한다.

• 지수 연산자는 이항 연산자 중에 우선순위가 가장 높다.

---

10. 연산자 우선 순위

---

11. 연산자 결합 순서