zoukankan      html  css  js  c++  java
  • 【05】js异步编程理解


    1.概念

    同步:一个任务等待前一个任务结束,然后再执行,程序的执行顺序与任务的排列顺序是一致的、同步的。异步:每一个任务有一个或多个回调函数(callback),前一个任务结束后,不是执行后一个任务,而是执行回调函数,后一个任务则是不等前一个任务结束就执行,所以程序的执行顺序与任务的排列顺序是不一致的、异步的。

    案例分析:
    欣多多去火车票代售窗口买票,现在该欣多多购票了,欣多多后面是小王珂,他也等着买票。

    同步解析:
    欣多多:买一张明天到大理的火车票
    售票MM:对不起,明天到大理的火车票已经没有了
    欣多多:啊!居然没有了,你等我一下,我打电话问问我女朋友,改买多久的票。 (此时,售票员什么事情都做不了,只得等我打完电话,而我背后的小王珂变得非常的焦躁,心中:“我靠,耽误我时间,浪费我青春,你难道就不知道去一边打电话吗?等我买了票,你差不多也打完了。”)
    30秒过去了.....
    欣多多:美女,那就换一张后天到大理的火车票吧。
    售票MM:好的,给你。
    小王珂:买一张去源码时代的火车票,我要去学Web前端.

    异步解析

    欣多多:买一张明天到大理的火车票
    售票MM:对不起,明天到大理的火车票已经没有了
    欣多多:好吧,那我先打电话问问我女朋友,问好后,我在跟你说。(一个小的举动,从售票窗口让开)
    小王珂:买一张去源码时代的火车票,我要去学Web前端.
    售票MM:好的,给你。
    .....
    .....
    欣多多电话打完了
    欣多多:美女,那就换一张后天到大理的火车票吧。
    售票MM:好的,给你。

    1、同步:总是等待上一个任务完成后,才开始下一个任务的执行。

    2、异步:开始一个(异步)任务,任务去执行,但是不会让后面的任务等待(阻塞),后面的任务继续执行,(异步)任务执行完毕后,会进行通知(回调)。

    2.异步编程实现

    2.1 settimeout

    setTimeout(callback,ms); //延迟ms毫秒后,执行callback函数,延迟的过程,不会影响后面代码的执行。

    
    

    setTimeout(function(){

    console.log(3);

    },1000);

    console.log(1);

     

    var s = 13;

    setTimeout(function(){

    s = 31;

    console.log("4---->"+s);

    },1000);

    console.log("2--->"+s);

    运行结果:

    1
    2----->13
    3
    4------>31

    原因:

    一段代码开始后,不会被允许打断,一直从头到尾执行完毕,也就是说这个时间期间。是不能做其他事情,其他任务也无法插入进行,可以认为代码运行是按照代码块来分,一个代码块执行完毕,才会进行事件轮循环(未执行的内容),执行“回调”。

    2.2事件

    事件也是基于函数胡

    //fs:文件系统模块,提供对文件的操作
    var fs = require("fs");
    //创建输出流,读取文件
    var stream = fs.createReadStream("./NodeJs-DAY01.docx");
    //读取数据事件,每次读取都会触发。
    stream.on("data",function(data){
        console.log(data);
    });
    //读取数据完毕
    stream.on("end",function(){
        console.log("文件读取完毕");
    });

    2.3promise

    Promise(承诺),就是一个对象,用来传递异步操作的消息。它代表了某个未来才会知道结果的事件(通常是一个异步操作),并且这个事件提供统一的 API,可供进一步处理。

     Promise 对象有以下两个特点:

    (1)对象的状态不受外界影响。Promise 对象代表一个异步操作,有三种状态:Pending(进行中)、Resolved(已完成,又称 Fulfilled)和 Rejected(已失败)。只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态。这也是 Promise 这个名字的由来,它的英语意思就是「承诺」,表示其他手段无法改变。

     (2)一旦状态改变,就不会再变,任何时候都可以得到这个结果。Promise 对象的状态改变,只有两种可能:从 Pending 变为 Resolved 和从 Pending 变为 Rejected。只要这两种情况发生,状态就凝固了,不会再变了,会一直保持这个结果。就算改变已经发生了,你再对 Promise 对象添加回调函数,也会立即得到这个结果。这与事件(Event)完全不同,事件的特点是,如果你错过了它,再去监听,是得不到结果的。

     Promise 构造函数接受一个函数作为参数,该函数的两个参数分别是 resolve 方法和 reject 方法。

    如果异步操作成功,则用 resolve 方法将 Promise 对象的状态,从「未完成」变为「成功」(即从 pending 变为 resolved);

    如果异步操作失败,则用 reject 方法将 Promise 对象的状态,从「未完成」变为「失败」(即从 pending 变为 rejected)。

    基本语法:

    var promise = new Promise(function(resolve, reject) {
    
     if (/* 异步操作成功 */){
    
     resolve(value);
    
     } else {
    
     reject(error);
    
     }
    
    });
     
    
    promise.then(function(value) {
    
     // success
    
    }, function(value) {
    
     // failure
    
    });

    具体使用,可以参照:http://es6.ruanyifeng.com/#docs/promise

  • 相关阅读:
    js弹出DIV层
    .net 生成静态页面
    新开博客
    随机生成验证码
    ASP.NET错误处理方法总结
    webgis
    看樱花
    今天转载的笑话,挺好笑呵
    用Tomcat插件在Eclipse上搭建可跟踪调试的J2EE WEB开发环境
    关于JSTL的简单说明
  • 原文地址:https://www.cnblogs.com/yeziTesting/p/7128375.html
Copyright © 2011-2022 走看看