Javascript Fetch Note

An Example about Fetch


    fetch('https://api.example.com/data', {
    method: 'POST', // 请求方法
    headers: {
        'Content-Type': 'application/json' // 请求头中的 Content-Type
    },
    body: JSON.stringify({ // 请求体中的数据
        name: 'John Doe',
        age: 30
    })
    })
    .then(response => {
    if (response.ok) { // 判断响应是否成功
        return response.json(); // 将响应转换为 JSON 格式
    } else {
        throw new Error('Network response was not ok.'); // 抛出异常
    }
    })
    .then(data => {
    console.log(data); // 处理 JSON 格式的响应数据
    })
    .catch(error => {
    console.error('There was a problem with the fetch operation:', error); // 处理异常
    });

fetch 默认是异步执行的。当你调用 fetch 函数时，它会立即返回一个 Promise 对象，然后在后台发起网络请求。一旦请求完成，Promise 对象就会被解析为一个 Response 对象，然后你可以使用 then() 方法来获取响应数据。

由于 fetch 是异步执行的，它不会阻塞 JavaScript 主线程。这意味着你可以在发送请求时继续执行其他的 JavaScript 代码，不必等待网络请求完成。这种异步执行的方式可以提高应用程序的性能和响应速度。

如果你需要使用 fetch 函数来进行同步请求，可以使用 async/await 或者使用同步的 XMLHttpRequest 对象。但是，这种同步方式可能会降低应用程序的性能和响应速度，因此不建议在大多数情况下使用。