본문 바로가기

JS8

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. 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. 11. 08일차 TIL - 데이터 타입(심화) 오늘은 강의를 통해 JS의 데이터 타입과 특징에 대해 더욱 자세히 학습하였다.또 변수가 메모리에 할당되는과정과 메모리에 대한 기본 지식을 습득하였다.1. 데이터 타입의 종류 (기본형과 참조형)JS에서 값의 타입은 크게 기본형(Primitive)과 참조형(Reference Type)으로 구분된다.두 타입의 구분 기준은 값의 저장 방식과, 불변성의 여부라고 한다. 1) 복제의 방식기본형 : 값이 담긴 주소값을 바로 복제참조형 : 값이 담긴 주소값들로 이루어진 묶음을 가르키는 주소값을 복제2) 불변성의 여부기본형 : 불변성을 띔 참조형 : 불변성을 띄지 않음. 2. 메모리와 데이터에 관한 배경지식1) 메모리와 데이터비트(bit)컴퓨터가 이해할 수 있는 가장 작은 단위0과 1을 가지고 있는 메모리를 구성하기 위.. 2024. 10. 11.
10. 10. 07일차 TIL - ES6, 일급객체, 알고리즘 오늘은 JS강의를 통해 일급객체의 의미와 저녁 특강으로 알고리즘에 대해 학습하였다.1. 각종 es6 문법ECMAScript6(ES6)는 JavaScript의 버전 중 하나로, 2015년 발표되었다.ES6는 이전 버전인 ES5에서 새로운 문법과 기능을 도입하여JavaScript 개발자들이 보다 쉽고 효율적으로 코드를 작성할 수 있도록 개선되었다.→ 2015년도 대규모 문법적 향상 및 변경이 발생하여 ES6는 항상 언급된다고 한다.let, const화살표 함수 (Arrow Fuction)삼항 연산자 (ternary operator)구조 분해 할당 (Destructuring)배열(Array)의 경우 순서가 중요하다. 객체(Object)의 경우 key가 중요하다.새로운 이름으로 할당하는 방법단축 속성명 (pro.. 2024. 10. 10.