Promise對象
1. 理解:
* Promise對象: 代表了未來某個將要發(fā)生的事件(通常是一個異步操作)
* 有了promise對象, 可以將異步操作以同步的流程表達出來, 避免了層層嵌套的回調函數(shù)(俗稱'回調地獄')
* ES6的Promise是一個構造函數(shù), 用來生成promise對象的實例
2. 使用promise基本步驟(2步):
* 創(chuàng)建promise對象
let promise = new Promise((resolve, reject) => {
? ? //初始化promise狀態(tài)為 pending
? //執(zhí)行異步操作
? if(異步操作成功) {
? ? resolve(value);//修改promise的狀態(tài)為fullfilled
? } else {
? ? reject(errMsg);//修改promise的狀態(tài)為rejected
? }
})
* 調用promise的then()
promise.then(function(
? result => console.log(result),
? errorMsg => alert(errorMsg)
))
3. promise對象的3個狀態(tài)
* pending: 初始化狀態(tài)
* fullfilled: 成功狀態(tài)
* rejected: 失敗狀態(tài)
4. 應用:
* 使用promise實現(xiàn)超時處理
* 使用promise封裝處理ajax請求
let request = new XMLHttpRequest();
request.onreadystatechange = function () {
}
request.responseType = 'json';
request.open("GET", url);
request.send();
5. promise過程分析:
class
1. 通過class定義類/實現(xiàn)類的繼承
2. 在類中通過constructor定義構造方法
3. 通過new來創(chuàng)建類的實例
4. 通過extends來實現(xiàn)類的繼承
5. 通過super調用父類的構造方法
6. 重寫從父類中繼承的一般方法
字符串擴展
1. includes(str) : 判斷是否包含指定的字符串
2. startsWith(str) : 判斷是否以指定字符串開頭
3. endsWith(str) : 判斷是否以指定字符串結尾
4. repeat(count) : 重復指定次數(shù)
數(shù)值擴展
1. 二進制與八進制數(shù)值表示法: 二進制用0b, 八進制用0o
2. Number.isFinite(i) : 判斷是否是有限大的數(shù)
3. Number.isNaN(i) : 判斷是否是NaN
4. Number.isInteger(i) : 判斷是否是整數(shù)
5. Number.parseInt(str) : 將字符串轉換為對應的數(shù)值
6. Math.trunc(i) : 直接去除小數(shù)部分
數(shù)組擴展
1. Array.from(v) : 將偽數(shù)組對象或可遍歷對象轉換為真數(shù)組
2. Array.of(v1, v2, v3) : 將一系列值轉換成數(shù)組
3. find(function(value, index, arr){return true}) : 找出第一個滿足條件返回true的元素
4. findIndex(function(value, index, arr){return true}) : 找出第一個滿足條件返回true的元素下標
對象擴展
1. Object.is(v1, v2)
* 判斷2個數(shù)據(jù)是否完全相等
2. Object.assign(target, source1, source2..)
* 將源對象的屬性復制到目標對象上
3. 直接操作 __proto__ 屬性
let obj2 = {};
obj2.__proto__ = obj1;
深度克隆
1塔插、數(shù)據(jù)類型：
* 數(shù)據(jù)分為基本的數(shù)據(jù)類型(String, Number, boolean, Null, Undefined)和對象數(shù)據(jù)類型
- 基本數(shù)據(jù)類型特點： 存儲的是該對象的實際數(shù)據(jù)
- 對象數(shù)據(jù)類型特點： 存儲的是該對象在棧中引用，真實的數(shù)據(jù)存放在堆內存里
2拓哟、復制數(shù)據(jù)
- 基本數(shù)據(jù)類型存放的就是實際的數(shù)據(jù)想许，可直接復制
let number2 = 2;
let number1 = number2;
- 克隆數(shù)據(jù)：對象/數(shù)組
1、區(qū)別： 淺拷貝/深度拷貝
判斷： 拷貝是否產生了新的數(shù)據(jù)還是拷貝的是數(shù)據(jù)的引用
知識點：對象數(shù)據(jù)存放的是對象在棧內存的引用断序，直接復制的是對象的引用
let obj = {username: 'kobe'}
let obj1 = obj; // obj1 復制了obj在棧內存的引用
2流纹、常用的拷貝技術
1). arr.concat(): 數(shù)組淺拷貝
2). arr.slice(): 數(shù)組淺拷貝
3). JSON.parse(JSON.stringify(arr/obj)): 數(shù)組或對象深拷貝, 但不能處理函數(shù)數(shù)據(jù)
4). 淺拷貝包含函數(shù)數(shù)據(jù)的對象/數(shù)組
5). 深拷貝包含函數(shù)數(shù)據(jù)的對象/數(shù)組
Set和Map數(shù)據(jù)結構
1. Set容器 : 無序不可重復的多個value的集合體
* Set()
* Set(array)
* add(value)
* delete(value)
* has(value)
* clear()
* size
2. Map容器 : 無序的 key不重復的多個key-value的集合體
* Map()
* Map(array)
* set(key, value)//添加
* get(key)
* delete(key)
* has(key)
* clear()
* size
for_of循環(huán)
for(let value of target){}循環(huán)遍歷
1. 遍歷數(shù)組
2. 遍歷Set
3. 遍歷Map
4. 遍歷字符串
5. 遍歷偽數(shù)組
ES7
1. 指數(shù)運算符(冪): **
2. Array.prototype.includes(value) : 判斷數(shù)組中是否包含指定value
Vue 的基本認識
介紹描述
1）漸進式 JavaScript 框架
2）作者: 尤雨溪(一位華裔前 Google 工程師)
3）作用: 動態(tài)構建用戶界面
?Vue 的特點
1）遵循 MVVM 模式
2）編碼簡潔, 體積小, 運行效率高, 適合移動/PC 端開發(fā)
3）它本身只關注 UI, 可以輕松引入 vue 插件或其它第三方庫開發(fā)項目
1.1.4. 與其它前端 JS 框架的關聯(lián)
1）借鑒 angular 的模板和數(shù)據(jù)綁定技術
2）借鑒 react 的組件化和虛擬 DOM 技術
Vue 擴展插件
1）vue-cli: vue 腳手架
2）vue-resource(axios): ajax 請求
3）vue-router: 路由
4）vuex: 狀態(tài)管理
5）vue-lazyload: 圖片懶加載
6）vue-scroller: 頁面滑動相關
7）mint-ui: 基于 vue 的 UI 組件庫(移動端)
8）element-ui: 基于 vue 的 UI 組件庫(PC 端)
9）它本身只關注 UI, 可以輕松引入 vue 插件或其它第三方庫開發(fā)項目
