Promise的理解

函数对象和实例对象
实例对象：new 函数产生的对象
函数对象：将函数做为对象使用

1.2二种回调函数
1.2.1 同步回调

理解：当即执行，彻底执行完了才结束，不会放入回调队列中

eg：数组遍历相关的回调函数 // Promise的excutor函数

const  arr = [1,3,5]
arr.forEach(item => { // 遍历回调,同步
  console.log(item)
})
console.log(‘forEach()以后’)

1.2.2 异步回调

理解：不会当即执行，会放入回调队列中未来执行

Eg：定时器回调 // ajax回调 / Promise的成功或失败的回调

setTimeout(() => {  // 异步回调函数，会放入队列未来执行
  console.log(‘setTimeout()’)
},0)
console.log(‘setTimeout()以后’)

Error
目标：进一步理解JS中的错误（Error）和错误处理

1. 错误的类型
   Error：全部错误的父类型

//1.常见的内置错误
1）ReferenceError：引用的变量不存在

console.log(a) // ReferenceError：a is not defined 。

//没有捕获error，下面的代码不会执行
2）TypeError：数据类型不正确的错误

let b
console.log(b.xxx) //TypeError：cannot read property ‘xxx’ of undefined
b={}
b.xxx() //TypeError：b.xxx is not a function

3）RangeError：数据值不在其所容许的范围内
function fn() {
fn()
}
fn() //RangeError：Maximum call stack size exceeded
4）SyntaxError：语法错误

1. 错误处理

捕获错误：try...catch
try {
let d
console.log(d.xxx)
} catch (error) {
console.log(error.message)
conaole.log(error.stack)
}
抛出错误：throw error
function something() {
If (Date.now()%2===1) {

console.log(‘当前时间为奇数，能够执行’)

} else {

throw new Error(‘当前时间为偶数，不可执行’)

}
}
//捕获处理异常
try {
Something()
} catch (error) {
console.log(error.message)
}

1. 错误对象

message属性：错误相关信息
stack属性：函数调用栈记录相关信息

Promise 的理解和使用
2.1 promise是什么？
1.抽象表达：
Promise 是JS中进行异步编程的新的解决方案（旧的是谁？）

1. 具体表达：

（1）从语法上说：promise是一个构造函数
（2）从功能上说：promise对象用来封装一个异步操做并能够获取其结果

2.1.2 promise的状态改变

1. pending 变为resolved
2. Pending变为rejected

说明：只有2种，且一个promise对象只能改变一次，不管变成为成功仍是失败，都会有一个结果数据，成功的结果数据通常为value，失败的结果数据通常为reason

2.1.3 promise的基本流程

2.1.4 promise的使用

//1.建立一个新的promise对象
const p = new Promise((resolve, reject) => { // 执行器函数
   // 2.执行异步操做任务
  setTimeout(() => {  // 异步回调函数，会放入队列未来执行 
    const time = Date.now() // 若是当前时间是偶数就表明成功，不然失败
   //3.1 若是成功，调用resolve（value）
   If (time%2 == 0) {
    resolve(‘成功的数据， time=’, + time)
   }  else {
   // 3.2 若是失败，调用reject（reason）
    reject(‘失败的数据， time=’, + time)
   }
 },1000)
})
p.then(
 value => { //接收到成功的value数据  onResolved
console.log(‘成功的回调’, value)
},
reason => {  //接收到失败的reason数据  onReject
 console.log(‘失败的回调’, reason)
})

1.如何改变Promise的状态
（1） resolve（value）：若是当前是pending就会变为resolved
（2） reject（reason）：若是当前是pending就会变为rejected
（3） 抛出异常：若是当前是pending就会变为rejected
2.一个promise指定多个成功/失败回调函数，都会调用吗？
当promise改变对应状态时都会调用

var pp = new Promise((resolve, reject) => {
//resolve（1）//promise变为resolved成功状态
//rejected（2）// promise变为rejected失败状态
 //throw new Error（‘出错了’）// promise变为rejected失败状态，reason为抛出的error
  throw 3 // 抛出异常，promise变为rejected失败状态，reason为抛出的3
})
pp.then(
value => {},
reason => {console.log('reason', reason)}
)

3.改变Promise状态和指定回调函数谁先谁后？
（1）都有可能，正常状况下是先指定回调在改变状态，但也能够先改变状态再指定回调
（2）如何先改变状态再指定回调？
1）在执行器中直接调用resolve（）/reject（）
2）延迟更长时间再调用then
（3）何时才能获得数据？
1）若是先指定的回调，那当状态发生改变时，回调函数就会调用，获得数据
2）若是先改变状态，那当指定回调时，回调函数就会调用，获得数据

// 1常规：先指定回调函数，后改变状态
new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve(1) // 后改变的状态（同时指定数据），异步执行回调函数
  },1000);
}).then( // 先指定回调函数，保存当前指定的回调函数
  resolve => {console.log('resolve', resolve)},
  reason => {console.log('reason', reason)}
)

// 2先改变状态,后指定回调函数
new Promise((resolve, reject) => {
  resolve(2) // 先改变的状态（同时指定数据）
}).then( // 后指定回调函数，异步执行回调函数
  resolve => {console.log('resolve2', resolve)},
  reason => {console.log('reason2', reason)}
)

// 3
var p = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve(3) // 后改变的状态（同时指定数据），异步执行回调函数
  },1000);
})
setTimeout(() => {
  p.then( // 先指定回调函数，保存当前指定的回调函数
    resolve => {console.log('resolve3', resolve)},
    reason => {console.log('reason3', reason)}
  )
}, 1100)

4.Promise.then()返回的新Promise的结果状态由什么决定？
（1）简单表达：由then（）指定的回调函数执行的结果决定
（2）详细表达：

1）若是抛出异常，新Promise变为rejected，reason为抛出的异常
 2）若是返回的是非Promise的任意值，新Promise变为resolved，value为返回值,未返回则默认为undefined
 3）若是返回的是另外一个新Promise，此Promise的结果就会成为新Promise的结果

new Promise((resolve, reject) => {
  resolve(1)
}).then( 
  resolve => {console.log('onResolved1()', resolve)},
  reason => {console.log('onRejected1()', reason)}
).then( 
  resolve => {console.log('onResolved2()', resolve)},
  reason => {console.log('onRejected2()', reason)}
)

5.Promise如何串联多个操做任务？
（1）Promise的then（）返回一个新的Promise，能够当作then（）的链式调用
（2）经过then的链式调用串联多个同步/异步任务

new Promise((resolve, reject) => {
  setTimeout(() => {
    console.log('执行任务1（异步）')
    resolve(1)
  },1000);
}).then(
  resolve => {
    console.log('执行任务1的结果：', resolve)
    console.log('执行任务2（同步）')
    return 2
  }
).then(
  resolve => {
    console.log('执行任务2的结果：', resolve)
    return new Promise((resolve, reject) => {
      setTimeout(() => {
        console.log('执行任务3（异步）')
        resolve(3)
      },1000);
    })
  }
).then(
  resolve => {
    console.log('执行任务3的结果：', resolve)
  }
)

6.Promise异常穿透？
（1）当使用Promise的then链式调用时，能够在最后指定失败的回调
（2）前面任何操做出现了异常，都会传到最后失败的回调中处理

new Promise((resolve, reject) => {
  rejected(1)
}).then( 
  resolve => {console.log('onResolved1()', resolve)},
  reason => {throw reason} // 可省略，即穿透
).then( 
  resolve => {console.log('onResolved2()', resolve)},
  reason => {throw reason} // 可省略，即穿透
).then( 
  resolve => {console.log('onResolved3()', resolve)},
  reason => {throw reason} // 可省略，即穿透
).catch(reason => {
  console.log('onRejected()', reason)
})

7.中断Promise链？
（1）当使用Promise的then链式调用时，在中间中断，再也不调用后面的回调函数
（2）办法：在回调函数中返回一个pending状态的Promise对象

new Promise((resolve, reject) => {
  rejected(1)
}).then( 
  resolve => {console.log('onResolved1()', resolve)}
).then( 
  resolve => {console.log('onResolved2()', resolve)}
).then( 
  resolve => {console.log('onResolved3()', resolve)}
).catch(reason => {
  console.log('onRejected()', reason)
  // throw reason
  // return Promise.rejected(reason)
  return new Promise(() => {}) //返回一个Pending的Promise中断
}).then( 
  resolve => {console.log('onResolved4()', resolve)},
  reason => {console.log('onRejected4()', reason)}
)