首页 > 其他分享 >ES6之Promise

ES6之Promise

时间:2022-11-20 14:55:09浏览次数:36  
标签:function ES6 console log err reason Promise

Promise Promise 是 ES6 引入的异步编程的新解决方案。语法上 Promise 是一个构造函数, 用来封装异步操作并可以获取其成功或失败的结果。 1) Promise 构造函数: Promise (excutor) {} 2) Promise.prototype.then 方法 3) Promise.prototype.catch 方法    基本使用

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Promise基本语法</title>
</head>
<body>
    <script>
        //实例化 Promise 对象  默认的2个参数
        const p = new Promise(function(resolve, reject){
            setTimeout(function(){
                //
                // let data = '数据库中的用户数据';
                // resolve 调用这个方法会使用then函数的第一个回调方法
                // resolve(data);

                let err = '数据读取失败';
                reject(err);
            }, 2000);
        });

        //调用 promise 对象的 then 方法  异步执行
        p.then(function(value){
            console.log(value);
        }, function(reason){
            console.error(reason);
        });

        console.log("111");
    </script>
</body>
</html>

  异步执行,这里做了个2秒的定时,所以先执行111,2秒时间到之后再执行p中的方法

 结果:

 

 

 Promise封装读取文件  
//1. 引入 fs 模块
const fs = require('fs');

//2. 调用方法读取文件  单任务
// fs.readFile('./resources/为学.md', (err, data)=>{
//     //如果失败, 则抛出错误
//     if(err) throw err;
//     //如果没有出错, 则输出内容
//     console.log(data.toString());
// });

//3. 使用 Promise 封装  异步调用
const p = new Promise(function(resolve, reject){
    fs.readFile("./resources/为学.mda", (err, data)=>{
        //判断如果失败
        if(err) reject(err);
        //如果成功
        resolve(data);
    });
});

p.then(function(value){
    console.log(value.toString());
    console.log("读取文件结束");
}, function(reason){
    console.log("读取失败!!");
});
console.log("正在读取文件");

  

catch方法  
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>catch方法</title>
</head>
<body>
    <script>
        const p = new Promise((resolve, reject)=>{
            setTimeout(()=>{
                //设置 p 对象的状态为失败, 并设置失败的值
                reject("出错啦!");
            }, 1000)
        });

        // p.then(function(value){}, function(reason){
        //     console.error(reason);
        // });

        p.catch(function(reason){
            console.warn(reason);
        });
    </script>
</body>
</html>

 

         

标签:function,ES6,console,log,err,reason,Promise
From: https://www.cnblogs.com/anjingdian/p/16908485.html

相关文章

  • ES6之生成器
    生成器生成器函数是ES6提供的一种异步编程解决方案,语法行为与传统函数完全不同比如:function*gen(){yield'一只没有耳朵';yield'一只没有尾巴';return'真......
  • ES6之迭代器
    迭代器遍历器(Iterator)就是一种机制。它是一种接口,为各种不同的数据结构提供统一的访问机制。任何数据结构只要部署Iterator接口,就可以完成遍历操作。1)ES6创造了一种......
  • ES6之Symbol
    Symbol基本使用ES6引入了一种新的原始数据类型Symbol,表示独一无二的值。它是JavaScript语言的第七种数据类型,是一种类似于字符串的数据类型。Symbol特点1)Symbol......
  • ES6 语法 浅析
    ECMAScript6(简称ES6)是于2015年6月正式发布的JavaScript语言的标准,正式名为ECMAScript2015(ES2015)。它的目标是使得JavaScript语言可以用来编写复杂的大型应用程序,成为企业......
  • ES6中setTimeout函数的this
    在编程的过程中有同学遇到不太清楚ES6中​​this​​指向的问题,代码抽象如下:functionmyFunction(){varmthis=this;setTimeout(()=>{//this=mthisco......
  • ES6中setTimeout函数的this
    在编程的过程中有同学遇到不太清楚ES6中this指向的问题,代码抽象如下:functionmyFunction(){varmthis=this; setTimeout(()=>{//this=mthiscons......
  • ES6之 ...扩展运算符
    <script>//『...』扩展运算符能将『数组』转换为逗号分隔的『参数序列』//声明一个数组...consttfboys=['易烊千玺','王源','王俊......
  • ES6之rest参数
     (1)//ES6引入rest参数,用于获取函数的实参,用来代替arguments//ES5获取实参的方式functiondate(){console.log(arguments);......
  • ES6之函数参数默认值
    <!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width,initial-scale=1.0"><title>函数......
  • Promise的方法
    Promise.all()Promise.all()方法接收一个promise的iterable类型(注:Array,Map,Set都属于ES6的iterable类型)的输入,并且只返回一个Promise实例,那个输入的所有promise......