zoukankan      html  css  js  c++  java
  • await/async的用法

    //==回调地狱的解决方法 , 实际的业务问题:我们需要按顺序获取:产品数据=>用户数据=>评论数据
    
    //1.传统的写法:
    
    	// 获取产品数据
    	ajax('products.json', (products) => {
    	    console.log('AJAX/products >>>', JSON.parse(products));
    
    	    // 获取用户数据
    	    ajax('users.json', (users) => {
    	        console.log('AJAX/users >>>', JSON.parse(users));
    
    	        // 获取评论数据
    	        ajax('products.json', (comments) => {
    	            console.log('AJAX/comments >>>', JSON.parse(comments));
    	        });
    	    });
    	});
    
    //2.用promise(ES6)封装ajax:
    
    	//封装 Ajax,返回一个 Promise
    	function requestP(url) {
    	    return new Promise(function(resolve, reject) {
    	        ajax(url, (response) => {
    	            resolve(JSON.parse(response));
    	        });
    	    });
    	}
    
    	// 获取产品数据
    	requestP('products.json').then((products) => {
    	    console.log('Promises/products >>>', products);
    	    // 获取用户数据
    	    return requestP('users.json');
    	}).then((users) => {
    	    console.log('Promises/users >>>', users);
    	    // 获取评论数据
    	    return requestP('comments.json');
    	}).then((comments) => {
    	    console.log('Promises/comments >>>', comments);
    	});
    
    //3. await/async
    	//async用来表示函数是异步的,定义的函数会返回一个promise对象,可以使用then方法添加回调函数。
    	//await 后面可以跟任何的JS 表达式,如果await的是 promise对象会造成异步函数停止执行并且等待 promise 的解决,如果等的是正常的表达式则立即执行。
    	// 封装 Ajax,返回一个 Promise
    	function requestP(url) {
    	    return new Promise(function(resolve, reject) {
    	        ajax(url, (response) => {
    	            resolve(JSON.parse(response));
    	        });
    	    });
    	}
    
    	(async () => {
    	    // 获取产品数据
    	    let data = await requestP('products.json');
    
    	     // 获取用户数据
    	    let users = await requestP('users.json');
    
    	     // 获取评论数据
    	    let products = await requestP('comments.json');
    
    	    console.log('ES7 Async/products >>>', products);
    	    console.log('ES7 Async/users >>>', users);
    	    console.log('ES7 Async/comments >>>', comments);
    	}());
    
    
  • 相关阅读:
    C++ STL list
    1159 Palindrome
    3070 Fibonacci
    1458 Common Subsequence
    git工具之重写历史
    git工具之修订版本(revision)选择
    git工具之使用git调试
    程序员也要听歌啊 写写歌词~(毛不易)《借》《消愁》《像我这样的人》
    git基本命令讲解
    git工作原理
  • 原文地址:https://www.cnblogs.com/aryu/p/10943730.html
Copyright © 2011-2022 走看看