js語言規範_ES5-6-7_我的總結

## **理解ES**
1. 全稱: ECMAScript
2. js語言的規範
3. 咱們用的js是它的實現
4. js的組成
  * ECMAScript(js基礎)
  * 擴展-->瀏覽器端  
    * BOM
    * DOM
  * 擴展-->服務器端
    * Node.js
      
## ES5
1. **嚴格模式**
  * 運行模式: 正常(混雜)模式與嚴格模式
  * 應用上嚴格式: 'strict mode';
  * 做用: 
    * 使得Javascript在更嚴格的條件下運行
    * 消除Javascript語法的一些不合理、不嚴謹之處,減小一些怪異行爲
    * 消除代碼運行的一些不安全之處,保證代碼運行的安全
    * 須要記住的幾個變化
      * 聲明定義變量必須用var
      * 禁止自定義的函數中的this關鍵字指向全局對象
      * 建立eval做用域, 更安全
      
2. **JSON對象**
  * 做用: 用於在json對象/數組與js對象/數組相互轉換
  * JSON.stringify(obj/arr)
      js對象(數組)轉換爲json對象(數組)
  * JSON.parse(json)
      json對象(數組)轉換爲js對象(數組)
      
3. Object擴展
  * Object.create(prototype[, descriptors]) : 建立一個新的對象
    * 以指定對象爲原型建立新的對象
    * 指定新的屬性, 並對屬性進行描述
      * value : 指定值
      * writable : 標識當前屬性值是不是可修改的, 默認爲true
      * **get方法** : 用來獲得當前屬性值的回調函數
      * **set方法** : 用來監視當前屬性值變化的回調函數
  * Object.defineProperties(object, descriptors) : 爲指定對象定義擴展多個屬性
  
4. Array擴展
  * Array.prototype.indexOf(value) : 獲得值在數組中的第一個下標
  * Array.prototype.lastIndexOf(value) : 獲得值在數組中的最後一個下標
  * **Array.prototype.forEach(function(item, index){}) : 遍歷數組**
  * **Array.prototype.map(function(item, index){}) : 遍歷數組返回一個新的數組**
  * **Array.prototype.filter(function(item, index){}) : 遍歷過濾出一個子數組**
  
5. **Function擴展**
  * Function.prototype.bind(obj)
      * 將函數內的this綁定爲obj, 並將函數返回
  * 面試題: 區別bind()與call()和apply()?
      * fn.bind(obj) : 指定函數中的this, 並返回函數
      * fn.call(obj) : 指定函數中的this,並調用函數
      
6. Date擴展
  * Date.now() : 獲得當前時間值
  
## ES6
1. **2個新的關鍵字**
  * let/const
  * 塊做用域
  * 沒有變量提高
  * 不能重複定義
  * 值不可變
  
2. **變量的解構賦值**
  * 將包含多個數據的對象(數組)一次賦值給多個變量
  * 數據源: 對象/數組
  * 目標: {a, b}/[a, b]
  
3. 各類數據類型的擴展
  * 字符串
    * **模板字符串** 
      * 做用: 簡化字符串的拼接
      * 模板字符串必須用``
      * 變化的部分使用${xxx}定義
    * contains(str) : 判斷是否包含指定的字符串
    * startsWith(str) : 判斷是否以指定字符串開頭
    * endsWith(str) : 判斷是否以指定字符串結尾
    * repeat(count) : 重複指定次數
         
  * 對象
    * **簡化的對象寫法**
      ```
      let name = 'Tom';
      let age = 12;
      let person = {
          name,
          age,
          setName (name) {
              this.name = name;
          }
      };
      ```
    * Object.assign(target, source1, source2..) : 將源對象的屬性複製到目標對象上
    * Object.is(v1, v2) : 判斷2個數據是否徹底相等
    * __proto__屬性 : 隱式原型屬性
     
  * 數組
    * Array.from(v) : 將僞數組對象或可遍歷對象轉換爲真數組
    * Array.of(v1, v2, v3) : 將一系列值轉換成數組
    * find(function(value, index, arr){return true}) : 找出第一個知足條件返回true的元素
    * findIndex(function(value, index, arr){return true}) : 找出第一個知足條件返回true的元素下標
  * 函數
    * **箭頭函數**
      * 用來定義匿名函數
      * 基本語法:
        * 沒有參數: () => console.log('xxxx')
        * 一個參數: i => i+2
        * 大於一個參數: (i,j) => i+j
        * 函數體不用大括號: 默認返回結果
        * 函數體若是有多個語句, 須要用{}包圍
      * 使用場景: 多用來定義回調函數
    * **形參的默認值**
      * 定義形參時指定其默認的值
    * **rest(可變)參數**
      * 經過形參左側的...來表達, 取代arguments的使用
    * **擴展運算符(...)**
      * 能夠分解出數組或對象中的數據
    
4. set/Map容器結構
  * 容器: 能保存多個數據的對象, 同時必須具有操做內部數據的方法
  * 任意對象均可以做爲容器使用, 但有的對象不太適合做爲容器使用(如函數)
  * **Set的特色**: 保存多個value, value是不重複 ====>數組元素去重
  * **Map的特色**: 保存多個key--value, key是不重複, value是能夠重複的
  * API
    * Set()/Set(arr) //arr是一維數組
    * add(value)
    * delete(value)
    * clear();
    * has(value)
    * size
    * 
    * Map()/Map(arr) //arr是二維數組
    * set(key, value)
    * delete(key)
    * clear()
    * has(key)
    * size
    
5. **for--of循環**
  * 能夠遍歷任何容器
  * 數組
  * 對象
  * 僞/類對象
  * 字符串
  * 可迭代的對象
  
6. **Promise**
  * 解決`回調地獄`(回調函數的層層嵌套, 編碼是不斷向右擴展, 閱讀性不好)
  * 能以同步編碼的方式實現異步調用
  * 在es6以前原生的js中是沒這種實現的, 一些第三方框架(jQuery)實現了promise
  * ES6中定義實現API: 
    ```
    // 1. 建立promise對象
    var promise = new Promise(function(resolve, reject){ 
      // 作異步的操做 
      if(成功) { // 調用成功的回調
        resolve(result); 
      } else { // 調用失敗的回調
        reject(errorMsg); 
      } 
    }) 
    // 2. 調用promise對象的then()
    promise.then(function(
      result => console.log(result), 
      errorMsg => alert(errorMsg)
    ))
    ```
7. **class類**
  * 用 class 定義一類
  * 用 constructor() 定義構造方法(至關於構造函數)
  * 通常方法: xxx () {}
  * 用extends來定義子類
  * 用super()來父類的構造方法
  * 子類方法自定義: 將從父類中繼承來的方法從新實現一遍
  * js中沒有方法重載(方法名相同, 但參數不一樣)的語法
  
8. **模塊化(後面講)**

## ES7
* 指數運算符: **
* Array.prototype.includes(value) : 判斷數組中是否包含指定value
  
  
* **區別方法的2種稱謂**
  * 靜態(工具)方法
    * Fun.xxx = function(){}
  * 實例方法
    * 全部實例對象 : Fun.prototype.xxx = function(){} //xxx針對Fun的全部實例對象
    * 某個實例對象 : fun.xxx = function(){} //xxx只是針對fun對象es6

相關文章
相關標籤/搜索