01.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
function workP(sec){
//promise 많은 콜백 함수를 사용하다 보면 코드가 복잡하게 중복이 되는 경우 생김 -> 콜백 함수 발생
//코드의 중첩이 많아지는 콜백의 지옥에서 벗어나게 해주는 객체
//promise의 인스턴스를 리턴하고
//then에서 리턴한 것을 받는다.
return new Promise((resolve, reject)=>{ // 서버에 요청 , 응답
//promise 생성시 넘기는 callback = resolve, reject
//resolve 동작 완료시 호출, reject 에러 났을 경우
setTimeout(() => {
resolve(new Date().toISOString());
}, sec*1000);
})
}
workP(1).then((result)=>{
console.log('첫번째 작업', result);
return workP(1);
}).then((result)=>{
console.log('두번째 작업',result);
})
// 첫번째 작업 현재 시간
//두번째 작업 현재 시간
</script>
</body>
</html>
01.js
//console.log('안녕하세요. Node.js');
// const http = require('http'); // 모듈 갖고 오기
// const hostname = '127.0.0.1'; // 서버 주소
// const port = 3000; // 인터넷 경로
const http = require('http');
const hostname = '127.0.0.1';
const port = 3000;
const server = http.createServer((req, res) => {
res.statusCode = 200;
res.setHeader('Content-Type', 'text/plain');//html 의 header부분
res.end('Hello World'); //html의 body부분
});
server.listen(port, hostname, () => {
console.log(`Server running at http://${hostname}:${port}/`);
});
02.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- async / awit
promise 줄였다 사용하는 방법
-->
<script> // workP 작업할 프로미스 줄인 말
function workP(sec){
return new Promise((resolve, reject)=>{
setTimeout(() => {
resolve(new Date().toISOString());
}, sec*1000);
})
}
function justFunc(){
return 'just function';
}
async function asyncFunc() {
return 'async function';
}
console.log(justFunc()); // Promise로 구현될 함수
console.log(asyncFunc()); // 일반함수 구현
console.log(workP()); // async 를 사용한 함수
</script>
</body>
</html>
03-0.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
// 사용자 정의 오류
function sum(a, b){
if(typeof a !== 'number' || typeof y !== 'number'){
throw 'type of arguments must be number type';
//조건 참이면 throw 예외 발생시켜서 오류메시지가 발생
}
console.log(a+b);
}
sum(1, '4');
</script>
</body>
</html>
03-1.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
// 일반적인 예외 처리
function f2(){
console.log('f2함수 시작');
throw new Error('에러');
console.log('f2함수 끝남');
}
function f1(){
console.log('f1함수 시작');
try{
f2(); //예외 상황이 발생할 수 있는 문장
}catch(e){
console.log(e);//예외 상황이 발생했을 경우 처리할 문장 (e는 Exception 객체)
}
console.log('f1함수 끝');
}
f1();
</script>
</body>
</html>
03-2.html
3초 뒤 실행
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
// 일반적인 예외 처리
function wait(sec){
return new Promise((resolve, reject)=>{
setTimeout(() => {
reject('error!');
}, sec*1000);
});
}
// wait(3).catch( e => {
// console.log('1set catch', e);
// });
// // chain(catch의 연속 사용)은 같은 객체를 리턴할 때만 가능하다.
// wait(3).catch(e=>{
// console.log('1set catch', e);
// })//wait 함수의 에러를 받음
// .catch(e=>{
// console.log('1set catch', e);
// })// 위 catch 구문의 상태를 받음. 에러를 잘 받았으므로 에러가 발생하지 x
// chain을 하고 싶을 때
wait(3).catch(e=>{
console.log('1set catch', e);
throw e
})
.catch(e=>{
console.log('1set catch', e);
})
</script>
</body>
</html>
03-3.html
직접 결과 보기
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
//async/ await의 예외처리 1
// async function myasyncFunc(){
// return 'done';
// }
// const result = myasyncFunc(); // 함수 호출이면서도 반환
// console.log(result);//함수오류에 발생하지 않았다면 실행 성공
//async/ await의 예외처리 2
// promise와 동일하게 예외 처리
// async function myAsyncFunc(){ // 자바스크립트 내에서 에러가 아니고 가상으로 에러 발생, 일반적인 에러 발생
// throw 'myAsyncFunc Error!';
// }
// function myPromiseFunc(){//Promise를 이용
// return new Promise((resolve, reject) =>{ // 에러가 발생했다는 가상 reject 사용
// reject('myPromiseFunc Error!');
// });
// }
// const result = myAsyncFunc()//함수를 호출하고
// .catch(e=> {//에러를 처리하기 위한 문장
// console.log(e)
// });
// const result2 = myPromiseFunc()
// .catch(e=> {
// console.log(e)
// });
//async/ await의 예외처리 3
// function wait(){
// return new Promise((resolve, reject)=>{
// setTimeout(() => {
// reject('throw Error!');
// }, sec*1000);
// })
// }
// async function myFunc(){
// console.log(new Date());
// try{
// await wait(2); // Promise의 처리를 기다리는 중
// }catch(e){
// console.log(new Date());
// }
// }
// const result = myFunc();
//async/ await의 예외처리 4
async function myAsyncFunc(){
console.log(new Date());
const result = await wait(2).catch(e => {
console.error(e)
});
console.log(new Date());
}
try {
myAsyncFunc();
} catch (e) {
} // 안됨
myAsyncFunc().catch(e) // 됨
//catch(e) Promise에 대한 오류만 잡기 때문에 현재 오류상태로 표시됩니다.
</script>
</body>
</html>
node.js 다운로드
https://nodejs.org
(LTS버전 다운로드)
node.js 버전 확인
cmd 창에서 node -v 명령어로 확인합니다.
npm 버전 확인
cmd 창에서 npm -v 명령어로 확인합니다.
package.json 파일 만들기
모듈을 관리하는 설정파일
nodejs가 필요한 것들을 준비
json - 자료공유한다면 데이터베이스를 공유를 할수 있는 언어
npm init : 옵션을 직접 제공
npm init -y : 기본값을 기준으로 바로 생성
node.js 실행하는 방법
node 파일이름
클라이언트 - 사용자가 보는 컴퓨터
서버 - 웹서비스 할 리소스가 저장되어 있는 컴퓨터
웹 서버 - 이후 카페 정리
웹 개발
CRUD - 데이터 처리의 기본 기능인 생성, 조회, 수정, 삭제를 말합니다.
create, read, update, delete
콘솔창에 결과물 확인 - > 리얼타임이라고 함 - 애플리케이션에서 어떤 요청을 신속하게 처리하여 응답해야 하는 것
블로킹, 노블로킹, 동기식, 비동기식
//프론트, 백엔드의 전반적인 과정
블로킹 - 제어권을 넘겨주지 않고 대기하게 만드는 것
논블로킹 - 다른 작업과 관계없이 일을 수행하는 것
[노드의 실행 과정]
노드 -> 비동기식, 논 블로킹 방식
1. 이벤트 루프는 일종의 감시자라고 생각하면 됩니다. 어떤 이벤트가 있는지 계속 감시하고 있는 감시자이고
이벤트가 감지되면, 그 작업을 위해 작업 스레드를 생성합니다.
2. 작업스레드는 일종의 작업 공간 같은 것입니다.
이벤트를 처리하기 위해 이벤트 루프는 처리 작업을 작업 스레드에게 맡겨버리고 다른 이벤트가 없나 다시 검사하기 시작합니다.
스레드 ? 하나의 브라우저를 실행한 것이 프로세스 ,
그 브라우저에서 다른 작업을 수행하는 것이 스레드(경량화된 프로세스)
3. 작업 스레드가 작업을 받았을 때 , 콜백 함수라는 것을 받는데 콜백함수란 작업이 끝나면 실행하는 함수입니다.
4. 작업 스레드는 작업을 마치면 이 콜백함수를 실행하고 싶다고 최고 감시자인 이벤트 루프에게 응답을 보냅니다.
응답을 받은 이벤트 루프는 콜백함수의 결과를 클라이언트에 전송하여 우리가 볼 수 있는 결과로 바꾸어 줍니다.
'코리아 IT아카데미 > node.js~~~' 카테고리의 다른 글
2022_0126 | node ejs, jade, remail(0124) (0) | 2022.01.26 |
---|---|
2022_0124 | 0119와 내용 중복 (0) | 2022.01.26 |
2022_0119 | 미들웨어 실행, postman, Nodemon, Router 미들웨어, Router 객체 생성 (0) | 2022.01.26 |
2022_0117 | FileSystem 모듈, http 모듈, 시스템 이벤트, 익스프레스 모듈 (0) | 2022.01.25 |
2022_0112 | node 기초 (0) | 2022.01.25 |