연산자란? 하나 이상의 표현식을 대상으로 연산을 수행하여 하나의 값을 만드는 것.
피연산자(연산의 대상)는 값으로 평가될 수 있는 표현식이어야 한다. 연산자와 피연산자의 조합으로 이루어진 연산자 표현식 또한 값으로 평가될 수 있는 표현식이다.
📌산술 연산자 (arithmetic operator)
- 사칙연산( *, - , + )을 다루는 가장 기본적이면서도 많이 사용하는 연산자.
console.log(1 + 2)
console.log(12 * 7)
console.log(7 / 9)
console.log(7 % 5) //나머지값
📌할당 연산자 (assignment operator)
- 변수에 값을 대입하는 데 사용하는 연산자.
const a = 5
let b = 10
b += a // 15 (b += a === b = b + a)
b -= a // 5
📌증감 연산자
- 피연산자를 1씩 증가 혹은 1씩 감소시킬 때 사용하는 연산자로, 피연산자가 단 하나인 단항연산자이다.
- i++ : 연산 진행 후, 1씩 증가
- ++i : 1 증가 후, 연산 진행
📌 비교 연산자 (comparison operator)
- 피연산자 사이의 상대적인 크기를 판단하여, 참(true)과 거짓(false)을 반환
- <= , ==, ===, >=, <, >, !==
동등연산자(==)는 느슨한 비교로, 피연산자들의 값만 같으면 참을 반환한다.
const a = 1;
const b = "1";
console.log(a == b) // true 반환.
일치연산자(===)는 엄격한 비교로, 피연산자들의 값과 타입이 같으면 참을 반환한다.
const a = 1
const b = '1'
console.log(a === b) // false반환
* 형 변환(Type conversion)에 따라 값이 달라질 수 있으므로 일치연산자(===) 활용을 권장.
불일치연산자(!==)는 일치연산자와 반대로 피연산자들이 다른 지를 비교한다. 값과 타입이 '다르면' 참을 반환한다.
function add(num) {
if (typeof num !== "number") throw new Error("숫자로만 입력해주세요");
//받은 num이 number가 아니면, 에러메시지를 던져라.
return 5 + num;
}
//--------------------------------------------
const a = 1
const b = '1'
console.log(a !== b) // true (a와 b가 다르므로 true를 반환함)
📌삼항 연산자 (ternary operator)
1. ?(물음표)를 기준으로 그 앞의 값을 확인.
2. 그 값이 true면 :(콜론) 앞 부분을 실행, false면 뒷 부분을 실행.
function checkAge(age) { age >= 20 ? console.log("성인입니다") : console.log("성인이 아닙니다") }
// 입력 받은 age값이 20보다 크거나 같으면(참이면) console.log("성인입니다")
// 입력 받은 age값이 20보다 작으면(거짓이면) console.log("성인이 아닙니다")
📌 논리 연산자 (logical operator)
- 논리식을 판단하여, 참(true)과 거짓(false)을 반환.
- 조건문에서 거짓을 참으로 바꿔주거나(!) 다중 조건(&&, ||)을 지정해 줄 때 많이 사용.
- &&(AND): 모든 값이 참이면 참을 반환한다. (하나라도 false면 false. 첫 번째 falsy값을 반환.)
- || (OR): 하나라도 참이면 참을 반환한다. (하나라도 true면 true. 첫 번째 truthy값을 반환.)
- ! (NOT): 결과가 참이면 거짓, 거짓이면 참을 반환한다. (반대의 의미)
function createUser(name, age, gender) {
// Case A: ||(OR)를 썼기 때문에 둘 중 하나라도 해당하면 에러메시지를 보낸다.
if (age <= 19 || gender === "M") {
// 나이가 19살 이하이거나, 성별이 남자면
throw new Error("가입조건에 맞지않습니다.")
}
// Case B: &&(AND)를 썼기 때문에 둘 다 해당해야만 함수를 실행한다.
if (age >= 20 && gender === "W") {
// 나이가 20살 이상인지 확인하고, 성별도 남자인지 확인한다.
// 해당 조건이 충족하는 애들에 대해서만 함수를 실행하도록.
}
}
// * AND 연산자 : 모든 값이 true이어야 함. 하나라도 false값이 있으면 false 반환.
// * OR 연산자 : 하나라도 "true"값이 있으면 true 반환.
// * NOT 연산자 : 특정한 데이터의 반대값이 출력됨. true => false, false => true 출력.
💡 NOT연산자를 2번 써주면(!!) Boolean타입이 되어서 true인지 false인지 확인할 수 있다.
(!!a && true) 이런식으로 써주는 것을 권장
1. 논리연산자를 사용한 단축 평가
AND 연산자(&&)와 OR 연산자(||)가 표현식을 평가하는 도중에 평가 결과가 확정되면, 나머지 평가 과정을 생략하는 것.
논리곱(&&)
- 연산자(&&)를 기준으로 좌→우로 실행.
- 모두 참이어야 참을 반환하기 때문에 우항에서 결과가 확정되고, 모두 참이면 결과를 확정짓는 우항을 그대로 반환해준다.
- 하나라도 거짓이면 거짓이기 때문에, 좌항에서 거짓이면 좌항을 반환하고 그대로 실행을 종료한다.
한줄요약: 참 → && 뒤의 값, 거짓 → && 앞의 값 반환. (첫 번째 falsy를 찾고, 반환한다.)
논리합(||)
- 연산자(||)를 기준으로 좌→우로 실행.
- 하나라도 참이면 참을 반환하기 때문에 좌항이 참이면 바로 좌항값을 반환해준다.
한줄요약: 참 → || 앞의 값, 거짓 → || 뒤의 값 반환. (첫 번째 truthy를 찾고, 반환한다.)
참고 https://ko.javascript.info/logical-operators
2. Truthy와 Falsy
boolean을 기대하는 문맥 (if, && 연산자, 삼항 연산자 등)에서 true로 평가, false로 평가 되는 값
- falsy (거짓 같은 값): ⭐ 0, undefined, false, null, NaN, ""(빈 문자열) ⭐
- Truthy (참 같은 값): falsy를 제외한 나머지.
📌 null 병합 연산자
- '??' : null과 undefined인지만 체크하는 연산자. (falsy한 값은 포함하지 않는다.)
- 첫 번째 정의된(defined) 값을 반환
- a ?? b : a가 null도 undefined도 아니면 a, 그 외에는 b 반환.
💡null병합 연산자 사용예시.
'?' 만 써서 삼항연산자를 사용하면, 0도 false로(값이 없는걸로) 취급하기 때문에, 결제정보시스템 등에서 0원인 것도
정보가 없는 것으로 취급하는 경우가 생긴다. 그럴 때 확실히 null 병합 연산자를 써주면 유용하다.
'TIL archiving ···.ᐟ > JavaScript + TypeScript' 카테고리의 다른 글
[노트내용정리] 전개 연산자(Spread Operator) & 구조 분해 할당(Destructuring) (0) | 2024.08.29 |
---|---|
[노트내용정리] 조건문과 반복문 (0) | 2024.08.28 |
[노트내용정리] 함수 (Function) (0) | 2024.08.28 |
[노트내용정리] 변수의 타입 - 객체타입 (0) | 2024.08.28 |
[노트내용정리] 변수의 타입 - 원시타입 (0) | 2024.08.27 |