zoukankan      html  css  js  c++  java
  • Gist

    Introduction

    Do you prefer the usage of "ES6 Promise"? If you do, you will like the usage of "Fetch" too.
    Compared to "Ajax", "Fetch" owns a competitive feature: promise, which synchronize asynchronous methods elegantly, the meaning and the usage of "Fetch" can be understood easily as well.
    Here, I'd like to list the most common usage of "Fetch".

    Flow

    The flow of fetching staff is simple:

    Usage

    Fetch once

    Suppose we would fetch the content of an remote html

    fetch('./data/test.html')
    	.then(function (response) {
    		return response.text()    // return a promise 
    	})
    	.then(function (body) {
    		console.log( body )    // log: html content
    	})
    

    Fetch data right after the other data fetched(Chain)

    If we'd like to fetch data(json) right after fetching content(html)

    fetch('./data/test.html')
    	.then(response => {
    		return response.text()
    	})
    	.then(body => {
    		console.log(body)
    		return fetch('./data/test.json')  // return a promise(`fetch('/url')` will return a promise ) 
    	})
    	.then(response => {
    		return response.json()  // return a promise too
    	})
    	.then(json => {
    		console.log(json)  // log: json's data
    	})
    

    Complete all fetching action

    Promise.all([
    	Promise.resolve(fetch('./data/test.html')),
    	Promise.resolve(fetch('./data/test.json'))
    ]).then(data => {
    	console.log('Two requests are both completed!')
    })
    

    API

    Github Fetch Document
    Offcial Manual

    Conclusion

    Fetch, well done!

  • 相关阅读:
    qt映射器QSignalMapper的理解
    win10环境下安装Qt4.8、PyQt及development tools
    BZOJ1040 基环森林 找环+基础树形DP
    贪心 BZOJ1034
    HDU5293 树链剖分+树形DP
    BZOJ 1028 BZOJ 1029 //贪心
    BZOJ1025
    仙人掌图判定及求直径HDU3594 BZOJ1023
    BZOJ1021
    BZOJ1022
  • 原文地址:https://www.cnblogs.com/terrysu/p/7133765.html
Copyright © 2011-2022 走看看