前端小知識,面試,長知識必備---類數組,push方法,對象轉數組的方式

前端小知識,面試,長知識必備.2

類數組,push方法,對象轉數組的方式

  首先看一個例子:

var obj = {
        '2': 3,
        '3': 4,
        'length': 2,
        'splice': Array.prototype.splice,
        'push': Array.prototype.push
    }
obj.push(1);
obj.push(2);
console.log(obj);

這個輸出什麼?

首先,這個obj是一個對象,但是這個對象包含數組的屬性(length,splice,push...)方法,,那這種對象叫什麼呢?

在這裏我們有個概念:

類數組（ArrayLike）：

  一組數據，由數組來存，但是如果要對這組數據進行擴展，會影響到數組原型，ArrayLike的出現則提供了一箇中間數據橋樑，ArrayLike有數組的特性， 但是對ArrayLike的擴展並不會影響到原生的數組

因此這個obj就是符合類數組的特徵的,因此這個obj就是屬於類數組.因此這個類數組也是可以用數組的方法的(在對象中引用了數組方法的前提下)

其次,我們要再回顧下數組的push方法:

push 方法有意具有通用性。該方法和 call() 或 apply() 一起使用時，可應用在類似數組的對象上。push 方法根據 length 屬性來決定從哪裏開始插入給定的值。如果 length 不能被轉成一個數值，則插入的元素索引爲 0，包括 length 不存在時。當 length 不存在時，將會創建它。 唯一的原生類數組（array-like）對象是 Strings，儘管如此，它們並不適用該方法，因爲字符串是不可改變的。

因此對於上題我們可以分析得到:

這個obj中定義了兩個key值，分別爲splice和push分別對應數組原型中的splice和push方法，因此這個obj可以調用數組中的push和splice方法.
調用對象的push方法：push(1)，因爲此時obj中定義length爲2，所以從數組中的第二項開始插入，也就是數組的第三項（下表爲2的那一項），因爲數組是從第0項開始的，這時已經定義了下標爲2和3這兩項，所以它會替換第三項也就是下標爲2的值.
第一次執行push完，此時key爲2的屬性值爲1，同理：第二次執行push方法，key爲3的屬性值爲2。
此時的輸出結果就是： Object(4) [empty × 2, 1, 2, splice: ƒ, push: ƒ]----> [ 2: 1, 3: 2, length: 4, push: ƒ push(), splice: ƒ splice() ]