axios

<!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>
    <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
  </head>

  <body></body>
</html>


// 問題1. axiosを使って通信に成功した場合の情報を取得しよう
const todoListUrl = 'https://jsonplaceholder.typicode.com/todos'
// 以下にコードを書いてください
axios.get(todoListUrl).then((res) => {
  const todoList = res.data
  console.log(todoList)
})

// 問題2. axiosを使って通信に失敗した場合の情報を取得しよう
const badStatusUrl = 'https://jsonplaceholder.typicode.com/$$$$'

axios
  .get(badStatusUrl)
  .then((res) => {
    const data = res.data
    console.log(data)
    // 以下にコードを書いてください
  })
  .catch((err) => console.log(err.message))


// 問題1. axiosを使って通信に成功した場合の情報を取得しよう
const todoListUrl = 'https://jsonplaceholder.typicode.com/todos'
// 以下にコードを書いてください

// 問題2. axiosを使って通信に失敗した場合の情報を取得しよう
const badStatusUrl = 'https://jsonplaceholder.typicode.com/$$$$'

axios.get(badStatusUrl).then((res) => {
  const data = res.data
  console.log(data)
  // 以下にコードを書いてください
})


【演習】axiosを使って実装しよう

fetch(Javascript)

fetchメソッド

setTimeout/clearTimeout

setInterval/clearInterval

テンプレートリテラル

setTimeoutとsetInterval

then-catch

thenメソッド

catchメソッド

async-await

async・await

【演習】async・awaitを使ってみよう

async・awaitの例外処理

【演習】非同期関数を組み合わせよう

try-catch-finally

try・catch・finally

throw

try・catch・finallyの例外処理

【演習】複雑な非同期関数を作ろう

JavaScriptの非同期処理を学んでいこう。

webサイトに動きをつけたり、表示内容を切り替えたり、formの入力を制御するなど様々な処理について学んでいきます

JavaScriptコース

【JavaScriptの基礎をマスター💪】配列、オブジェクト、関数を使いこなそう！

「JavaScriptの非同期処理について学んでいこう」レッスンの総復習クイズです。