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);