가오리의 코딩일기
7장 연산자 본문
→ 연산자 : 하나 이상의 표현식을 대상으로 산술, 할당, 비교, 논리, 타입, 지수 연산을 수행해 하나의 값을 만든다
→ 피연산자 : 연산의 대상, "값"
🧩 산술 연산자(arthmenc operator)
→ 피연산자를 대상으로 수학적 계산을 수행해 새로운 숫자 값을 만든다
→ 산술 연산이 불가능한 경우 NaN(Not a Number)
🧩 이항 산술 연산자
→ 부수효과가 없다
+ 할당연산자, 증가/감소 연산자 등 일부 연산자는 다른 코드에 영향을 주는 효과
→ 어떤 산술 연산을 해도 피연산자의 값이 바뀌는 경우는 없다
🧩 단항 산술 연산자
→ 증가/감소 연산자, 부수 효과가 있다
→ 전위 증가/감소 연산자 : 먼저 피연산자의 값 증가, 감소
→ 후위 증가/감소 연산자 : 나중에 피연산자의 값 증가, 감소
🧩 문자열 연결 연산자
→ + 연산자는 피연산자 중 하나 이상이 문자열인 경우 문자열 연결 연산자로 동작한다
'1'+2; // '12': 문자열 연결 연산자
1+true; // 2: 산술 연산자
1+false; // 1
1+null; // 1: null은 0
1+undefined; // NaN: undefined는 숫자 타입으로 변환X
🔗 암묵적 타입 변환, 강제 타입 변환
→ 자바스크립트 엔진에 의해 암묵적으로 타입이 자동 변환 되는 것
→ 추가적인 설명은 9장에서
🧩 할당 연산자(assignment operator)
→ 우항에 있는 피연산자의 평가 결과를 좌항에 있는 변수에 할당한다
→ 좌항의 변수에 값을 할당하기 때문에 부수 효과가 있다
🔗 할당문은 '값'으로 평가되는 표현식인 문으로서 할당된 값으로 평가된다
🧩 ==: 동등 비교 연산자(loose equality)
→ 좌항과 우항의 피연산자를 비교할 때 먼저 암묵적 타입 변환을 통해 타입을 일치시킨 후 같은 값인지 비교한다
→ 부수효과가 없고 x와 y의 값이 같은가 다른가를 비교한다
🧩 ===: 일치 비교 연산자(strict equality)
→ 좌항과 우항의 피연산자가 타입도 같고 값도 같은 경우에만 true를 반환한다
→ 부수효과가 없고 x와 y의 값과 타입이 같은지 비교한다
→ NaN은 자신과 일치하지 않는 유일한 값, 숫자가 NaN인지 비교해야 할 때는 빌트인 함수 isNaN()을 사용해야 한다
🔗 == vs. ===
→ 동등 비교 연산자는 느슨한 비교를 하지만 일치 비교 연산자는 엄격한 비교를 한다
→ 추가적인 Boolean형
→ false: 숫자 0, null, undefined, 문자열 공백
→ true : false가 아닌 전부, "false"도 문자열이고 공백이 아니기에 true
let a = 0;
alert( Boolean(a) ); // false
let b = "0";
alert( Boolean(b) ); // true
alert(a == b); // true!
🔗 Falsy 값
→ 자바스크립트에서 0이란 값이 falsy 값이다
→ 숫자 0을 강제로 false로 변환시킨다
→ falsy 값: false, 0, "", null, undefined, NaN
// 1. false, 0, "" → false 형태로 강제 형 변환
false == 0 // true
0 =='' // true
'' = false // true
// 2. null, undefined → 그들과 같고, 자기 자신도 같다
null == null // true
undefined == undefined // true
undefined == null // true
// 3. NaN → 그 누구와도 값이 같지 않다(자기 자신도)
NaN == null // false
NaN == undefined // false
NaN == NaN // flase
🧩 대소 관계 비교 연산자
→ 피연산자의 크기를 비교하여 불리언 값을 반환한다
🔗 문자열 비교
→ 자바스크립트는 사전(편집)순으로 문자열을 비교한다
→ 사전 뒤쪽의 문자열은 사전 앞쪽의 문자열보다 크다고 판단한다
→ 'A'보다 'a'가 더 크기 때문에 정확히는 사전순이 아니라 유니코드순이라고 할 수 있다
🧩 삼항 조건 연산자(ternary operator)
→ 부수효과가 없고 조건식의 평가 결과에 따라 반환할 값을 결정
→ 조건식의 평가 결과가 불리언 값이 아니라면 불리언 값으로 암묵적 타입 변환을 한다
→ 값으로 평가할 수 있는 표현식인 문
// 조건식 ? (조건식이 true일 때 반환하는 값) : (조건식이 false일 때 반환하는 값);
let resultScore = score>=60 ? 'pass' : 'fail';
let resultNumber = x %2 ? '홀수' : '짝수';
🧩 논리 연산자(logical operator)
→ 우항과 좌항의 피연산자를 논리 연산하고 부수효과가 없다
→ ||_논리합(OR), &&_논리곱(AND), !_부정(NOT)
→ &&의 우선순위가 || 보다 높다
🔗 드 모르간의 법칙
→ 복잡한 표현식을 좀 더 가독성 좋은 표현식으로 변환한다
!(x || y) === (!x && !y);
!(x && y) === (!x || !y);
🧩 비트 연산자
→ 인수를 32비트 정수로 변환하여 이진 연산을 수행한다
→ 비트 AND(&), 비트 OR(|), 비트 XOR(^), 비트 NOT(~)
→ 왼쪽 시프트(<<), 오른쪽 시프트(>>), 부호 없는 오른쪽 시프트(>>>)
🧩 쉼표 연산자
→ 왼쪽 피연산자부터 차례대로 피연산자를 평가하고 마지막 피연산자의 평가가 끝나면 마지막 피연산자의 평가 결과를 반환한다
🧩 그룹 연산자
→ 연산자 우선순위가 제일 높기 때문에 우선순위를 조절하기 위해 소괄호(())로 피연산자를 감싼다
🧩 typeof 연산자
→ 피연산자의 데이터 타입을 문자열로 반환
→ 7가지 문자열로 반환: string, number, boolean, undefined, symbol, object, function
→ null은 object로 평가하기 때문에 typeof 연산자가 아닌 일치 연산자 ===를 이용하자
🧩 지수 연산자
→ 좌항의 피연산자를 밑으로, 우항의 피연산자를 지수로 거듭 제곱하여 숫자 값을 반환한다
→ 지수 연산자 도입 전에는 Math.pow 메서드를 사용했다
2 ** 2; // 4
Math.pow(2,2); // 4
🧩 그 외의 연산자
→ ?., ??, delete, nuew, instanceof, in 등 9, 10, 17, 19 장에서 깊게 다루도록 하겠다
'HTML+CSS+JavaScript > DeepDive' 카테고리의 다른 글
7장 연산자: 코어 자바스크립트2 (0) | 2022.07.28 |
---|---|
7장 연산자: 코어 자바스크립트1 (0) | 2022.07.26 |
6장 데이터 타입 (0) | 2022.07.20 |
5장 표현식과 문 (0) | 2022.07.13 |
4장 변수와 상수 (0) | 2022.07.10 |