Promise

js中所有的代码都是单线程执行，犹豫这个缺陷，js中所有的网络操作、浏览器事件等都必须异步执行，异步执行可以使用setTimeout()方法，如下：

<script>function callback() {console.log('Done');}console.log('before setTimeout()');setTimeout(callback, 1000); // 1秒钟后调用callback函数console.log('after setTimeout()');
</script>

结果：

before setTimeout()
after setTimeout()
(等待1秒后)
Done

then：设置Promise函数中的第一个参数
catch：设置Promise函数中的第二个参数

成功和失败的回调函数只能传递一个参数？？

<script>function test(func2, func1) { // var timeOut = Math.random()*2; vartimeOut = 0.8;console.log('set timeout to: ' + timeOut + ' seconds.');setTimeout(() => {if (timeOut < 1) {func1('param1','param2');} else {func2('timeout in ' + timeOut + ' seconds.');}}, timeOut * 1000);} // 执行函数var p1 = new Promise(test); var thenFunc = (pa1, pa2) => {console.log('成功：' + pa1 + ' ' + pa2);};var catchFunc = (pa1, pa2) => {console.log('失败：' + pa1 + ' ' + pa2);};p1.then(thenFunc);p1.catch(catchFunc);
</script>

结果：

set timeout to: 0.8 seconds. (test.html, line 4)
失败：param1 undefined (test.html, line 20)

promise.all和then一起使用，意味着两个都成功时才调用then，和catch一起使用会失效，promise.race是获取两个请求中先返回的一个结果，另一个仍在执行但是会被丢弃；

<script>var p1 = new Promise(function (resolve, reject) {console.log('func1');setTimeout(resolve, 500, 'P1');});var p2 = new Promise(function (resolve, reject) {console.log('func2');setTimeout(reject, 600, 'P2');});// 并行执行，都执行完成后获取结果集Promise.all([p1, p2]).then(function (results) {console.log(results); // [P1,P2]});// 获取较快的请求的结果Promise.race([p1, p2]).then(function (results) {console.log(results); // P1});// 较快执行失败的请求的失败结果Promise.all([p1, p2]).catch(function (results) {// p1p2都改成reject后返回P1// 不是指两个都报错，而是指两个中执行先报错的那个console.log(results); });
</script>

javascript快速入门（二）：JS浏览器操作相关推荐

JavaScript快速入门(1)
JavaScript快速入门详情百度百科 1. 什么是javaScript 2.快速入门 2.1.js引入方法 2.2. javaScript 的基本语法入门 2.3.数据类型 2.4.严格检查模式 ...
前端_快速入门Vue.js框架
文章目录快速入门Vue.js框架 0.前言 1.Vue.js框架 1.1.Vue简介 1.2.第一个Vue程序 1.3.el:挂载点 2.Vue指令 2.2.v-html 2.3.v-on 2.4. ...
JavaScript快速入门（四）——JavaScript函数
函数声明之前说的三种函数声明中(参见JavaScript快速入门(二)--JavaScript变量),使用Function构造函数的声明方法比较少见,我们暂时不提.function func() { ...
狂神JavaScript快速入门学习笔记
狂神视频地址 1什么是JavaScript JavaScript是一门世界上最流行的脚本语言 2快速入门 2.1 引入JavaScript 1 内部标签 <script>alert('he ...
3.JavaScript快速入门
1.什么是JavaScript 1.概述是一门世界上最流行的脚本语言 Java和 JavaScript 一个合格的后端人员必须精通JavaScript 2.历史 ECMAScript是JavaSc ...
JavaScript 快速入门教程
文章目录 1.JavaScript 简介 2.JavaScript 用法 2.1.在 `<head>` 或者 `<body>` 的 JavaScript 2.2.外部的 Jav ...
前端三大技术 HTML、CSS、JavaScript 快速入门手册
听到前端技术,不少朋友一定会感到有些陌生.但其实,前端,你每天都在接触. 你正在使用的APP,你正在浏览的网页,这些你能看到的界面,都属于前端. 而前端最重要的三大技术,HTML,CSS,JavaSc ...
JavaScript快速入门（一）
1. JavaScript简介 1.1. JavaScript由来 Netscape 发明了 JavaScript JavaScript由Netscape 在1995年发明.早期的主要目的是处理一些用 ...
JavaScript快速入门到高级 JS精品视频课程
原文链接:https://www.3mooc.com/front/articleinfo/241 第1章 JavaScript_简介概述和使用课时1 开始学习初识javaScript 课时2 sc ...
javascript快速入门之BOM模型—浏览器对象模型(Browser Object Model)
什么是BOM? BOM是Browser Object Model的缩写,简称浏览器对象模型 BOM提供了独立于内容而与浏览器窗口进行交互的对象由于BOM主要用于管理窗口与窗口之间的通讯,因此其核心对 ...

javascript快速入门（二）：JS浏览器操作

Promise

javascript快速入门（二）：JS浏览器操作相关推荐

最新文章

热门文章