코딩/Javascript
연산자
junhub
2023. 3. 5. 16:33
증감 연산자
let count = 1
const preIncrement = ++count
// 증감연산자를 앞에 놓게 되면 아래 주석으로 처리한 두 줄의 코드와 같은 내용입니다.
// 먼저 자기 자신에게 1을 더해서 재할당 한 후, 이를 preIncrement 에 할당했다는 의미입니다.
// count = count + 1
// const preIncrement = count
console.log(`count: ${count}, preIncrement: ${preIncrement}`) // count: 2, preIncrement: 2
템플릿 리터럴 (Template literals)
백틱(``) 을 사용하여 문자열 데이터를 표현할 수 있다. 이중 따옴표나 작은 따옴표로 문자열을 표현할 때보다 간결하게 문자열 붙이기가 가능하다. 백틱을 사용하고 $ { }을 사용하면 해당 변수에 접근할 수 있다.
let count = 1
const postIncrement = count++
// 증감연산자를 뒤에 놓게 되면 아래 주석으로 처리한 두 줄의 코드와 같은 내용입니다.
// postIncrement에 자기 자신의 값을 먼저 할당하고, 이후에 1을 더해서 재할당합니다.
// const postIncrement = count
// count = count + 1
console.log(`count: ${count}, postIncrement: ${postIncrement}`) // count: 2, postIncrement: 1
여기서 count 변수를 const 가 아닌 let으로 선언한 이유는 증감연산자를 활용해 count의 값을 계속 해서 증가(변화) 시키고 또 다시 count 에 할당하고 있기 때문에 재할당을 할 수 없는 const 를 사용하면 에러가 발생한다.
const shirtsPrice = 100000
const pantsPrice = 80000
let totalPrice = 0
totalPrice += shirtsPrice // totalPrice = totalPrice + shirtsPrice 와 동일
console.log(totalPrice)
totalPrice += pantsPrice // totalPrice = totalPrice + pantsPrice 와 동일
console.log(totalPrice)
totalPrice -= shirtsPrice // totalPrice = totalPrice - shirtsPrice 와 동일
console.log(totalPrice)
여기서도 마찬가지로 totalPrice는 계속 재할당 되므로 const가 아닌 let으로 변수 선언을 해야 한다.
논리연산자
let isOnSale = true
let isDiscountItem = true
console.log(isOnSale && isDiscountItem) // true && true 이므로 true
console.log(isOnSale || isDiscountItem) // true || true 이므로 true
isOnSale = false
console.log(isOnSale && isDiscountItem) // false && true 이므로 false
console.log(isOnSale || isDiscountItem) // false || true 이므로 true
isDiscountItem = false
console.log(isOnSale && isDiscountItem) // false && false 이므로 false
console.log(isOnSale || isDiscountItem) // false || false 이므로 false
console.log(!isOnSale) // !false 이므로 true
|| (or), && (and), ! (not) 과 같은 연산자를 말한다. && 는 연산 대상이 모두 true 여야만 true 리턴
! 는 true를 false로, flase를 true로 바꿔서 리턴
|| 는 연산 대상 중 하나만 true 여도 true 리턴
일치연산자
console.log(1 === 1) // true
console.log(1 === 2) // false
console.log('Javascript' === 'Javascript') // true
console.log('Javascript' === 'javascript') // 대소문자나 띄워쓰기도 다 정확히 일치해야 해요. 따라서 false
=== 세개를 사용해서 두 값이 일치하는 지를 비교한다
console.log(1 === "1") // false를 출력
console.log(1 == "1" // true를 출력
== 와 ===의 차이를 살펴보면 ==는 두 값의 데이터 타입이 일치하지 않을 때 해당 값의 데이터 타입을 자동으로 변환해주는 자바 스크립트만의 특성이 있다. 이 특성으로 인해 자칫 개발자의 실수를 유발할 가능성이 크기 때문에 실무에선 거의 쓰이지 않고 엄밀한 ===(strict)
일치연산자를 사용하는 것이 좋다.