1장
서버에 관하여
(1)서버: 네트워크를 통해 클라이언트에 정보나 서비스를 제공하는 컴퓨터 또는 프로그램
(2)클라이언트: 요청을 보내는 주체로 브라우저, 데스크톱 프로그램, 모바일 앱, 다른 서버에 요청을 보내는 서버 등이 있다.
2.
이벤트 루프: 이벤트 발생 시 호출할 콜백 함수들을 관리, 호촐된 콜백 함수의 실행 순서를 결정하는 역할 담당
백그라운드: setTimeout 같은 타이머나 리스너들이 대기하는 곳, 여러 작업이 동시에 실행될 수 있다.
태스크 큐: 이벤트 발생 후, 백그라운드에서는 태스크 큐로 타이머나 이벤트 리스너의 콜백 함수를 보낸다. 정해진 순서대로 콜백들이 줄을 서 있으므로 콜백 큐라고도 한다.
논 블로킹: 이전 작업이 완료될 때까지 대기하지 않고 다음 작업을 수행
블로킹: 이전 작업이 끝나야먄 다음 작업 수행
*블로킹 방식보다는 논 블로킹 방식이 같은 작업을 더 짧은 시간에 처리할 수 있다.
프로세스: 운영체제에서 할당하는 작업의 단위, 노드나 웹 브라우저 같은 프로그램은 개별적인 프로세스
스레드: 프로세스 내에서 실행되는 흐름의 단위,
- 프로세스는 스레드를 여러 개 생성하여 여러 작업을 동시에 처리할 수 있다.
- 스레드들은 부모 프로세스의 자원을 공유할 수 있다.
- 같은 주소의 메모리에 접근 가능하므로 데이터를 공유할 수 있다.
*노드: 싱글 스레드, 논 블로킹 방식 채택
→노드를 실행하면 프로세스가 하나 생성되고 생성된 프로세스에서 스레드들을 생성하는데 이때 내부적으로 스레드를 여러 개를 생성한다. 그러나 그중에서 직접 제어할 수 있는 스레드는 하나 뿐이다. 그래서 노드가 흔히 싱글 스레드라 여겨짐
노드의 장점
- 멀티 스레드 방식에 비해 적은 컴퓨터 자원 사용
- l/O 작업이 많은 서버로 적합
- 멀티 스레드 방식보다 쉬움
- 웹 서버가 내장되어 있음
- 자바스크립트를 사용함
- JSON 형식과 쉽게 호환됨
노드의 단점
- 기본적으로 싱글 스레드라서 CPU 코어를 하나만 사용
- CPU 작업이 많은 서버로는 부적합
- 하나뿐인 스레드가 멈추지 않도록 관리가 필요
- 서버 규모가 커졌을 때 서버를 관리하기 어려움
- 어중간한 성능
2장
2.자바스크립트 문법 정리
(1) const, let
const,let 공통점: 블록 scope를 가질 경우 블록 밖에서는 변수에 접근 불가
const,let 차이점:
- const: 한 번 값을 할당하면 다른 값을 할당할 수 없음, 초기화할 때 값을 할당하지 않으면 에러 발생
- let:한 번 값을 할당한 후 다른 값 할당 가능
—> 변수 선언에는 기본적으로 const를 사용하고, 재할당이 필요한 경우에 let을 사용하는 것이 좋다.
const a=0;
a=1; // 오류, const로 선언하였기에 다른 값으로 변경 불가능
let b=0;
b=1; // 1, let은 선언 후 다른 값으로 변경 가능
const c; // const로 선언하기 위해서는 초기화할 때 값을 할당해야 함
(2) 템플릿 문자열
: 문자열 안에 변수를 넣을 수 있도록 함 , 더하기 기호 없이 문자열에 넣을 수 있다.
형식:${변수}
var num=1;
var num=2;
var result=3;
var string1=`${num1} 더하기 ${num2}는 '${num3}'`;
console.log(string1);
(3) 화살표 함수
- 화살표 함수: function 선언 대신 ⇒ 기호로 함수 선언
//기존 함수
function add1(x,y){
return x+y;
}
//화살표 함수
const add2=(x,y)=>{
return x+y;
}
//화살표 함수 내부에 return문밖에 없는 경우에는 중괄호 생략 가능
const add3=(x,y)=>x+y;
(4) 클래스
클래스: 다른 언어처럼 클래스 기반으로 동작하는 것이 아니라 여전히 Prototype 기반으로 동작
- 기본 문법
클래스 생성 후 new MyClass()를 호출하면 내부에서 정의한 메서드가 들어 있는 객체가 생성
class Myclass{
//메서드 정의
constructor() {..} // 생성자 메서드, 객체의 기본 상태를 설정
method1() {....}
}- 예시
class User {
constructor(name) {
this.name = name;
}
sayName() {
alert(this.name);
}
}
// 사용법:
let user = new User("yerim");
user.sayName();new User(”yerim”) 호출 시
- 새로운 객체가 생성
- 넘겨 받은 인수와 함께 constructor가 자동으로 실행, 이때 인수 “yerim” 이 this.name에 할당
- user.sayName() 같은 객체 메서드를 호출할 수 있다
*주의: 메서드 사이엔 쉼표가 없다.
(6)프로미스: 실행은 바로 하되 결괏값은 나중에 받는 객체
//예제1)
const condition= ture; //true면 resolve, false면 reject
//먼저 프로미스 객체 생성
const promise=new Promise((resolve,reject)=>{
if (condition){
resolve('성공');
}
else{
reject('실패')}
});
promise
.then((message)=>{
console.log(message); // 성공 (resolve) 한 경우 실행 -> message='성공'
})
.catch((error)=>{
console.error(error); //실패 (reject) 한 경우 실행 -> error='실패'
})
.finally(()=>{
console.log('무조건'); // 끝나고 성공/실패 여부와 상관없이 실행
});-결괏값은 실행이 완료된 후 then이나 catch 메서드를 통해 받는다.
//예제2)
const condition= ture; //true면 resolve, false면 reject
//먼저 프로미스 객체 생성
const promise=new Promise((resolve,reject)=>{
if (condition){
resolve('성공');
}
else{
reject('실패')}
});
//then이나 catch에서 다시 다른 then이나 catch를 붙일 수 있다.
promise
.then((message)=>{
return new Promise((resolve,reject)=>{ //프로미스 수행 후 다음 then 호출
resolve(message);
});
})
.then((message2)=>{ //처음 then에서 message resolve한 값을 받아옴
console.log(message2);
return new Promise((resolve,reject)=>{
resolve(message2);
});
})
.then((message3)=>{
console.log(message3);
});
})
})
.catch((error)=>{
console.error(error); //실패 (reject) 한 경우 실행 -> error='실패'
})//프로미스 여러 개를 한 번에 실행
const promise1=Promise.resolve('성공1');
const promise2=Promise.resolve('성공2');
//promise.all에 넣으면 모두 resolve될 때까지 기다렸다가 then으로 넘어간다.
//하나라도 reject가 되면 catch로 넘어감
Promise.all([promise1,promise2])
.then((result)=>{
console.log(result); //['성공1','성공2']
})
.catch((error)=>{
console.error(error);
})
-Promise.resolve는 즉시 resolve하는 promise를 만드는 방법
-Promise.reject는 즉시 reject하는 promise를 만드는 방법
-콜백 함수를 프로미스 형식으로 바꿀 수 있다. (단, 메서드가 프로미스 방식을 지원할 경우)
(7) async/await
async: function 앞에 위치
1)
//function 앞에 async를 붙이면 해당 함수는 항상 프로미스를 반환
async funtion f() {
return 10;
}
// resolved 프로미스로 값을 감싼 프로미스가 반환
f().then(alert); // 10
//2) 명시적으로 프로미스 반환
async function f() {
return Promise.resolve(10);
}
f().then(alert); // 10await: 자바스크립트는 await 키워드를 만나면 프로미스가 처리될 때까지 기다린다. 결과는 그 이후 반환함
→말 그대로 프로미스가 처리될 때까지 함수 실행을 기다리게 만든다. 프로미스가 처리되면 그 결과와 함께 실행이 재개된다. 프로미스가 처리되길 기다리는 동안에 엔진이 다른 일을 할 수 있기 때문에 CPU 리소스가 낭비되지 않는다.
-promise.then보다 가독성 좋고 쓰기도 쉽다.
-일반 함수에는 await을 사용할 수 없다.
async function f() {
let promise = new Promise((resolve, reject) => {
setTimeout(() => resolve("완료!"), 3000)
});
// await는 async 함수 안에서만 동작
let res = await promise; // 프로미스가 이행될 때까지 기다림
alert(res); // 3초 뒤 "완료!" 출력
}
f();에러 핸들링
async function f() {
await Promise.reject(new Error("에러 발생!"));
}
async function f() {
throw new Error("에러 발생!");
}
(8)Axios: 브라우저, Node.js를 위한 Promiss API를 활용하는 HTTP 비동기 통신 라이브러리
//axios.get 내부에 new promise가 들어 있으므로 then과 catch를 사용할 수 있다.
axios.get('주소')
.then((result)=>{
console.log(result);
console.log(result.data); // result.data에는 서버로부터 보낸 데이터가 들어있다,{}
})
.catch((error) => {
console.error(error);
});
//프로미스이므로 async/await 방식으로 변경 가능
(async () => {
try {
const result=await axios.get('주소');
console.log(result);
console.log(result.data);
}
catch(error){
consile.error(error);
}
})();
(9)FormData: HTML form 태그의 데이터를 동적으로 제어할 수 있는 기능
//FormData 생성자로 formData 객체 생성
const formData= new FormData();
// append 메서드 : 키-값 형식의 데이터 저장
formdata.append('name','zerocho');
formdata.append('item','orange');
formdata.append('item','melon');
//has 메서드: 주어진 키에 해당하는 값이 있는지 여부 확인
formdata.has('item'); //true
formdata.has('item'); // false
//get 메서드: 주어진 키에 해당하는 값 하나를 가져옴
formdata.get('item'); // orange
//getAll 메서드: 주어진 키에 해당하는 모든 값을 가져옴
formdata.getAll('item'); // ['orange','melon']
formdata.append('test','['hi','zero']');
formdata.get('test'); // 'hi','zero'
//delete 메서드: 현재 키를 제거
formdata.delete('test');
formdata.get('test'); //null
//set 메서드: 현재 키를 수정
formdata.set('item','apple');
formdata.getAll('item'); //apple
*node.js 교과서 교재를 바탕으로 공부한 내용을 가볍게 정리한 정도입니다. 틀린 내용이 있다면 댓글로 지적해주세요!
이제 입문하고 시작하는 단계라 정리가 잘 안되어있을 수 있으니 참고해주세요..!
'Node.js' 카테고리의 다른 글
| Node.js 2주차 공부 (2주차) (0) | 2022.04.18 |
|---|---|
| Node.js 2주차 공부 (0) | 2022.04.13 |