[모던 자바스크립트 Deep Dive] 07장
07장 연산자
연산자? 하나 이상의 표현식을 대상으로 산술, 할당, 비교, 논리, 타입, 지수 연산(operation)등을 수행해 하나의 값을 만드는것.
피연산자(operand) : 연산의 대상이 되는 것.
예제 07-01
// 산술 연산자 5 * 4 // -> 20 // 문자열 연결 연산자 'My name is ' + 'Lee' // 'My name is Lee' // 할당 연산자 color = 'red' // -> 'red' // 비교 연산자 3 > 5 // -> false // 논리 연산자 true && false // -> false // 타입 연산자 typeof 'Hi' // -> string7.1 산술 연산자
- 피연산자를 대상으로 수학적 계산을 수행해 새로운 숫자 값을 만든다.
- 산술 연산이 불가할 경우 NaN을 반환
7.1.1 이항 산술 연산자
2개의 피연산자를 산술 연산 하는 것
이항 산술 연산자 의미 부수 효과 + 덧셈 X - 뺄셈 X * 곱셈 X / 나눗셈 X % 나머지 X 예제 07-02
5 + 2; // -> 7 5 - 2; // -> 3 5 * 2; // -> 10 5 / 2; // -> 2.5 5 % 2; // -> 1
7.1.2 단항 산술 연산자
1개의 피 연산자를 산술 연산하여 숫자 값을 만든다
단항 산술 연산자 의미 부수 효과 ++ 증가 O -- 감소 O + 어떠한 효과도 없다. 음수를 양수로 반전하지도 않는다. X - 양수를 음수로, 음수를 양수로 반전한 값을 반환한다. X 예제 07-03
var x = 1; // ++ 연산자는 피연산자의 값을 변경하는 암묵적 할당이 이루어진다. x++; // x = x + 1; console.log(x); // 2 // -- 연산자는 피연산자의 값을 변경하는 암묵적 할당이 이루어진다. x--; // x = x - 1; console.log(x); // 1증가/감소 연산자는 위치에 의미가 있다
- 피연산자 앞에 위치한 전위 증가/감소 연산자는 먼저 피 연산자의 값을 증가.감소시킨 후 다른 연산을 수행한다.
- 피 연산자가 뒤에 위치한 후위 증가/감소 연산자는 먼저 다른 연산을 수행한 후, 피 연산자의 값을 증가/감소 시킨다.
'-' 단항 연산자는 피 연산자의 부호를 반전한 값이 반환 된다.
7.1.3 문자열 연결 연산자
- '+' 연산자는 피연산자중 하나 이상의 문자열인 경우 문자열 연결 연산자로 동작한다.
- 1 + true를 연산하면 자바스크립트 엔진은 암묵적으로 true를 1로 타입을 강제로 변환후 연산을 수행한다. -> 암묵적 타입변환, 타입 강제 변환
7.2 할당 연산자
- 우항에 이쓴 피 연산자의 평가 결과를 좌항에 있는 변수에 할당한다.
7.3 비교 연산자
- 좌항과 우항의 피 연산자를 비교한 다음 그 결과를 불리언 값을 반환한다.
- if나 for문 과 같은 제어문의 조건식에 주로 사용
7.3.1 동등/일치 비교 연산자
== : 동등 비교
=== : 값과 타입이 같음
!= : 값이 다름
!== : 값과 타입이 다름
동등 비교(==) 연산자는 편리하긴 하지만 결과를 예측하기 어렵고 실수하기 쉽다. -> 사용핮 않는 편이 좋다 대신 일치 비교 연산자를 사용한다,
NaN는 자신과도 일치 하지 않는 값으로 빌트인 함수 isNaN을 사용한다.
7.3.2 대소 관계 비교 연산자
- 'x > y' : x가 y보다 크다
- 'x < y' : x가 y보다 작다
- 'x >= y' : x가 y보다 크거나 같다
- 'x <= y' : x가 y보다 작거나 같다
7.4 삼항 조건 연산자
조건식의 평가 결과에 따라 반환할 값을 결정한다.
조건식 ? 조건식이 true일때 반환할 값 : 조건식이 false 일때 반환할 값.
예제 07-21
var x = 2; // 2 % 2sms 0이고 0은 false로 암묵적 타입 변환된다. var result = x % 2 ? '홀수' : '짝수'; console.log(result); // 짝수삼항 조건 연산자 표현식은 값으로 평가할 수 있는 표현식인 문이다.
조건에 따라 어떤 값을 결정해야 한다면 if ... else문보다 삼항 조건 연산자 표현식을 사용하는 편이 유리하다.
7.5 논리 연산자
우항과 좌항의 피연산자를 논리 연산한다.
|| : 논리합(OR)
&& : 논리곱(AND)
! : 논리부정(NOT)
논리 부정(!) 연산은 언제나 불리언 값을 반환한다.
논리합, 논리곱 연산자는 불리언 값이 아닐 수 있다.
예제 07-27
// 단축 평가 'Cat' && 'Dog'; // -> 'Dog'
7.6 쉼표 연산자
- 왼쪽 피연산자부터 차례대로 피연산자를 평가하고 마지막 피연산자의 평가가 끝나면 마지막 피연산자의 평가 결과를 반환한다
7.7 그룹 연산자
- 소괄호로 피 연산자를 감싸는 그룹연산자, 자신의 피연산자인 표현식을 가장 먼져 평가
- 우선순위를 조절 할 수 있다.
7.8 typeof 연산자
- 피 연산자의 데이터 타입을 문자열로 반환한다.
- string, number, boolean, undefined, symbol, object, function
- null을 반환하는 경우는 없다. -> object를 반환한다. 버그임-> 아직 수정 안됨
- null타입인지 확인할 때는 typeof가 아닌 일치연산자(===)를 사용
- 선언하지 않은 식별자는 undefined를 리턴 한다.
7.9 지수 연산자
ES7에 도입된 지수 연산자
좌항으 ㅣ피연산자를 우항의 피연산자를 지수로 거듭 제곱하여 숫자로 값을 반환한다
예제 07-34
2 ** 2; // 4 2 ** 2.5; // 5.65685424949238 2 ** 0; // 1 2 ** -2; // 0.25그 전에는 Math.pow 매써드를 사용했음.
음수를 거듭제곱 밑으로 사용해 계산하려면 괄호로 묶어야 한다.
지수 연산자는 이항 연산자 중에서 우선순위가 가장 높다.
7.10 그 외의 연산자
- 연산자가 더 있으나 나중에 나올 것들
- '?.' : 옵셔널 체이닝 연산자
- '??' : null 병합 연산자
- 'delete' : 프로퍼티 삭제
- 'new' : 생성자 함수를 호출할 때 사용하여 인스턴스를 생성
- 'instanceof' : 좌변의 객체가 우변의 생성자 함수와 연결된 인스턴스인지 판별
- 'in' : 프로퍼티 존재 확인
7.11 연산자의 부수 효과
- 일부 연산자는 다른 코드에 영향을 주는 부수효과가 있다.
- 할당 연산자(=)
- 증가/감소 연산자(++/--)
- delete 연산자
7.12 연산자 우선순위
우선순위 연산자 1 () 2 new(매개변수 존재), ., [](프러퍼티 접근,) ()(함수호출), ? .(옵셔널 체이닝 연산자) 3 new(매개변수 미존재) 4 x++, y-- 5 !x, +x, -x, ++x, --x, typeof, delete 6 **(이항 연산자 중에서 우선순위가 가장 높다.) 7 *, /, % 8 +, - 9 <, <=, >, >=, in, instanceof 10 ==, !=, ===, !== 11 ??(null 병합 연산자) 12 && 13 || 14 ? ... : .... 15 할당 연산자(=, +=, -=, ...) 16 , - 일일이 기억이 어렵기 때문에 그룹연산자를 사용하여 명시적으로 조절하는 것을 권장한다.
7.13 연산자 결합 순서
결합 순서 연산자 좌항 -> 우항 +, -, /, %, <, <=, >, >=, &&, ||, ., [], (), ??, ?., in, instanceof 우항 -> 좌항 ++, --, 할당연산자(=, +=, -=, ...), !x, +x, -x, ++x, --x, typeof, delete, ? ... : ...
