728x90 분류 전체보기89 [PreOnboarding] RTK Query를 사용해보자 과제를 하던 중 전역으로 상태관리를 해야할 부분이 있어 리덕스를 사용하게 되었습니다. 자료를 찾던 도중 리덕스 툴킷에서 제공하는 RTK query를 보게되었고 익혀두면 좋을 것 같아서 공부를 시작햇습니다. API 서비스 생성하기 import { createApi, fetchBaseQuery } from "@reduxjs/toolkit/query/react"; export const contentApi = createApi({ reducerPath: "contentApi", baseQuery: fetchBaseQuery({ baseUrl: "api 베이스가 될 주소!", prepareHeaders: (headers) => { headers.set("헤더에 추가하고 싶은 이름", "값"); return he.. 2022. 2. 23. [PreOnboarding] DOM 이란? DOM 이란? 문서 객체 모델 (The Document Object Model, DOM)은 HTML, XML 문서의 프로그래밍 인터페이스이다. DOM은 문서의 구조화된 표현을 제공하며 프로그래밍 언어가 DOM 구조에 접근할 수 있는 방법을 제공하여 그들이 문서 구조, 스타일 내용 들을 변경할 수 있게 돕는다. DOM은 구조화된 nodes와 property와 method를 갖고 있는 object로 문서를 표현한다. 이들은 웹 페이지를 스크립트 또는 프로그래밍 언어들에서 사용될 수 있게 연결시켜주는 역할을 담당한다. 웹페이지는 일종의 문서다 이 문서는 브라우저를 통해 그 내용이 해석되어 웹 브라우저 화면에 나타나거나 HTML 소스 자체로 나타나기도 한다. 동일한 문서를 사용하여 이처럼 다른 형태로 나타날 수.. 2022. 2. 22. [JS][스코프 클로저] 모듈 모듈 클로저의 능력을 활용하면서 표면적으로는 콜백과 상관없는 코드 패턴들이 있다. 그중 가장 강력한 패턴인 모듈을 살펴보자. function foo() { var something = "cool"; var another = [1, 2, 3]; function doSomething() { console.log(something); } function doAnother() { console.log(another.join("!")); } } 이 코드에는 클로저의 흔적이 보이지 않는다. 우리가 볼 수 있는 것은 몇 가지 비공개 데이터 변수인 something과 another 그리고 내부 함수 doSomething()과 doAnother()가 있다. 이들 모두 foo()의 내부 스코프를 렉시컬 스코프로 가진다. .. 2022. 2. 19. [JS][스코프 클로저] 반복문과 클로저 반복문과 클로저 클로저를 설명하는 가장 흔하고 표준적인 사례는 for 반복문이다. for (var i = 1; i 2022. 2. 18. [JS][스코프 클로저] 클로저 개요 스포크 클로저 이제 자바스크립트에서 굉장히 중요하지만, 자주 잊어버리곤 해서 거의 신화적인 부분인 클로저를 보자. 렉시컬 스코프에 대한 설명을 제대로 이해했다면 클로저는 앞에서 배웠던 것들보다 쉽고 뻔해 보일 것이다. 깨달음 자바스크립트를 사용해봤지만 단 한번도 클로저 개념을 완전히 이해한 적이 없는 이들에게는 클로저가 열반에 드는 것처럼 고된 노력을 들여야 이해할 수 있는 것일지도 모르겠다. 클로저는 렉시컬 스코프에 의존해 코드를 작성한 결과로 그냥 발생한다. 이용하려고 굳이 의도적으로 클로저를 생성할 필요도 없다. 모든 코드에서 클로저는 생성되고 사용된다. 그러므로 여기서 적절히 클로저의 전반을 파악하면 클로저를 목적에 따라 확인하고, 받아들이고, 이용할 수 있다. 깨달음의 순간이 이럴 것이다. "아.. 2022. 2. 18. [JS][호이스팅] 호이스팅이란? 호이스팅 이제 스코프라는 개념에 어느 정도 익숙해졌..나? 어디서 얻허게 선언되는지에 따라 변수가 다른 여러 수준의 스코프에 붙게 되는 과정도 이해했을 것이다. 함수 스코프와 블록 스코프 모두 이점에서는 똑같은 규칙에 따라 작동한다. 한 스코프 안에서 선언된 변수는 바로 그 스코프에 속한다. 선언문이 스코프의 어디에 있는지에 따라 스코프에 변수가 추가되는 과정에 미묘한 차이가 있다. 여기서 그 차이에 대해 살펴보자. 닭이 먼저냐 달걀이 먼저냐 자바스크립트 프로그램이 실행되면 코드가 한 줄 한 줄 위에서부터 차례대로 해석될 것이라고 생각하기 쉽다. 대체로 옳은 생각이지만, 바로 이런 추정 대문에 프로그램을 잘못 이해하는 경우가 있다. 다음 코드를 보자. a = 2; var a; console.log(a);.. 2022. 2. 17. 이전 1 2 3 4 5 6 7 8 ··· 15 다음 728x90