무회blog

js, fetch(url), JSON 데이터 fetch 본문

IT

js, fetch(url), JSON 데이터 fetch

최무회 2022. 6. 15. 03:12 
<!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>

    <!--TODO: tui-grid -->

    <link rel="stylesheet" href="https://uicdn.toast.com/grid/latest/tui-grid.css" />
    <script src="https://uicdn.toast.com/grid/latest/tui-grid.js"></script>
    <!-- 특정 버전 -->
    <link href="https://cdnjs.cloudflare.com/ajax/libs/tui-code-snippet/2.3.0/tui-code-snippet.min.js">

    <!-- FIXME: 내부파일경로 -->
    <script defer src="./index.js"></script>

    <script>
        // 1 번째 방식 : fetch(url)
        // var url = "https://jsonplaceholder.typicode.com/todos/20";
        // fetch(url)
        //     .then(response => response.json()) // response.json()은 응답 데이터를 JSON 개체로 변환하는 작업
        //     .then(json => console.log(json))

        // 2 번째 방식 : fetch(url), return 값 체크 가능 
        const URL = 'https://jsonplaceholder.typicode.com/todos'
        const A = async () => {
            const response = await fetch(URL);
            const data = await response.json()
            return data;
        }

        console.log(A())

        // (async () => {
        //     console.log(A())
        // })()
    </script>
</head>

<body>
    <div id="grid"></div>
</body>

</html>
저작자표시 비영리 변경금지

'IT' 카테고리의 다른 글

Flutter 설치하기  (1) 2024.09.15
CMD 파일명으로 경로 찾기  (0) 2022.06.04
부트스트랩, 다운하여 , 빠르게 사용해 보기 , 템플릿,  (0) 2021.12.29
유닉스/리눅스 전월말일자 참고  (0) 2021.10.05
(유닉스) 문자열에서 일자를 연산하여 전월말일자 구하기  (0) 2021.10.04
'IT' Related Articles more
Comments