# 第一種
```
const fs = require('fs')
const path = require('path')
function getFileByPath(fpath) {
return promise = new Promise(function (resolve, reject) {
fs.readFile(path.join(__dirname, fpath), 'utf-8', (err, data) => {
if (err) return reject(err);
resolve(data);
});
});
}
//如果前面的Promise執行失敗,我們不想讓后續的Promise操作被終止,可以為每個Promise指定失敗的回調
getFileByPath('./1.txt')
.then(function (data) {
console.log(data);
return getFileByPath('./2.txt');
}, function (error) {
//return 一個新的Promise,讓后續的可以繼續執行
console.log('文件1失敗:' + error.message)
return getFileByPath('./2.txt');
}).then(function (data) {
console.log(data);
return getFileByPath('./3.txt');
}, function (error) {
console.log('文件2失敗:' + error.message)
return getFileByPath('./3.txt');
}).then(function (data) {
console.log(data)
}, function (error) {
console.log('文件3失敗:' + error.message)
}).catch(function (error) {
console.log(error.message);
})
console.log('ok')
```
結果
```
ok //因為promise是異步操作
111
222
333
```
哪怕前面的promise執行失敗了,但是不要影響后序的promise的正常執行,此時,我們可以單獨為每個promise通過.then指定一下失敗的回調.
# 第二種
有時候我們有這樣的需求,和上面的需求剛好相反,如果后序的promise執行依賴于前面的promise執行的結果,如果前面的失敗了,則后面的就沒有繼續執行下去的意義了,此時,我們想要實現,一旦有報錯,則離職終止所有promise的執行.
```
const fs = require('fs')
const path = require('path')
function getFileByPath(fpath) {
return promise = new Promise(function (resolve, reject) {
fs.readFile(path.join(__dirname, fpath), 'utf-8', (err, data) => {
if (err) return reject(err);
resolve(data);
});
});
}
//如果前面的Promise執行失敗,我們不想讓后續的Promise操作被終止,可以為每個Promise指定失敗的回調
getFileByPath('./1.txt')
.then(function (data) {
console.log(data);
return getFileByPath('./12.txt');
})
.then(function (data) {
console.log(data);
return getFileByPath('./3.txt');
})
.then(function (data) {
console.log(data)
})
.catch(function (error) { //catch的作用:如果前面有任何的promise執行失敗,則立即終止所有的promise的執行,并馬上進行catch去處理promise中拋出的異常
console.log(error.message);
})
console.log('ok')
```
- 函數
- arguments
- 作用域
- 作用域鏈
- 預解析
- 對象
- 簡單類型和復雜類型
- 內置對象
- Web API
- DOM
- 獲取頁面元素
- 注冊事件及應用
- 點擊切換圖片
- 非表單元素的屬性
- 取消a標簽的默認行為
- 美女輪播圖
- innerText和innerHTML
- 表單元素的屬性
- 下拉框選中項
- 全選反選
- 自定義屬性
- mouseenter和mouseover區別
- 樣式操作及應用
- 操作樣式
- 鏈式操作原理
- 顯示隱藏二維碼
- 高亮正在輸入的文本框
- 隔行變色
- tab欄切換
- 常見dom操作
- 節點介紹及應用
- 模擬DOM
- 兄弟節點
- 獲取子節點
- 菜單
- 父子節點
- 動態創建元素及應用
- 動態創建元素
- 動態創建列表
- 動態創建表格
- 動態創建元素性能對比
- 常用元素操作方法
- 事件詳解
- 注冊事件的幾種方式
- addEventListener
- 移除事件
- 事件的三個階段
- 事件委托
- 事件對象1
- 事件對象2
- 事件對象3
- 圖片跟著鼠標移動
- 獲取鼠標在盒子中的坐標
- 獲取頁面滾動的距離
- 取消默認行為的執行
- 阻止事件冒泡
- input只能輸入數字
- BOM
- 概述
- 對話框
- JS加載詳解
- setTimeout
- setInterval
- 簡單動畫
- location
- history
- UserAgent
- offset,client,scroll
- offset系列屬性
- client系列屬性
- scroll系列屬性
- 拖拽案例
- 彈出登錄窗口
- 動畫函數封裝
- 高級
- 瀏覽器的組成
- 面向對象
- 概述
- 面向對象開發過程
- 創建對象
- new的時候發生了什么
- 靜態成員和實例成員
- 構造函數的原型
- 對象的原型
- 三者關系
- 原型鏈
- 屬性查找規則
- 注意點
- 擴展內置對象
- 繼承
- 原型繼承
- call
- 借用構造函數
- 組合繼承
- 函數進階
- 函數聲明和函數表達式
- 函數也是對象
- 函數調用方式和this指向
- call,bind,apply改變函數中的this
- AJAX
- 基礎知識
- 原生AJAX
- 同步與異步
- JS異步原理
- Node
- 模塊化
- 概述
- 模塊成員導出詳解
- ES6
- 解構賦值
- 字符串擴展
- 函數拓展
- 箭頭函數
- 類與繼承
- export default 和export
- Promise
- 回調函數
- 回調地獄
- promise基本概念
- Promosew實例只要被創建就立即執行里面的異步方法
- 使用then指定成功和失敗的回調
- promise正確使用方式
- 捕獲異常的兩種方式
- NPM和NRM
- WebPack
- 概述
- plugin配置和使用
- loader配置和使用
- webpack和vue結合
- webpack中導入和script標簽
- vue中結合render函數渲染指定組件到容器中
- 總結
- vue-router
- 跨域
- json
- jQuery
- 概述
- 注意
- dom對象和jquery對象互轉
- 選擇器
- 基礎選擇器
- 綁定事件
- 觸發器
- 事件對象
- 事件冒泡
- 取消事件冒泡
- HTML5新增API
- 檢測網絡狀態
- 全屏
- 文件讀取
- 地理定位
- 百度地圖名片
- 拖放
- 本地存儲
- 應用緩存
- 多媒體播放器布局