🤓 슬기로운 개발생활 🤓 슬기로운 개발생활

라이프 사이클이란? 인간의 생명주기를 나눈다면 배에서 태아가 생길 때, 인생에서 큰 사건을 만났을 때, 죽을 때로 나눌 수 있을 것 같다. 마찬가지로 리액트에서도 생명주기를 나눠볼 수 있다. 라이프 사이클은 총 3단계로 정의할 수 있다. 1. Mounting (생성) mounting은 리액트에서 무언가가 consturctor안에서 생성될 때이다(화면에 무언가가 렌더링 되었을 때). mounting 단계에서는 props나 state를 변경해서는 안된다. 2. Updating (업데이트) updating은 어떤 것이 수정될 때를 말한다. 예를 들어 새로운 props를 받을 때, setState()를 실행할 때가 이 단계에 해당된다. 3. Unmounting (삭제) unmounting은 컴포넌트가 삭제될 때..

동기(Synchronous) vs 비동기(Asynchronous) 카페 점원이라고 생각해보자. 손님에게 복숭아 아이스티를 주문받았다. 그럼 아래와 같이 6 단계를 거쳐 손님에게 제공할 수 있다. 1. 주문받기 -> 2초 소요 2. 복숭아티 파우더를 컵에 넣는다(1 스푼) -> 2초 소요 3. 따뜻한 물을 조금 붓고, 파우더를 녹여준다. -> 5초 소요 4. 파우더가 녹았다면, 얼음을 넣고 차갑게 저어준다. -> 3초 소요 5. 물을 적당량 넣어주고 섞어준다. -> 2초 소요 6. 손님에게 제공한다. -> 2초 소요 동기적 실행(synchronous system) 은 하나의 테스크 실행이 완료될 때까지 다른 테스크들은 블로킹(작업 중단) 되는 방식이다. 1명의 손님에게 음료를 제공하기 전까지 다른 손님의 ..

what is 재귀 함수 많은 사람들이 맛집에서 밥을 먹기 위해 줄을 섰다. 현재 나는 줄의 맨 끝에 위치하고 있다. 현재 내가 몇 번째로 대기하고 있는지 알고 싶다면 앞 사람에게 몇 번째인지 물어보면 된다. 만약 앞 사람이 모른다면 앞 사람은 자신의 앞 사람에게 물어보고 이 과정이 반복될 것이다(첫 번째 대기자까지). 나는 앞 사람에게 '저는 5번이에요' 라는 대답을 들었다. 그렇다면 나의 대기번호는 5 + 1 = 6번 이다. 그 과정을 코드를 작성하면 아래와 같다. function getMyPositionInLine(person){ if (person.nextInLine == null){ //앞사람 존재 x return 1; } return 1 + getMyPositionInLine(person.ne..

this let array = []; array.push(1); array.pop(); push, pop, shift, unshift 등 자바스크립트에서는 많은 메서드들을 사용할 수 있다. 메서드들은 자신이 속한 객체(마침표 앞의 객체)의 프로퍼티를 참조하고 변경할 수 있다. 자바스크립트에서 제공하는 메서드들은 이미 자바스크립트에서 정의를 해두었기 때문에 가져다 사용할 수 있다. function Example(){ this.storage = []; } Example.prototype.push = function(){ this.storage.push(1); return 1; } Example 생성자 함수를 생성했다. push 메서드는 storage에 1을 추가하는 메서드이다. 생성자 함수로 인스턴스를 생성..