這個(gè)數(shù)據(jù)類型到底是Array還是Object？

最近在研究Vue的源碼，在數(shù)組變異實(shí)現(xiàn)的時(shí)候有有一個(gè)地方存在疑問：Vue是通過設(shè)置一個(gè)數(shù)組重新對(duì)push、pop等數(shù)組方法進(jìn)行封裝，從而能監(jiān)聽到數(shù)組的變動(dòng)，如下：

const arr = [];
[
  'push',
  'pop',
  'shift',
  'unshift',
  'splice',
  'sort',
  'reverse'
].forEach(method => {
    arr[method] = function () {
        console.log('監(jiān)聽到數(shù)組變動(dòng)')
    }
})

那么問題來了，arr這個(gè)變量是以一個(gè)數(shù)組定義的，按道理應(yīng)該可以直接通過數(shù)組下標(biāo)arr[0]來訪問里面的元素，可事實(shí)上這樣是返回的是undefined,通過key的形式取值是可以的，例如arr['push']：

圖片描述

再從控制臺(tái)查看arr，看到他的length居然是0！如下：

圖片描述

上面兩個(gè)跡象可以看到這個(gè)arr的表現(xiàn)跟Object是完全一樣的，但是當(dāng)我對(duì)arr使用Array.isArray(arr)時(shí)，結(jié)果返回的是true，說明arr是一個(gè)數(shù)組，請(qǐng)問這個(gè)arr到時(shí)是個(gè)什么類型呢？

回答

編輯回答

你的瞳

就是一個(gè)簡單的關(guān)聯(lián)數(shù)組，相當(dāng)于Java的map,Python的dict,
可以當(dāng)字典理解，按key取值，當(dāng)然也有長度。

2017年6月13日 07:41

編輯回答

尤禮

就是個(gè)數(shù)組啊。
數(shù)組的index是個(gè)比較特殊的key。

var arr = [1,2,3]
arr.value = 'arr'
arr.value //'arr'
arr.length //3

2018年8月13日 07:11

編輯回答

假灑脫

感謝 @toBeTheLight 和 @憶先的回答，他們的答案給了我一點(diǎn)啟發(fā)，我重新查了下資料來自問自答吧，這主要是常規(guī)數(shù)組和關(guān)聯(lián)數(shù)組的區(qū)別：
常規(guī)數(shù)組已0、1、2...作為數(shù)組的索引，取值的時(shí)候也是根據(jù)數(shù)組下標(biāo)進(jìn)行索引，常見的數(shù)組就是這樣的形式，如：

a = [];
a["1"] = {"string1":"string","string2":"string"};
a["2"] = {"string1":"string","string2":"string"}

JavaScript會(huì)自動(dòng)轉(zhuǎn)換string的index為number:

a = [];
a[1] = {"blah"};
a[2] = {"blah"};

這是一個(gè)常規(guī)數(shù)組。

關(guān)聯(lián)數(shù)組：以key作為數(shù)組的索引，其實(shí)跟普通的對(duì)象沒什么區(qū)別:

b["key1"] = {"string1":"string","string2":"string"};
等價(jià)于:
b.key1 = {"string1":"string","string2":"string"};

其實(shí)這個(gè)就是@憶先所說，可以理解成python中的dict,因?yàn)閖s里面數(shù)組也是一個(gè)對(duì)象，b.key1的行為也是相當(dāng)于給這個(gè)數(shù)組添加一個(gè)key而已，因此此時(shí)b的長度還是0.
參考：
Javascript array length incorrect on array of objects

2017年9月10日 21:43

編輯回答