TiL33 10. 25. 14일차 TIL - 실행컨텍스트, 이벤트루프, 클로저 1. 실행 컨텍스트 (Execution Context)* 실행 컨텍스트란?자바스크립트 코드를 실행하는데 필요한 환경을 제공하는 객체자바스크립트 엔진이 코드를 평가하고 실행하는 데 필요한 정보를 담고 있는 공간이다.자바스크립트는 싱글스레드로 동작하는 언어라고 한다.→ 한번에 하나의 작업만 수행할 수 있음을 의미1) 단계 평가 단계 (컴파일 단계) : 레코드 수집(호이스팅) 및 상위 스코프(Outer)를 결정하는 단계실행 단계 (런타임 단계) : 함수 실행 시 실행 컨텍스트를 콜 스택에 푸쉬하고 변수에 값을 할당하는 단계2) 구성 요소VE(Virable Environment)평가 단계에서 호이스팅이 이루어지는 공간.변수가 메모리에 할당되는 변수환경* 식별자 : 변수 또는 함수의 이름. LE(Lexical E.. 2024. 10. 25. 10. 24. 13일차 TIL - async&await, this, scope 15일부터 개인과제를 진행했고, 18일 저장을 하지 않은 채 정전되는 바람에 html구조와 css 이외의 작업한 코드들이 모두 사라져버렸다.. 자동저장을 설정해놓지 않은 나를 원망해야한다.. ㅠㅠ 오늘은 과제 진행 중 tmdb에서 api를 받아오는 방법 리펙토링하는 방법과, scope의 개념에 대해 정리하려고 한다.1. fetch API data 리펙토링하기 ( async, await ) TMDB에서 API를 가지고 오는 JS 코드는 다음과 같다.코드를 해석하면 이렇다.1. fetch를 통해 원하는 url에서 데이터를 가져온다.2. 그 이후 res => res.json()를 실행한다.3. 그 이후 res => console.log(res)를 실행한다.4. 만약 오류가 발생하면, console에 에러를 표.. 2024. 10. 24. 10. 17. 12일차 TIL - 개인과제 레이아웃 오늘은 개인과제를 깃허브에 올리고 기초 html 코드 작성과 간단한 레이아웃을 만들었다. 만들려고 하는 사이트의 모습은 다음과 같다. 1. Header헤더 안에 로고와 메뉴, 검색창, 검색버튼이 배치되어 있다.검색창은 엔터를 칠 때도 정보가 전송되게 할 예정이다. 2. Main메인에는 저번 시간 TMDB에서 연동한 API로 원하는 영화의 정보를 받아오고 그 정보를 시각적으로 보여줄 수 있는 카드를 만들 예정이다. 이 때 보일 카드는 창 화면 크기에 따라 딱 맞도록 조절하고 싶은데 일단 필수 기능구현을 먼저 한 이후 여유가 있다면 추가적으로 작업해볼 것 같다.3. Footer이왕 사이트를 만들게 되었는데 footer가 없으면 허전할 것 같았다. 딱히 중요한 정보가 들어가진 않았지만 내가 만들었다는 것 정도.. 2024. 10. 17. 10. 16. 11일차 TIL - TMDB API 사용법 개인과제에 대한 일정을 안내받았다. 이번 과제의 목표는 진짜 영화 정보를 제공하는 검색 사이트를 만드는 것이다. 이번 과제의 진행 일정은 아래와 같다. 일정을 보았을 때 이번 과제에서 가장 중요한 것은 API 연동이라 생각한다. 그렇다고 다른 일정이 쉬워보이는 것도 아니다.. 화이팅!! 그래서 오늘은 TMDB에서 AIP키를 사용하는 방법에 대해 알아보았다.1일 : TMDB API 연동 및 데이터 가져오기2일 : 영화 카드 리스트 UI 구현하기 3일 : 영화 검색 기능 고도화하기 4일 : 이벤트 위임 적용하기5일 : 로컬 저장소 활용한 북마크 기능 구현하기6일 : ansyc / await로 API 호출 리펙터링하기 7일 : 디버깅 및 최종 제출 준비하기1. TMDB API 사용법TMDB란? The Movi.. 2024. 10. 16. 10. 15. 10일차 TIL - 콜백함수와 제어권 3주차의 내용이 아직 다 정리가 되지 않아 업데이트를 하지 못하고 있다.. (그치만 중요한 내용이 너무 많고 이해하기 어려운 내용 또한 많다..) 오늘은 3주차 강의의 내용을 느낌적으로 이해한 뒤 4주차 강의를 수강하였고 콜백함수의 정의와 제어권에 대한 개념을 학습했다.1. 콜백함수 ( Callback Function )콜백함수란 다른 코드의 인수로서 넘겨주는 함수를 의미한다.(다른 함수의 매개변수로 들어가는 함수라고 생각해도 좋을 것 같다.) 다른 코드의 인수로 넘겨준다는 것을 다시 생각하면 넘겨받는 함수가 존재한다는 의미이다.이러한 함수의 예로 이전에 배웠던 forEach, setInterval 등을 생각할 수 있다. forEach나 setInterval의 경우 콜백 함수(cb)를 필요에 따라 적잘한.. 2024. 10. 15. 10. 14. 09일차 TIL - 코딩컨벤션, 알고리즘-복잡도 오늘은 달리기반의 첫 이론수업이 있는 날이었다.수업 내용은 1주차 강의 내용을 복습하는 것과 함께 코딩 컨벤션에 대해 배웠다.1. 코딩컨벤션 (Coding Convention) 이란?코드를 읽는 사람과 작성하는 사람이 모두 쉽게 이해할 수 있도록 하는 일종의 약속이다.쉽게 말해 누가 봐도 쉽게 알아볼 수 있도록 이름을 짓는 방법이다.1) 코딩 컨벤션 종류camelCase : 주로 변수와 함수 선언에 사용된다.kekbab-case : 페이지, pathname, 폴더명, css className에 사용된다.snake_case : 파이썬에서 많이 쓰인다. js에서는 잘 사용하지 않으나,대문자 표현은 상수 표현할 때 많이 사용된다.ex) const MILLISECONDS_PER_DAY = 60 * 60 * 24.. 2024. 10. 14. 이전 1 2 3 4 5 6 다음
