1) 동기와 비동기 - 동기 하나 하나씩 처리되는 방식. 요청을 보내고 응답을 받은 후에 다음 일을 시작하는 방식. - 비동기 어떤 작업을 요청을 보낸 다음 그 작업을 다했다는 응답을 받을 때까지 기다리지 않고 바로 다음 일을 시작하는 방식 서버 등에서 데이터를 받아오는 등 시간이 필요한 작업을 해야한다면 응답을 받기까지 계속 기다릴 수 없기 때문에 비동기 처리를 한다. 2) 콜백이란? callback은 특정 함수에 매개변수로 전달된 함수이다. A()가 B()를 콜백으로 받았다면 A()안에서 B를 실행할 수 있다. 콜백 패턴은 자바스크립트가 비동기 처리를 하기 위한 패턴 중 하나이다. 전통적인 콜백 패턴은 일명 콜백 헬로 불리는 엄청난 중첩 문제가 생기기 쉽다. 1.콜백 헬 비동기 처리가 늘어나면 호출이..
1) 자바스크립트와 쓰레드 자바스크립트는 싱글 쓰레드로 동작하는 언어이다. 메인 쓰레드 하나와 콜스택 하나로 구성되어 있다. 비동기 작업을 동시에 할 수 있다. 자바스크립트는 코어 엔진만 가지고 돌아가지 않고 실행환경(런타임)의 도움을 받아 동시 실행을 하기 때문에 동시 실행을 할 수 있다. (WebAPI,(dom, ajax, setTimeout...), Event Queue, Event Loop 등과 함께 동작한다. run-to-completion : 쓰레드가 하나이기 때문에 일을 하나 끝내기 전에는 다른 것은 하지 않는다. 이벤트 루프: 프론트엔드에서 자바스크립트는 혼자 독립 실행되는 것이 아니라 브라우저를 통해 실행된다. 브라우저에서 자바스크립트를 실행할 때에는 이벤트 루프라는 것을 기반해서 실행한..
(1) redux 설치 npm install redux react-redux (2) redux-thunk 설치 npm install redux-thunk (3) index.js import React from "react"; import ReactDOM from "react-dom/client"; import "./index.css"; import App from "./App"; import reportWebVitals from "./reportWebVitals"; import { BrowserRouter } from "react-router-dom"; import { Provider } from "react-redux"; import store from "./redux/store"; const root..
리덕스: state관리 리덕스 과정: UI에서 액션이 생기면 액션이 Dispatch로 간다. 그 액션은 Reducer로 가서 작업지시를 받아서 return을 하면 State에 반환이 된다. Redux의 단점 1. 모든 것을 동기적으로 처리하기 때문에 코드가 순차적으로 진행된다. 그렇기 때문에 비동기 작업은 리덕스로 할 수 없다. 예를 들면 API요청은 서버에 데이터를 요청하고 데이터를 받은 후에 처리해야 한다. 다음 코드를 기다리지 않고 바로 처리하는 것을 비동기 처리라고 한다. 리덕스에서 비동기 처리를 하기 위해 나온 것이 바로 리덕스 미들웨어이다. 리덕스 미들웨어 과정: UI에서 액션이 생기면 액션이 Dispatch로 간다. 그 액션은 Reducer로 바로 가는 것이 아니라 미들웨어에 들려서 미들웨어..
package.json을 열고 입력 ctrl + s하면 사라진다. https://github.com/reactjs/reactjs.org/issues/4186 [ERROR in Plugin "react" was conflicted between "package.json » eslint-config-react-app » C:\Users\asus\desktop\google-clone\no Recently get this error. plz let me know how to fix this. github.com](https://github.com/reactjs/reactjs.org/issues/4186) package.json에서 이 부분을 제거한다. "eslintConfig": { "extends": [ "r..
let names = ["Steven Paul Jobs","Bill Gates","Mark Elliot Zuckerberg","Elon Musk","Jeff Bezos","Warren Edward Buffett","Larry Page","Larry Ellison","Tim Cook","Lloyd Blankfein"] //1.for문 for(let i=0; i{console.log(item, index)})//index는 생략가능 //3.map //반환값을 배열에 담아 반환한다. //(1)모든 데이터 가져올 때 let data = names.map((item)=>{ return item })//index는 생략가능 console.log(data) let ceoList =[ {name:"Larry Page"..
- Total
- Today
- Yesterday
- EVERY
- 느슨한 타입(loosely typed)
- 동적(dynamic) 언어
- redux-thunk
- map
- foreach
- 얕은복사
- find
- redux-middleware
- 참조형 데이터
- undefined
- 기본형 데이터
- null
- some
- 타입변환
- redux
- redux thunk
- 비교 연산자
- 불변 객체
- findindex
- filter
- redux middleware
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |