es6---promise

最新推荐文章于 2024-09-01 07:21:12 发布

FWodong

最新推荐文章于 2024-09-01 07:21:12 发布

阅读量193

点赞数

分类专栏： es6

本文链接：https://blog.csdn.net/qq_24044863/article/details/104086102

版权

es6 专栏收录该内容

36 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<!--
    promise--承诺

    同步：同时只能做一件事。代码简单。
    异步：操作之间没有关系，同时进行多个操作。操作之间不会影响。代码复杂。

    promise--清除异步操作
        *用同步的方式，书写异步代码
-->
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <!-- 异步例子 -->
    ajax('/heads', functon(heads_data) {
        ajax('/sides', functon(sides_data) {
            ajax('foots', function(foots_data){
                
            }, function() {
                alert('failure to read')
            })
        }, function() {
            alert("读取失败")
        })；
    }, function() {
        alert("读取失败")
    })；
    <!-- 使用了promise之后的异步 -->
    Promise.all([
            $.ajax({url: 'data.txt', dataType: 'json'}), 
            $.ajax()
        ]).then(results => {
        let [arr1, arr2] = results
        alert('success')
    }, resolve => {
        alert('fail')
    })
    <!-- 同步例子 -->
    let heads_data = ajax_async('/heads')
    let sides_data = ajax_async('/sides')
    let foots_data = ajax_async('/foots')

    <script src="jquery.js" charset="utf-8"></script>
    <script>
        // function CreatePromise(url) {
        //     return new promise(function(resolve, reject) {
        //         // 异步代码； resolve--成功： reject--失败
        //         $.ajax({
        //             // url: url,
        //             url,
        //             dataType: 'json',
        //             success(arr) {
        //                 resolve(arr)
        //             },
        //             error(err) {
        //                 reject(err)
        //             }
        //         })
        //     })
        // }
        let promises1 = new promise(function(resolve, reject) {
            // 异步代码； resolve--成功： reject--失败
            $.ajax({
                url: 'arr.txt',
                dataType: 'json',
                success(arr) {
                    resolve(arr)
                },
                error(err) {
                    reject(err)
                }
            })
        })
        let promises2 = new promise(function(resolve, reject) {
            $.ajax({
                url: 'json.txt',
                dataType: 'json',
                success(arr) {
                    resolve(arr)
                },
                error(err) {
                    reject(err)
                }
            })
        })
        Promise.all({
            // CreatePromise('arr.txt'), CreatePromise('json.txt'),
            promises1, promises2
        }).then(function(arr) {
            let [res1, res2] = arr  //解构赋值
            console.log(res1, res2)
            alert('success')
        }, function(err) {
            alert('error')
        })
        // promises.then(function() {
        //     alert('success')
        // }, function() {
        //     alert('fail')
        // })
        // Promise.race
    </script>

</body>
</html>