//Promise 状态管理
//resolve 成功
//reject 失败
// let p = new Promise((resolve, reject) => {
// setTimeout(()=>{
// console.log("yan")
// // if(true) {
// // resolve()
// // }else {
// // reject()
// // }
// }, 1000)
// }).then(()=>{
// console.log("成功")
// },()=>{
// console.log("失败")
// })
// let p = new Promise((resolve, reject)=>{
// console.log(1)
// resolve("aaa")
// })
// p.then(res => {
// console.log(3)
// console.log(res)
// })
// console.log(2)
//这个顺序是1、 2、 3
// new Promise() 是三种状态 pending进行中 fulfilled成功 rejected 失败 状态是不可逆
// let p1 = new Promise((resolve, reject)=> {
// resolve(1)
// })
// let p2 = new Promise((resolve, reject)=> {
// setTimeout(()=>{
// resolve(2)
// }, 1000)
// })
// let p3 = new Promise((resolve, reject)=> {
// setTimeout(()=>{
// reject(3)
// }, 1000)
// })
// console.log(p1) //resolved
// console.log(p2) //pending
// console.log(p3) //pending
// setTimeout(()=>{
// console.log(p2) //resolved <1000ms 就是pending
// },2000)
// setTimeout(()=>{
// console.log(p3) //resolved
// },2000)
// p1.then((res)=>{
// console.log(res) // 1
// })
// p2.then((res)=>{
// console.log(res) // 2
// })
// p3.catch((res)=>{
// console.log(res) // 3
// })
// let p = new Promise((resolve, reject) =>{
// resolve(1)
// reject(2)
// })
// p.then(res=>{
// console.log(res)
// },err=>{
// console.log(err)
// })
function ajax(url,successCallback, failCallback) {
var xmlhttp
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest()
}else{
xmlhttp = new ActiveXObject('Microsoft.XMLHTTP')
}
// 发送请求
xmlhttp.open("GET", url, true)
xmlhttp.send()
//服务端的响应
xmlhttp.onreadystatechange = function () {
if(xmlhttp.readyState === 4 && xmlhttp.status === 200) {
var obj = JSON.parse(xmlhttp.response)
//console.log(obj)
successCallback && successCallback(obj) //判断参数传递了就去调用
}else if(xmlhttp.readyState === 4 && xmlhttp.status === 404){
failCallback && failCallback(xmlhttp.statusText)
}
}
}
function getPromise(url) {
return new Promise((resolve, reject) => {
ajax(url, res=>{
console.log(res)
resolve(res)
}, err=>{
console.log(err)
reject(err)
})
})
}
let url1 = "http://192.168.0.105/es6/json/a.json"
let url2 = "http://192.168.0.105/es6/json/bb.json"
let url3 = "http://192.168.0.105/es6/json/c.json"
// getPromise(url1).then((res) =>{
// console.log("A成功")
// return getPromise(url2)
// }).then(res =>{
// console.log("B成功")
// return getPromise(url3)
// }).then(res=>{
// console.log("C成功")
// })
// getPromise(url1).then((res) =>{
// console.log("A成功")
// return getPromise(url2)
// }, err => {
// console.log("A失败")
//
// return getPromise(url2) //return 如果没有返回对象就默认放回一个空对象
// }).then(res =>{
// console.log("B成功")
// return getPromise(url3)
// },err => {
// console.log("B失败")
// return getPromise(url3)
// }).then(res=>{
// console.log("C成功")
// })
// getPromise(url1).then((res) =>{
// console.log("A成功")
// return getPromise(url2)
// }).then(res =>{
// console.log("B成功")
// return getPromise(url3)
// }).then(res=>{
// console.log("C成功")
// }).catch(err => {
// console.log(err)
// }) //异步一个同意的管理就是catch写在这里
//Promise静态方法
// let p1 = Promise.resolve("success") //成功的状态
// console.log(p1)
// p1.then(res=>{
// console.log(res)
// })
// let p2 = Promise.reject("fail") //失败的状态
// console.log(p2) //单独写就报错 需要捕获
// p2.catch(err=>{
// console.log(err)
// })
// function foo (flag) {
// if(flag) {
// return new Promise(resolve => {
// resolve("success")
// })
// }else{
// // return "fail"
// return Promise.reject("fail")
// }
// }
// foo(true).then(res =>{
// console.log(res)
// })
// foo(false).catch(err =>{
// console.log(err)
// })
let p1 = new Promise(((resolve, reject) => {
setTimeout(()=>{
console.log(1)
resolve("1成功")
},1000)
}))
let p2= new Promise(((resolve, reject) => {
setTimeout(()=>{
console.log(2)
reject("2失败")
},2000)
}))
let p3 = new Promise(((resolve, reject) => {
setTimeout(()=>{
console.log(3)
resolve("3成功")
},3000)
}))
//Promise.all只要一个失败就进入失败
// Promise.all([p1, p2, p3]).then(res => {
// console.log(res)
// console.log(4444)
// },err=>{
// console.log(err)
// })
//Promise.race 只要一个成功就确认都成功了
Promise.race([p1, p2, p3]).then(res => {
console.log(res)
}, err =>{
console.log(err)
})
let url = ""
const imgArr = ["1.jpg", "2.jpg", "3.jpg"]
let promiseArr = []
//Promise 应用 上传图片 全部上传完成
imgArr.forEach((item)=>{
promiseArr.push(new Promise((resolve, reject) => {
resolve(url)
}))
})
Promise.all(promiseArr).then(res=> {
// 插入数据库
console.log("图片上传完成")
})
function getImg() {
return new Promise((resolve, reject) => {
let img = new Image()
img.onload = function (){
resolve("图片上传成功")
}
img.src = "http://17design.cn/public/images/logo.png"
})
}
function timeout() {
return new Promise((resolve, reject) => {
setTimeout(()=>{
reject("图片请求超时")
},2000)
})
}
Promise.race([getImg(), timeout()]).then(res=>{
console.log(res)
}, err=>{
console.log(err)
})
一起设计吧
