본문 바로가기

💻 DEV/Javascript & NodeJS20

[NodeJS] NodeJS 는 Single Thread 일까? Multi Thread 일까? ✨ 고민이 시작된 계기 JS 기초를 학습하던 당시에는 스레드와 프로세스의 기본 개념을 학습해두기만 하고, 구체적으로 살펴보지 못했었다. 웹개발 교육과정이 끝나갈 무렵, 실시간 줌 강의에서 크루분께 "JS 는 싱글 스레드일까요?" 라는 질문을 들었고, 내 대답은 당연히 "yes" 였는데, 의외로 "No" 라는 반응도 많았다. 다들 조금씩 다르게 알고 있는 이유가 궁금해서 구글링을 해 보니, 헷갈릴만한 이유가 있다는 생각이 들었다. 이번 글에서는 JS, 그리고 NodeJS 가 과연 Single Threaded 인지 Multi Threaded 인지 훝어보도록 하겠다. ✨ 프로세스와 스레드 (Process & Thread) 프로세스와 스레드는 이전 글에서 이미 한 번 다룬 적이 있으니, 간단히만 짚고 넘어가겠다.. 2021. 9. 6.

[Javascript] 구조분해 할당 ✨ 구조분해 할당(Destructuring)이란? 배열이나 객체의 속성을 해체하여 값을 개별 변수에 담을 수 있게 해주는 표현식이다. Python 등의 언어에도 동일한 기능이 존재한다. // 구조분해 할당 : 배열 let [a, b] = [1, 2] console.log(a) // 1 console.log(b) // 2 let x = [1, 2, 3, 4, 5]; let [y, z] = x; console.log(y); // 1 console.log(z); // 2 // 구조분해 할당 : 객체 let {a, b} = {a: 4, b: 10} console.log(a) // 4 console.log(b) // 10 let {x} = {x: 10} let {y} = {y: 20} let z = {x, y} .. 2021. 6. 5.

[Javascript] JSON ✨ JSON 이란? Javascript Object Notation 의 약자로, XML (Extensible Markup Language) 이나 YAML 과 같은 데이터 형식 (객체) 중 하나이다. 용량이 작고 직관적으로 읽고 쓸 수 있다는 장점 덕분에 대부분의 웹 API 나 Configuration 파일에 활용된다. Javascript 와의 호환성도 높으며, 대부분의 프로그래밍 언어에 JSON 데이터를 파싱할 수 있는 내외장 모듈이 존재한다. (ex: python 의 json 모듈) XML vs JSON // xml Tove Jani Reminder Don't forget me this weekend! // JSON { "squadName": "Super hero squad", "homeTown": ".. 2021. 6. 5.

[Javascript] ExpressJS (Intro) ✨ Express란? Nodejs 를 위한 웹 서버 프레임워크이다. ✨ 기본 사용 안내 설치: npm install express 서버 연결: const express = require('express') const app = express() const port = 3000 app.get('/', (req, res) => { res.send('Hello World!') }) // '/' 로 라우팅 되지 않는 url 에 대한 get 요청에 대해서는 전부 404 에러가 반환된다 app.listen(port, () => { console.log(Example app listening at http://localhost:${port}) }) 웹 앱 뼈대 구성 : npx express-generator ✨ 라우.. 2021. 6. 5.

[Javascript] Fetch API ✨ Fetch API 란? 원격 API를 호출할 수 있도록 하는 함수이며, 전달인자로 url 과 options 를 받는다. url 에는 API 주소를 입력하고, options 에는 request 내용을 세부적으로 추가한다. let url = 'http://something.com' let options = { method: 'POST', body: JSON.stringify({ username:"아이스", text:"아메리카노" }), headers: { 'Accept': 'application/json', 'Content-Type': 'application/json' } } fetch(url, options) .then((response) => console.log("response:", respons.. 2021. 5. 27.

[Javascript] Async 함수와 Await ✨ Async 함수란? Promise 를 조금 더 편리하게 사용할 수 있는 함수이다. 함수 선언 앞에 async 키워드를 붙여서 사용할 수 있으며, 해당 함수는 항상 Promise 를 반환한다. 또한, return 값이 Promise 가 아니더라도 Resolved Promise 로 해당 값을 감싸서 반환한다. async function Callback(){ // some code here } ✨ Await 이란? Async 함수 내부에서만 호출 가능한 키워드이다. Promise 가 처리될 때까지 함수 실행을 기다린 후에 결과를 반환하도록 한다. 프라미스가 처리되길 기다리는 동안에 엔진이 다른 일을 할 수 있도록 한다. async function f() { let promise = new Promise((.. 2021. 5. 27.

[Javascript] Promise (프로미스) ✨ Promise 란? 향후 사용하게 될 비동기 연산의 결과값을 처리하도록 도와주는 JS 객체이다. 비동기 메서드에서 동기 메서드처럼 값을 반환할 수 있다. 예제) const testing = new Promise((resolve, reject) => { if (something) resolve(something) else reject(error message) }) testing .then(() => return something2) .catch(() => return error) .finally(() => return final) ✨ Promise 의 3가지 상태: Fulfilled: 연산이 성공적으로 완료된 상태이다. Rejected: 연산이 실패한 상태이다. Pending: Resolve 나 Re.. 2021. 5. 27.

[Javascript] 비동기, 동기 함수 (Asynchronous, Synchronous) 란? ✨ Synchronous vs Asynchronous 동기식: 코드의 execution 이 요청과 동시에 일어나며, 순차적으로 실행된다. 비동기식: 코드의 execution 이 요청과 동시에 일어나지 않으며, 병렬적으로 실행된다. 예시) 작업 목록: 1. 화면에 영상 목록을 띄워라 2. 첫 번째 영상을 틀어라 3. 하단에 추천 영상 목록을 띄워라 동기식: 1 실행 -> 2 실행 -> 영상 정보 요청 -> 영상 정보 수신 -> 영상 출력 -> 3 실행 비동기식: 1 실행 -> 2 실행 -> 3 실행 |_ 영상 정보 요청 -> 영상 정보 수신 -> 영상 출력 동기식 방법을 따르면 첫 번째 영상의 데이터가 모두 들어오고, 끝까지 재생되기 전까지는 3을 실행할 수 없다. 비동기식 방법을 따를 경우, 2가 실행되.. 2021. 5. 27.

[Javascript] Class ✨ Class 란? 객체를 생성하기 위한 템플릿이다. ES6부터는 class 키워드로 생성할 수 있다. class Student{ constructor(name, age, major){ // constructor(생성자) 함수, 그리고 instance 의 properties(attributes) //instance 속성 정의 this.name = name; this.age = age; this.major = major; // this = 생성되는 인스턴스 } } Class 의 특징: - 함수형 Class 는 호이스팅이 일어나지만, 선언형 Class 는 호이스팅이 일어나지 않는다. - 클래스 안에는 하나의 constructor 메서드만 존재할 수 있으며, 여러 개의 constructor 메서드가 있을 경우.. 2021. 5. 13.

이전 1 2 3 다음

티스토리툴바