Summary

• 표준 내장 객체(Date)
• 재귀 함수
• 데이터 불변성 & 가변성
• 비동기 패턴 (promise, async/await)

표준 내장 객체

Date

new Date()

변수에 담으면 호출 시간을 표시하기 때문에 현재 시간을 사용하려면 명령에 직접 넣어서 console.log(new Date~~~) 형식으로 사용해야 한다.

• getFullYear
• getMonth
  0부터 시작(1월=0, 12월=11), N월을 얻으려면 N-1.
• getDate
• getDay
  0(일요일) ~ 6(토요일). switch문으로 작성하기 용이하다. (case 0: 일요일)
• getHours
  24시간 표기법으로 표현.
• getMinutes
• getSeconds
• moment.js & day.js
  날짜 표기에 유용해서 예약 서비스에 많이 쓰인다.

재귀(recursive) 함수

함수 자신을 내부에서 한번 더 호출하는 함수.
함수의 이름과, 무한반복 되기 때문에 종료 조건이 필요하다.

let i = 0
function abc() {
  console.log(i)
  i += 1
  if (i < 10) {
    abc()
  }
}

데이터 불변성 & 가변성

원시형 데이터는 메모리를 1개 사용한다. 즉, a=1, b=1 일때 a,b는 같은 메모리를 쓴다.
원시/참조형 메모리 사용 차이 정리 필요!

비동기 패턴

과제 안내의 요청 예시 보면 주소에 물음표와 함께 쿼리 스트링이 있다.
JS는 기본적으로 싱글 스레드, 한번에 하나씩 처리한다.
fetch().then() 구문을 사용한다.

// request & response

// 전송
fetch('https://www.omdbapi.com?apikey=7035c60c&s=frozen')

// 수신
fetch('https://www.omdbapi.com?apikey=7035c60c&s=frozen')
  .then(res => res.json())	// 못생긴 애
  .then(res => {	// 2번째 then부터 내용
    console.log(res)
  })

fetch 대신 axios를 사용하기도 한다. main.js 앞에 붙여넣고 사용한다(axios cdn 참고).
async, await 패턴 찾아보기!

Promise

과제 수행 시 참고 코드

let res = fetch('https://omdbapi.com/?apikey=7035c60c&s=frozen')
res = res.then(res => res.json())
res.then(res => console.log(res))

//
function getMovie(cb) {
  fetch('https://omdbapi.com/?apikey=7035c60c&s=frozen')
    .then(res => res.json())
    .then(res => {
      cb(res)
    })
}

getMovie(movies) => {
  console.log(movies)
}

//
function imageLoad(src, cb) {
  const imgEl = document.createElement('img')
  imgEl.src = src
  imgEl.addEventListener('load', () => {
    cb()
  })
}

imageLoad('https://gstatic.com/webp/gallery/1.jpg', () => {
  console.log('Done!')
})