美文网首页
js.Promise 简介及例子

js.Promise 简介及例子

作者: 许道龙 | 来源:发表于2016-07-15 09:51 被阅读0次

用于管理与异步API交互的抽象对象,避免使用回调函数的层层嵌套

状态:等待->完成->拒绝

必须有一个then(),第一个参数是resolved,第二个是rejected函数;

实例:
查询学生的信息列表,有一个文本框可以输入学生的姓名,可以进行查找指定的学生信息,如果不存在就不进行学生信息列表的查询了,如果存在,再进行下一步的查询。

<script type="text/javascript">

        //判断是否存在该学生姓名
        var isExistStu = function (name) {
            var promise = new Promise(function (resolve, reject) {
                $.ajax({
                    type: "Post",
                    url: "/student/student/checkstu",
                    dataType: "json",
                    data: JSON.stringify({
                        name: name
                    }),
                    contentType: "application/json;charset-utf-8",
                    success: function (data) {
                        resolve(data);  //data 返回来的是 true 或者 false
                    }
                });
            });
        }

        //查询根据学生姓名查询学生信息列表
        var searchStu = function (name) {
            var promise = new Promise(function (resolve, reject) {
                $.ajax({
                    type: "Post",
                    url: "/student/student/getstulist",
                    dataType: "json",
                    data: JSON.stringify({
                        name: name
                    }),
                    contentType: "application/json;charset-utf-8",
                    success: function (data) {
                        resolve(data);  //data 返回来的是学生信息列表
                    }
                });
            });
        }

        

        window.onload = function () {
            var stuName = $("txtName").val();
            isExistStu(stuName).then(function (data) {
                if (data == "true") {
                    return searchStu(stuName);
                }
                else {
                    return;
                }
            }).then(function (data) {
                showTable(data);
            })
        }

        //展示 学生信息列表表格
        function showTable(data) {
            var html = "<table>";
            for (var i = 0; i < data.length; i++) {
                html += "<tr>";
                html += "<td>" + data.name + "</td>";
                html += "<td>" + data.address + "</td>";
                html += "</tr>";
            }
            html += "</table>";

            $("#divTable").html(html);
        }

    </script>
    
    
    
    
    function add(xPromise,yPromise) {
    // `Promise.all([ .. ])`接收一个Promise的数组,
    // 并返回一个等待它们全部完成的新Promise
    return Promise.all( [xPromise, yPromise] )

    // 当这个Promise被解析后,我们拿起收到的`X`和`Y`的值,并把它们相加
    .then( function(values){
        // `values`是一个从先前被解析的Promise那里收到的消息数组
        return values[0] + values[1];
    } );
}

// `fetchX()`和`fetchY()`分别为它们的值返回一个Promise,
// 这些值可能在 *现在* 或 *稍后* 准备好
add( fetchX(), fetchY() )

// 为了将两个数字相加,我们得到一个Promise。
// 现在我们链式地调用`then(..)`来等待返回的Promise被解析
.then( function(sum){
    console.log( sum ); // 这容易多了!
} );

相关文章

  • js.Promise 简介及例子

    用于管理与异步API交互的抽象对象,避免使用回调函数的层层嵌套 状态:等待->完成->拒绝 必须有一个then()...

  • Spring MVC 简介及入门小例子

    说明:文章内容全部截选自实验楼教程【Spring MVC 简易教程】 一、什么是 Spring MVC Sprin...

  • js.Promise

    第二种写法

  • Flink CEP及例子

    一.什么是CEP? 复杂事件处理: Complex Event Processing。是Flink中实现复杂事件处...

  • js.Promise catch

    代替catch ``由于 catch 标识符可能会导致问题出现,因此一些类库(Library)也采用了 caugh...

  • js.Promise race

    Promise.race(iterable),iterable[]-->指多个Promise值 返回第一个被确认(...

  • js.Promise resolve()

    功能一:Promise.resolve();立即让promise进行resolve的状态,并返回Promise 相...

  • js.Promise Thenable

    类似Promise 具有.then 方法的对象 JQuery.ajax() 返回值就是thenable,即是jqX...

  • js.Promise all

    Promise.all(func1, func2 [,funcN]) 两个或两个以上,仅在所有指定承诺均完成 或者...

  • Java多线程之CompletableFuture

    1 CompletableFuture 此文章字数多,实际是例子多,多把例子写几遍,受益颇丰 1.1 简介 Com...

网友评论

      本文标题:js.Promise 简介及例子

      本文链接:https://www.haomeiwen.com/subject/bcryjttx.html