奇妙JS代碼系列（二）call,apply,bind用處整理

標籤：方式   form   rms   elements   doc   使用   字串數組   整理   apply   

延續系列一：連結，此次主要整理JS裡面很常見的三個函數call，apply，bind的妙用。(apply和call差不多，只是參數的區別)(下面有些這三個可能只是輔助，但是只要用到，我就在這裡整理)

1.類型檢測

上一篇最後一個已經講到，Object.prototype.toString.call()。猶豫上一篇說了，這裡就不多說了。

2.解參，等同於ES6中的...擴充運算子

es6中提出了一種很方便解構字串數組的運算子，這提供了一種簡便機制，可以將任何部署了 Iterator 介面的資料結構，轉為數組。只要某個資料結構部署了 Iterator 介面，就可以對它使用擴充運算子，將其轉為數組。

但是在es5，我們使用Function.prototype.apply(null，數組名)，

function myFunction(x, y, z) { }var args = [0, 1, 2];myFunction.apply(null, args);

es6：

function myFunction(x, y, z) { }var args = [0, 1, 2];myFunction(...args);

3.轉換偽數組

偽數組的定義：

1. 具有length屬性
2. 按索引方式儲存資料
3. 不具有數組的push,pop等方法 如

• function內的arguments
• document.forms，Form.elements，Select.options，document.getElementsByName() ，document.getElementsByTagName()，childNodes/children 等方式擷取的集合（HTMLCollection，NodeList）等。
• 特殊寫法的對象 ：

var obj={}; obj[0] = "1"; obj[1] = "2"; obj[2] = "3"; obj.length = 3; 

但是從本質上來分辨偽數組的話：
如果一個數組的 proto 直接或間接指向 Array.prototye（用到了數組的共用屬性），那麼就是真數組
如果一個數組的 proto 沒有直接或間接指向 Array.prototye，那麼就是偽數組。

將偽數群組轉換成數組的方式：

Array.prototype.slice.call(obj,0); 

使用Array的原型對象中的的方法slice()，用Function.prototype.call傳入。

奇妙JS代碼系列（二）call,apply,bind用處整理