es6(es2015)中的promise , symbol

6 篇文章 0 订阅

promise对象,解决回调地狱问题

**基本写法,创建promise对象**
let p = new Promise((resolve,reject)=>{
	resolve("lala");             //方法,通常结合判断条件一起使用
	//reject();                  //方法
});
p.then((data)=>{
	console.log(data)
}).catch((err)=>{
	console.log(err)
})
//不写catch,在then中传两个函数也行
p.then((data)=>{
	console.log(data)
},(err)=>{
	console.log(err)
})

用promise改造ajax的get请求

function fn() {
      let p = new Promise(function (resolve, reject) {
        let xhr = new XMLHttpRequest();
        // 准备一个请求
        xhr.open('get', 'url');
        xhr.send();
        xhr.onreadystatechange = function () {
          if (xhr.readyState == 4 && xhr.status == 200) {
            // 接收返回值
            let res = xhr.response;
            if (res) {  // 有数据就调用成功
              resolve(res)
            } else {  // 没有数据就调用失败
              reject('失败了啦啦啦....')
            }
          }
        }
      });
 p.then(res => {
        // 将返回的json字符串转化为对象
        res = JSON.parse(res);
        console.log(res);
      }).catch(res => {
        console.log(res);
      })
    }

promise链式调用,原始写法

new Promise((resolve,reject)=>{
	setTimeout(()=>{
		resolve()
	})
}).then(()=>{
	console.log("1234");
	return new Promise((resolve,reject)=>{
		setTimeout(()=>{
		resolve()
		})
	})
}).then(()=>{
	console.log("5678");
})

promise链式调用,简写(一)

new Promise((resolve,reject)=>{	
		resolve()
}).then((res)=>{
	console.log(res);
	return Promise.resolve(res+"111")
}).then((res)=>{
	console.log(res+"222");
})

promise链式调用,简写(二)

new Promise((resolve,reject)=>{	
		resolve(res)
}).then((res)=>{
	console.log(res);
	return res+"111"
}).then((res)=>{
	console.log(res+"222");
})

promise.all

Promise.all()  //批量执行
Promise.all([p1, p2, p3])//用于将多个promise实例,包装成一个新的Promise实例,返回的实例就是普通的promise
//它接收一个数组作为参数
//数组里可以是Promise对象,也可以是别的值,只有Promise会等待状态改变
//当所有的子Promise都完成,该Promise完成,返回值是全部值得数组
//有任何一个失败,该Promise失败,返回值是第一个失败的子Promise结果
 function p1(){
	let pro1 = new promise((resolve,reject)=>{
	resolve(result1);
});
	return pro1;
};
 function p2(){
	let pro2 = new promise((resolve,reject)=>{
	resolve(result2)});
	return pro2;
}
Promise.all([p1(), p2()])
        .then((result) => {
            console.log('ok');
            console.log(result);   //result 是result1和result2合起来的数组
        })

**常见用法:**
//异步操作和定时器放在一起,,如果定时器先触发,就认为超时,告知用户;
//例如我们要从远程的服务家在资源如果5000ms还没有加载过来我们就告知用户加载失败
**回调包装成Promise,有两个好处:**
1、可读性好
2、返回 的结果可以加入任何Promise队列

Promise.race() 类似于Promise.all() ,区别在于它有任意一个完成就算完成


Symbol,es6中添加的一种原始数据类型symbol
特点:

  • symbol属性值对应的值是唯一的,解决命名冲突问题
  • symbol值不能与其他数据进行计算,包括和字符串拼接
  • for in,for of 遍历时不会遍历symbol属性
let symbol = Symbol();
let obj = {
name:"zhangsan",
age:18
};
obj[symbol] = "hello";
console.log(obj);

let symbol2 = Symbol("one");
let symbol3 = Symbol("two");
console.log(symbol2==symbol3);
console.log(symbol2,symbol3);
**可以定义常量**
const Person_key = Symbol("person_key");
console.log(Person_key);
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值