david's daily developer note

가끔 서비스 페이지가 로드가 안될때, 크롬 개발자 도구를 활용하여, 요청/응답을 확인한다. 정상적인 데이터로 요청했는지, 서버 결과가 정상인지, 응답된 결과가 정상인지를 확인할 수 있다. Network DOC 메뉴 뿐만 아니라, 다양한 메뉴를 지원하는데, WS 에서는 웹소캣 연결 과정과 주고 받는 데이터도 확인할 수 있다. 가끔 서비스 페이지에서 뛰운 팝업 페이지가 로드가 되지 않을때가 있는데, 이때는 팝업을 띄우는 단계의 응답 상태를 확인하고 싶어도, 팝업 자체도 DevTools이 따로 존재해서 애매하다. 이때, 크롬 DevTools 설정에서 "Auto-open DevTools for popups" 옵션을 체크하면, 팝업이 뜰때 자동적으로 DevTools을 실행되고 팝업 오픈과정의 응답 요청의 네트워크..

for...of 반복 가능한 객체의 리스트 순회를 위하여 사용 (Array,Map,Set,String.TypeArray,Arguments.. etc) 반복 가능한 iterable 객체는 배열을 일반화한 객체이고, 이터러블 개념을 사용하면, 어떤 객체든 for...of 반복문을 적용할 수 있다. 이터러블은 이터레이터를 반환하는 [Symbol.iterator] () 를 가진 값이다. for..of가 시작되면, for..of는 Symbol.iterator를 호출하는데, 없다면 에러가 발생한다. Symbol.iterator는 반드시 next가 있는 객체의 iterator를 반환해야한다. 여기서 iterator는 {value, done} 객체를 리턴하는 next()를 가진값이다. 이터러블/이터레이터 프로토콜이란 ..

JavaScript에서 함수는 일급 (first class citizen)이다. 다음은 js에서 함수가 일급인 이유이며, js가 함수형 프로그래밍에 유리하고 인기가 많은 이유이다. #일급 - 값으로 다룰 수 있다. - 변수에 담을 수 있다. - 함수의 인자로 사용될 수 있다. - 함수의 결과로 사용될 수 있다. 다음은 "함수를 값으로 다룰 수 있다"의 예시이다. "a => a + 1" 함수를 값 처럼 다루면서 sum1 변수에 담고 사용하는 예제이다. 함수를 반환하는 고차 함수의 경우에는 클로저(Closure)를 만들어서 반환한다.

비주얼 스튜디오 코드에서 TypeScript(*.ts) 파일을 js파일로 자동 컴파일하는 것을 설정해본다. 1. 터미널을 열고 node.js설치를 확인한다. npm -v node -v 2. node.js가 설치되었다면, 버전이 표시된다. 없다면 설치한다. https://nodejs.org/ko/download/ 3. window 환경에서는 환경 변수를 설정하고 어디서든 npm명령이 수행되도록 한다. 4. VS Code에서 프로젝트를 열고, 터미널에서 다음 명령을 수행한다. npm init 5. 타입 스크립트를 설치한다. npm install -g typescript tsc -v 6. *.ts 파일을 하나 작성하고 컴파일을 수행한다. npm run dev