27. 자바스크립트 고급 정리2(node.js)

1. 프로미스(Promise)

비동기(특정작업이 완료될 때까지 기다리지 않고 다른 작업을 수행할 수 있음) 작업을 다루는 객체

 

프로미스의 상태

• 대기: 비동기 작업이 아직 수행되지 않은 상태
• 이행: 비동기 작업이 성공적으로 완료된 상태. resolve() 호출
• 거부: 비동기 작업이 실패한 상태. reject() 호출

const myPromise = new Promise((resolve, reject) => {
    // 비동기 작업 수행
    // 작업이 성공하면 resolve() 호출
    // 작업이 실패하면 reject() 호출 
});

myPromise
    .then((result) => {
        // 성공했을 때의 처리
    })
    .catch((error) => {
        // 실패했을 때의 처리
    });

getUserInfo(userId, (user)=>{
    getPosts(user.id, (posts)=>{
        displayPosts(posts)
    }, (error)=>{
        handlError(error)
    })
}, (error)=>{
    handleError(error)
})

getUserInfo(userId)
        .then((user) =>{
            return getPosts(user.id)
        })
        .then((posts)=>{
            displayPosts(posts)
        })
        .catch((error)=>{
            handleError(error)
        })

 

2. async / await

• 자바스크립트에서 비동기 코드를 더 쉽게 작성하고 관리할 수 있는 기능
• 비동기 작업이 순차적으로 실행되는 것처럼 코드를 작성할 수 있음
• async 함수는 항상 Promise를 반환하며, await 키원드는 async 함수 내에서만 사용

 

3. JSON(JavaScript Object Notation)

• 서버와 클라이언트 간의 HTTP 통신을 위한 포맷
• stringify(): 자바스크립트의 객체를 JSON형태로 변환
• parse(): JSON형태를 자바스크립트 객체로 변환

fetch()

• 네트워크를 통해 리소스를 가져오기 위해 사용되는 자바스크립트 API
• 주로 웹 애플리케이션에서 서버와 데이터를 주고 받을 때 사용
• Promise를 반환

fetch(접속할 주소)
    .then(response => {
        응답 데이터를 처리
        return response.json(); // json 형식의 데이터를 반환
    })
    .then(data => {
        // 처리된 데이터를 사용
    })
    .catch(error => {
        // 에러 처리
    });

 

4. NPM

• https://www.npmjs.com
• npm init으로 package.json 파일 생성