TIL ( CODESTATES) (62) 썸네일형 리스트형 node.js TIL node.js 란 - JavaScript를 compile해주는 엔진 (Chrome V8 JavaScript 엔진)으로 만들어진 - event 기반의 non-blocking 모델로 되어 있어서 속도가 빠른 JavaScript runtime(자바스크립트 구동 환경)이다. node core modules : node와 함께 번들링 되어 있어서 npm에서 install 하지 않아도 require 방식으로 사용할 수 있다. 예) fs, http, url, path npm 이란 - Node Package Manager의 약자로 - 세계에서 가장 큰 오픈 소스 라이브러리 생태계 중 하나이다. - 다운로드 받아야 활용 가능하며 - package.json에 정보들이 들어 있다. package.json 은 - npm을 활.. fetch를 이용해서 웹에서 정보 가져오기 네트워크 요청 - ko.javascript.info fetch JavaScript를 사용하면 필요할 때 서버에 네트워크 요청을 보내고 새로운 정보를 받아오는 일을 할 수 있다. 많은 웹사이트에서는 페이지 자체를 새로 고침하지 않고 해당 정보만 업데이트하기 위해 fetch API를 활용한다. fetch API를 활용하면 특정 url로부터 정보를 비동기적으로 받아올 수 있다. fetch는 IE에서는 지원하지만 그 외 대부분의 모든 브라우저가 지원하고 있다. 기본 문법 let promise = fetch(url, [options]) url : 취득하고자 하는 url options : 선택할 수 있는 매개변후로 method나 header등을 지정할 수 있다. options에 아무것도 넘기지 않으면 request.. 웹에서 데이터가 어떤 형태로 전달되는가 WEB ARCHITECTURE 에서 각 요소들의 역할에 대해 알아본다. 1. browser 컴퓨터는 1과 0의 binary data만 이해할 수 있는데 그럼에도 불구하고 HTML, CSS, JS로 작성한 코드를 컴퓨터에서 볼 수 있는 이유가 바로 browser이다. browser 내부의 V8 engine 등이 있어서 코드를 해독하여 컴퓨터에 전달해주고 다시 컴퓨터의 응답을 받아온다. 웹브라우저 - 위키백과 웹 브라우저는 웹 페이지를 가져오기 위해(웹 문서를 열기 위해) 대부분의 웹 서버가 사용하는 HTTP(hyper-text transfer protocol)로 통신한다. HTTP를 이용해 웹 페이지를 가져올 뿐 아니라 웹 서버에 정보를 송신하기도 한다. 페이지들은 주소처럼 이용되는 URL(uniform .. node.js가 어떻게 파일을 읽나 ( fs.readFile / callback, promise, async&await 구현) 과제 내용 브라우저 환경과는 다르게 node.js 앱은 내 컴퓨터에서 직접적으로 실행되기 때문에 파일을 불러오거나 저장하는 등의 일이 가능하다. node.js에서는 파일을 읽는 비동기 함수를 제공한다. 이를 통해 callback, promise, async&awit 구현을 실습해본다. fs.readFile 공식 API문서 fs.readFile( path, [options], callback ) path : | | | - path에는 파일 이름을 인자로 넘기는데 위와 같이 네 가지 타입이 있다. 보통 문자열로 넘긴다. options : | - encoding, flag 를 넣어줄 수 있다. - optional한 인자로 넣지 않을 수도 있다. 객체 또는 문자열 형태로 넘길 수 있다. - If options .. promise Promise 객체는 비동기 작업이 맞이할 미래의 완료 / 실패와 그 결과값을 나타낸다. 프로미스를 사용하면 비동기 메서드에서 동기 메서드처럼 값을 반환할 수 있다. 다만, 최종 결과는 반환하지는 않고 대신 프로미스를 반환해서 미래의 어떤 시점에 결과를 제공한다. Promise의 3가지 상태 pending (대기) : 이행/거부되지 않은 초기 상태 fulfilled (이행) : 연산이 성공적으로 완료된 상태 rejected (거부) : 연산이 실패한 상태 promise는 대기 중이지 않으며 이행 또는 거부되었을 때 처리(settled)되었다고 말한다. resolved는 promise가 다른 promise의 상태에 맞춰 처리되었거나 상태가 '잠김'으로 되었다는 의미이다. 생성자 promise( ) 속성 P.. callback, promise, async & await 비동기 흐름 제어 callback function : 함수가 인자로 다른 함수를 전달하는 것을 의미한다. function greeting(name){ alert('Hello ' + name); } function userInput(callback) { // 인자로 다른 함수를 받는다. let name = prompt('Please enter your name.'); callback(name); } userInput(greeting) 위 함수를 실행하면 please enter your name 이라는 입력창이 나와서 name을 입력할 수 있다. 코드에서 보면 let name = prompt('Please enter your name.') 이라는 부분을 실행한 것이다. 그리고 name으로 Kate를 입력하면 callback(.. async 공부하기 전 setTimeout , setInterval 이해하기 얼마 만에 하는 공부이고 얼마 만에 적는 TIL인지 모르겠다. 끝도 나지 않는 코로나... 내 공부를 망치고서야 끝날건가. 두고보자. 씩-씩- setTimeout, setInterval을 공부하는 이유 비동기 상황을 가장 쉽게 만들어 볼 수 있는 방법이 타이머 API를 이용하는 방법이라고 한다. 나는 아직 setTimeout이나 setInterval 등의 타이머 API를 사용하는 방법이 익숙하지 않다. 이번부터는 공식 문서를 자.세.히 읽는 데에 익숙해지기 위해 가능한 공식문서의 순서에 따라 내용을 정리하고 틀을 따르려고 한다. 단, 내가 이해하기 쉽게 정리하고, 설명하는 말투로 적어보려고 한다. 공부 목표 1. setTimeout, setInterval의 사용법 알기 2. 두 가지의 차이점 알기 3. .. Kahoot Review - Inheritance pattern 다음 코드의 결과는? human에는 정의된 hello 메소드가 없으니까 그 부모인 Person을 탐색해본다. Person에도 정의된 hello메소드는 없으므로 답은 undefined가 된다. (잘못 생각한 부분) -> Student.prototype = Person.prototype 이라고 명시한 부분 때문에 Person.prototype.hello()를 입력하면 'hello, world' 가 콘솔에 나오게 된다. 그 때문에 Person의 인스턴스인 human에서도 hello 메서드가 출력된다. 답 : 'hello, world' 다음 코드의 결과는? Student.prototype에 위 문제에서처럼 person.prototype을 바로 할당하지 않고 Object.create(Person.prototype.. 이전 1 2 3 4 5 6 7 8 다음
