개발새발개발/JavaScript

JavaScript - 연산자, 조건문, 반복문

birdsfoot 2025. 1. 6.

연산자

할당 연산자

  • 오른쪽에 있는 피연산자의 평가 결과를 왼쪽 피연산자에 할당하는 연산자
  • 단축 연산자 지원
  let a = 0

  a+= 10
  console.log(a) //10

  a -= 3
  console.log(a) // 7

  a *= 10
  console.log(a) // 70

  a %= 7
  console.log(a) // 0

 

 

 

 

증가 & 감소 연산자

  • ' +=' 또는 '-='와 같이 더 명시적인 표현으로 작성하는 것을 권장

 

증가 연산자 ('++')

  • 피연산자를 증가시키고 연산자의 위치에 따라 증가하기 전이나 후의 값을 반환

 

감소 연산자('--')

  • 피연산자를 감소시키고 연산자의 위치에 따라 감소하기 전이나 후의 값을 반환

 

  let x = 3
  const y = x++
  console.log(x,y) // 4 3

  let a = 3
  const b = ++a
  console.log(a,b) // 4 4

 

 

 

 

비교 연산자

동등 연산자(==)

  • 두 피연산자가 같은 값으로 평가되는지 비교 후 boolean 값을 반환
  • 암묵적 타입 변환을 통해 타입을 일치시킨 후 같은 값인지 비교
  • 두 피연산자가 모두 객체일 경우 메모리의 같은 객체를 바라보는지 판별

 

일치 연산자(===)

  • 두 피연산자의 값과 타입이 모두 같은 경우 true를 반환
  • 같은 객체를 가리키거나, 같은 타입이면서 같은 값인지를 비교
  • 엄격한 비교가 이뤄지며 암묵적 타입 변환이 발생하지 않음
  • 특수한 경우를 제외하고는 동등 연산자가 아닌 일치 연산자 사용 권장

 

논리 연산자

  • and 연산 : &&
  • or 연산 : ||
  • not 연산 : !
  • 단축 평가 지원

 

 

 

조건문

  • if : 조건 표현식의 결과값을 boolean 타입으로 변환 후 참/거짓을 판단
const name = 'customer'

if (name === 'admin'){
  console.log('관리자님 환영해요')
} else if (name === 'customer') {
  console.log('고객님 환영해요')
} else {
  console.log(`반갑습니다. ${name}님`)
}

 

 

 

 

반복문

  • while, for, for...in, for...of

 

while

  • 조건문이 참이면 문장을 계속해서 수행
  • while(조건문) {}

 

let i = 0

while (i<6) {
  console.log(i)
  i += 1
}

 

for

  • 특정한 조건이 거짓으로 판별될 때까지 반복
  • for([초기문]; [조건문]; [증감문]) { action }
  • 실행 순서
    • 반복문 진입 및 변수 i 선언 : 초기문
    • 조건문 평가 후 코드 블럭 실행 : 조건문, action
    • 코드 블록 실행 이후 i값 증가
for (let i = 0; i < 6; i++) {
  console.log(i)
}

 

 

for...in

  • 객체의 열거 가능한 속성(property)에 대해 반복
const fruits = { a: "apple", b: "banana" };

for (const fruit in fruits) {
  console.log(fruit);
  console.log(fruits[fruit]);
}

 

 

for... of

  • 반복 가능한 객체(배열, 문자열 등)에 대해 반복  
const numbers = [0, 1, 2, 3]

for (const number of numbers) {
  console.log(number)
}

 

 

 

for...in과 for...of 비교

 

 

 

 

 

배열 반복과 for...in

 

  • 객체 관점에서 배열의 인덱스는 '정수 이름을 가진 열거 가능한 속성'
  •  
  • for...in은 정수가 아닌 이름과 속성을 포함하여 열거 가능한 모든 속성을 반환
  • 내부적으로 for...in은 배열의 반복자가 아닌 속성 열거를 사용하기 때문에 특정 순서에 따라 인덱스를 반환하는 것을 보장할 수 없음
  • for...in은 인덱스의 순서가 중요한 배열에서는 사용하지 않음
  • 배열에서는 for문, for...of를 사용
  • 객체 관점에서 배열의 인덱스는 정수이름을 가진 속성이기 때문에 인덱스가 출력됨(순서 보장X)

 

 

 

 

반복문 사용 시 const 사용 여부

 

for문

  •   `for(let i = 0; i<arr.length; i++) {...}`의 경우에는 최초 정의한 i를 "재할당"하면서 사용하기 때문에 const를 사용하면 에러 발생

 

for...in, for...of

  •   재할당이 아니라, 매 반복마다 다른 속성 이름이 변수에 지정되는 것이므로 const를 사용해도 에러가 발생하지 않음
  •   단, const 특징에 따라 블록 내부에서 변수를 수정할 수 없음

댓글