fetch 함수는 주로 웹 개발에서 사용되는 함수로, 네트워크를 통해 데이터를 가져오는 역할을 한다. 주로 HTTP 요청을 보내고 응답을 받아오는 데 사용된다. fetch함수는 브라우저의 내장 API로 제공되는데, 이 API를 사용하여 비동기적으로 데이터를 가져올 수 있다.
fetch함수는 기본적으로 Promise를 반환한다. Promise는 비동기 작업이 완료되었을 때 결과를 처리학 위해서 사용되는 객체이다.
fetch함수가 Promise를 반환하므로 우리는 then()메소드를 사용하여 데이터를 처리하거나, async/await 구문과 함게 사용할 수 있다.
간단한 예로 fetch 함수를 사용하자면 JSON데이터를 가져오는 기본적인 fetch요청인데
fetch("https://api.example.com/data")
.then(response => response.json())
.then(data => {
//데이터를 처리하는 로직
console.log(data);
})
.catch(error => {
//에러 처리로직
console.log(error);
});
위 예제 처럼
fetch("https://api.example.com/data")
은 지정된 URL로 GET요청을 보낸다. 서버는 요청을 처리하고 응답을 반환한다. 그리고 첫 번째 then()메소드에서 응답(response)객체를 JSON형식으로 변환한다.
.then(response => response.json())
두 번째 then()메소드에서는 변환된 데이터를 처리한다. 만약 에러가 발생하면 catch()메소드에서 에러를 처리할 수 있다.
fetch함수를 사용하여 다양한 HTTP 요청을 보낼 수 있으며, 요청 헤더를 설정하거나 POST요청을 보낼 때 데이터를 전송하는 등의 작업을 할 수 있다. 또한 fetch함수는 선택적으로 Request 객체를 인자로 받을 수 있어 더 세밀한 요청설정이 가능하다.
'Javascript' 카테고리의 다른 글
JAVASCRIPT Promise (0) | 2023.05.31 |
---|---|
JAVASCRIPT PreventDefault() (0) | 2023.05.30 |
JAVASCRIPT Callback() 함수 (0) | 2023.05.26 |
JAVASCRIPT Canvas (0) | 2023.05.03 |
JAVASCRIPT 대입연산자 (0) | 2023.04.24 |
댓글