前端經常使用屬性及方法彙總（下篇）

書接上會把剩餘的繼續寫完！

1三、判斷Object中是否含有某個屬性

你們比較熟悉的 `Object.hasOwnProperty();`
還有一中： `key in Object;`
這兩種也能夠用來判斷Object是否爲空！

---

1四、使用map遍歷Object

都是到map是數組的方法，可是有些場景時候我也須要遍歷數組又不能使用`for in` 或者`for of`的時候怎麼辦呢！
咱們能夠是用一下三個方法：
`Object.keys();`：
這個方法返回的是Object中的全部`key`組成一個數組；

`Object.values();`
這個方法返回的是Object中的全部`value`組成一個數組；

`Object.entries();`：
這個方法返回的是一個二位數組，子集包含Object的key和value；

---

1五、Object.is();

方法是將兩個Object做比較，省去了咱們循環遍歷的代碼；

---

1六、Object.assign();與 {...object1, ...object2}

這個方法相似於數組的concat方法，不一樣的是`Object.assign();`鏈接從來你給個對象的時候若是

兩個對象有屬性重複的時候，後面的會把前面的覆蓋; es6中咱們簡寫成`{...object1, ...object2}`

---

1七、... 拓展運算符

es6中新提出來的，主要做用:

 - 合併array或者object

```
// ES5 的寫法  
var arr1 = [0, 1, 2];  
var arr2 = [3, 4, 5];  
arr1.conant(arr1, arr2);  
// ES6 的寫法  
var arr1 = [0, 1, 2];  
var arr2 = [3, 4, 5];  
arr1.push(...arr2); 
```

 - 與解構賦值結合

    ```
    // ES5  
    a = list[0], rest = list.slice(1)  
    // ES6  
    [a, ...rest] = list  
    下面是另一些例子。  
    const [first, ...rest] = [1, 2, 3, 4, 5];  
    first // 1  
    rest // [2, 3, 4, 5]  
    const [first, ...rest] = [];  
    first // undefined  
    rest // []:  
    const [first, ...rest] = ["foo"];  
    first // "foo"  
    rest // []  
    ```
    或者不少博主寫的`剩餘參數`都是這個東西
    
    ```
    function add(first, second, ...remaining) {
      return first + second;
    }
    ```
    
 - 函數的返回值
    JavaScript 的函數只能返回一個值，若是須要返回多個值，只能返回數組或對象。擴展運算符提供瞭解決這個問題的一種變通方法。
    
    ```
    var dateFields = readDateFields(database);  
    var d = new Date(...dateFields);  
    ```
    上面代碼從數據庫取出一行數據，經過擴展運算符，直接將其傳入構造函數Date。
    
     - 字符串
    擴展運算符還能夠將字符串轉爲真正的數組。
    
    ```
    [...'hello']  
    // [ "h", "e", "l", "l", "o" ]  
    ```
    上面的寫法，有一個重要的好處，那就是可以正確識別 32 位的 `Unicode` 字符。
    
    ```
    'x\uD83D\uDE80y'.length // 4  
    [...'x\uD83D\uDE80y'].length // 3  
    ```
    上面代碼的第一種寫法， JavaScript 會將 32 位 Unicode 字符，識別爲 2 個字符，採用擴展運算符就沒有這個問題。所以，正確返回字符串長度的函數，能夠像下面這樣寫。
    
    ```
    function length(str) {  
       return [...str].length;  
    }  
    length('x\uD83D\uDE80y') // 3  
    
    ```

---

1八、[]設定變量爲屬性名

慄

let obj = {}, name = 'machinist'
obj[name] = 1111;
console.log(obj);  //{machinist: 1111}

---

在補上一些經常使用的簡寫

1. 當if條件內部只有一行代碼的時候省略{}
   慄：

   if（true）retrun true
   else return false

2. 當函數體內只有一行代碼的時候
   慄：

   () => ...你的代碼

   等同於：

   （）=> {
      ....
      }

3. 當函數體內return一個map的時候能夠省略return 以及函數的大括號；
   慄：

   arrayMap = data => data.map(item => {
   ....處理邏輯
   })

   等同於：

   arrayMap = (data) => {
      return data.map(item => {
         ....處理邏輯
      })
   }

4. 同時聲明多個變量的時候；
   慄：

   let a = 1, b = 2, c = 3, ..., z = 26;

   等同於:

   let a = 1;
   let b = 2;
   ...;
   let z = 26;

   5.聲明對象帶方法的

   慄：

   let object = {
       func(){
           ...
       },
       func1(){
            ...
       },
       func2(){
            ...
       },
   }

   等同於：

   let object = {
       func：() => {
           ...
       },
       func1：() =>{
            ...
       },
       func2：() =>{
            ...
       },
   }