가쟤의 해변일기 🐳

[Javascript] 연산자, 조건문, 반복문 본문

Front-end

[Javascript] 연산자, 조건문, 반복문

바닷가쟤 2023. 7. 18. 11:47

- 연산자, nullish 병합

- 선택적 체이닝 ( ?. )

- 전개 연산자 ( ... )

- 구조 분해 할당

- if, switch 조건문

- for, for of, for in 반복문

- while문, do while 반복문

 


연산자, nullish 병합

&& : and 연산자, 거짓일 때 반환

|| : or 연산자, 참일 때 반환

?? : nullish 병합 연산자로, null/undefined를 제외한 모든 데이터를 반환한다.

특히, || 연산자는 if문, 삼항 연산자를 쓰지 않고도 '조건'이 아닐 경우에 출력할 것을 지정할 수 있다.

return user.address?.city || '주소 없음'  // user.address?.city가 없으면 '주소 없음'을 반환

여기서 ?. <- 선택적 체이닝도 등장한다.

 


선택적 체이닝(Optional Chaning)

점표기법을 사용할 수 없는 데이터(null, undefined)에도 체이닝을 사용할 수 있게 해준다.

 


전개 연산자(Spread Operator)

배열/객체 데이터를 풀어서 출력할 수 있다.

const a = [1, 2, 3]
console.log(...a)  // 1, 2, 3

여기서 ... <- 이게 전개 연산자이다.

 


구조 분해 할당 (Destructing assignment)

배열, 객체 데이터에서 사용하는 것으로 동일한 구조에 맞게 데이터 값을 할당할 수 있다.

const obj = {
  a: 1,
  b: 2,
  c: 3
}  //객체 데이터
const arr = [1,2,3,4,5,6,7,8,9]  // 배열 데이터
const [,,,,,,,,n] = arr  // 배열 데이터는 순서에 맞춰서 !
const {a, c} = obj  // 객체 데이터는 속성 이름으로 찾을 수 있음

구조 분해 할당은 배열과 객체 데이터를 찾는 방식이 다르다. (주석 참조)


if문은 너무 쉬우니...

switch 조건문 !

function price(game) {
  let p
  switch(game) {
    case 'overwatch':
      p = 20000  // let = p , p = 20000 대신에 return 20000 을 사용해도 된다.
      break
    case 'lol':
      p = 1000
      break
    default:
      p = 0
  }
  return 
}

각 케이스마다 명확한 값에 따른 출력을 지정할 때 사용하면 좋다.

 


for문

for (let i= 8; i > -1; i -= 1) {  // 총 9번 반복
  if (i % 2 === 0) {
    continue
  }
  console.log(i)
}

break는 아예 반복을 종료하고, continue는 조건에 만족 되는 건 넘기고 다음 반복을 실행한다.


for of 반복문 : 배열 데이터

for (let i = 0; i < games.length; i += 1) {
  console.log(games[i])
}
// 이 평범한 for문 코드를
for (const a of games) {
  console.log(a)
} 
// 이렇게 작성 가능 ! 이게 for of 반복문 !

for in 반복문 : 객체 데이터

const user = {
  name: 'yuna',
  age: 22,
  isValid: true,
  email: 'seacrab808@naver.com'
}

for (const key in user) {
  console.log(key)
  console.log(user[key])
}

객체 데이터는 순서를 가지지 않는다. 객체 데이터의 개수만큼 반복한다.


while문 : 조건이 참이면 계속 반복하는 반복문

// while문
let n = 0
while (n < 8) {
  console.log(n)
  n += 1
}

// do while문
let n = 0
do {
  console.log(n)  // 먼저 실행 -> 최소 최초 한 번은 실행한다.
} while (n)

 

728x90