JavaScript中 Promise的学习以及使用
今天一个哥们发过来一段js代码,没看懂,就顺便学习了一下,代码如下
var p=new Promise(function(resolve,eject){
resolve("ok");
});
p.then(function(value){console.log(val)},
function(err)(console.log(err))
);
then()方法的第一个参数是resolved状态的回调函数,第二个参数(可选)是rejected状态的回调函数。
有两种写法:
(1)Promise.resolve("foo");
所以才有了我这个哥们给我发的代码:Promise.resolve('zhangkai').then(value => {console.log(value)})
(2)var p = new Promise(function(resolve){ resolve("foo"); });
学习了Promise对象,想了想实际项目中的应用:
实际中有这么一个需求,查询学生的信息列表,有一个文本框可以输入学生的姓名,可以进行查找指定的学生信息,如果不存在就不进行学生信息列表的查询了,如果存在,再进行下一步的查询。(通过使用ajax实现)
首先,写一个通过ajax判断该学生是否存在的方法,然后,如果存在,写一个通过ajax查询该学生信息的方法;不存在的话,提示一下即可。
代码如下:
<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>
JavaScript中 Promise的学习以及使用的更多相关文章
- 全面理解Javascript中Promise
全面理解Javascript中Promise 最近在学习Promise的时候,在网上收集了一些资料,发现很多的知识点不够系统,所以小编特意为大家整理了一些自认为 比较好的文章,供大家更好地学习js中非 ...
- javascript中的正则表达式学习
一.前言 关于正则表达式自身的语法这里不做过多介绍(详情可参见http://www.php100.com/manual/unze.html),这里仅仅解释javascript中和正则表达式相关的几个方 ...
- JavaScript中的EcMAScript学习笔记
一.Javascript概述(知道) a.一种基于对象和事件驱动的脚本语言 b.作用: 给页面添加动态效果 c.历史: 原名叫做livescript.W3c组织开发的标准叫ECMAs ...
- 浅谈Javascript中Promise对象的实现
https://segmentfault.com/a/1190000000684654 What? Promise是CommonJS的规范之一,拥有resolve.reject.done.fail.t ...
- JavaScript中NODE操作学习总结
Node: 1.在 HTML DOM (文档对象模型)中,每个部分都是节点: 文档本身是文档节点 所有 HTML 元素是元素节点 所有 HTML 属性是属性节点 HTML ...
- Javascript中Object常用方法学习
1.Object.assign 函数(对象)(JavaScript) 将来自一个或多个源对象中的值复制到一个目标对象.语法: Object.assign(target, ...sources ); 此 ...
- Javascript中Promise的简单使用
// 函数功能:1秒以后创建一个10以内的随机整数,并判断这个数是否为偶数:如果是偶数则做一件事情,如果是奇数则做另一件事情 function doSomthing() { var promise = ...
- JavaScript中Promise 使用、原理以及实现过程
1.什么是 Promise promise 是目前 JS 异步编程的主流解决方案,遵循 Promises/A+ 方案. 2.Promise 原理简析 (1)promise 本身相当于一个状态机,拥有三 ...
- javascript 中 Promise的使用
有点经验的js前端都知道 ajax异步函数里面的结果不会立即返回,如果你想在一个异步函数得到某个结果后去执行一个语句怎么做? if ( 异步函数 ) { 语句 } 可能很多人都踩过这样坑,这个时候 ...
随机推荐
- Source Insight简介及下载破解
对于长期混迹于.net平台的开发人员来说,研究C源码不是很常见,但是有时候我们不得不涉及c的研究,因为许多优秀的开源软件是用C/C++写就.查看C源码的利器除了VS外,还有另一个,那就是Source ...
- poj1192 最优连通子集(树形dp)
题目链接:poj1192 最优连通子集 求一棵无向树的最大子树和..类似于求最大子段和的办法,树形dp. dp[i][0]:以i为根,不包括 i 结点的子树最大权 dp[i][1]:以i为根,包括 i ...
- pycharm的快捷方式
PyCharm3.0默认快捷键(翻译的)1.编辑(Editing)Ctrl + Space 基本的代码完成(类.方法.属性)Ctrl + Alt + Space 快速导入任意类Ctrl + Shift ...
- CentOS修改默认编码为UTF-8,使java程序字符集默认为UTF-8
java程序在本地接受php的utf8字符串好好的,到了服务器就行了. 解决,修改vi /etc/sysconfig/i18n,修改之后ssh断开,重连后KILL你的java. LANG=" ...
- 为什么使用 Bootstrap?
为什么使用 Bootstrap? 移动设备优先:自 Bootstrap 3 起,框架包含了贯穿于整个库的移动设备优先的样式. 浏览器支持:所有的主流浏览器都支持 Bootstrap. 容易上 ...
- C++不用任何算术运算符实现整数加法
这本是careerup的一道题,看到了以后自己做了一下,主要的难点就是加法里面的进位.直接上代码: int add(int a, int b) { ; }; int first = a, second ...
- 将从数组中取到的字符串赋值给了UIImage导致的错误
Terminating app due to uncaught exception 'NSInvalidArgumentException', reason: '-[__NSCFConstantStr ...
- java基础介绍(转)
很全面的介绍JAVA基础的文档 Java 编程简介,第 1 部分: Java 语言基础 http://www.ibm.com/developerworks/cn/java/j-introtojava1 ...
- 大数运算Swift
前几天开始,打算用Swift写大数的运算,加法跟乘法都已经写好了,写减法发现,真是难,感觉有可能是我的想法不对?不不不我相信我的逻辑. 首先把数字分成小数部分跟整数部分,再遍历一下,识别当前的结果,是 ...
- PAT (Basic Level) Practise:1030. 完美数列
[题目链接] 给定一个正整数数列,和正整数p,设这个数列中的最大值是M,最小值是m,如果M <= m * p,则称这个数列是完美数列. 现在给定参数p和一些正整数,请你从中选择尽可能多的数构成一 ...