JS 13

올바르게 객체 복사하기

JS 객체를 함수를 통해 넘길때 call by value 형식을 취하기 때문에 메모리의 이점을 노리지 않는 이상 deep copy를 통해 원본객체를 안전하게 복사하는것이 좋다. 스프레드 연산자와 Object.assign 위의 2가지 방법 ex) ...a , Object.assign 으로는 1단계 까지는 원본 객체를 건드리지않고 복사가 잘되나 Depth가 2단계 이상인 객체는 원본객체가 수정됩니다. 1. 재귀함수 const copy = o =>{ let out = {} let value, key for(key in o){ value = o[key] out[key] = (typeof value === "object" && value != null)? copy(value) : value } return out..

JS 2022.06.30

이터러블 이터레이터 제너레이터

용어 설명 이터러블 이터레이터를 반환하는 [Symbol.iterator]() 라는 키를 가진 값이자 반복할 수 있는 순차적이고 순회적인 객체 Ex) 단순 객체는 [Symbol.iterator]()라는 키가 없기 때문에 이터러블 하지 않습니다. 하지만 Array, Map, Set, String의 경우 [Symbol.iterator]() 라는 키가 있기 때문에 이터러블 합니다. 이터레이터 { value, done} 객체를 반환하는 next() 메서드를 가진 값. 이터러블의 요소를 순회하기 위해 존재하는 하나의 포인터 이터러블/ 이터레이터 프로토콜 이터러블 프로토콜이란 for of spread 연산자, 구조분해 할당을 통해 동작할 수 있는 약속이며 이터레이터 프로토콜은 next 메서드를 통해 다음 로직으로 갈..

JS 2022.05.22

자바스크립트 비동기와 동기

I/O Bound 작업 DB, 파일시스템, 네트워크 등을 다루는 작업 CPU Bound 작업 CPU 자원을 사용하는 일을 다루는 작업 기본적으로 자바스크립트(이하 JS) 의 함수는 콜스택(Call Stack)에 쌓였다가 pop이 되면서 동기적으로 실행된다. 하지만 web APIs의 setTimeout 함수, I/O Bound작업은 콜스택에 쌓인 다음 바로 web APIs의 백그라운드 공간으로 넘어간 후 비동기적으로 완료가 되면 콜백큐(Callback queue)에 쌓이고 이벤트 루프(Event loop)를 이용해 다시 콜스택에 쌓여 호출된다. http://latentflip.com/loupe/?code=JC5vbignYnV0dG9uJywgJ2NsaWNrJywgZnVuY3Rpb24gb25DbGljaygpI..

JS 2022.05.16