[TOC]
>[success] # 類數組對象
什么是 **類數組對象** ?
**類數組對象** : **類數組對象** 是指一個 **對象** ,它看起來 **像一個數組** ,因為它有一個 **length 屬性** 和一些 **數字索引** , **但它不是一個真正的數組,因為它沒有數組對象的方法和屬性,例如 push(), pop(), slice() 等等**。
**類數組對象數據結構**
~~~
var obj = {
0: 'a',
1: 'b',
length: 2
}
~~~
為了讓 **類數組對象** 可以像真正的數組一樣操作,我們可以將它們 **轉換成數組** 。常用的方法有:
1. **Array.from()**
2. **Array.prototype.slice.call()**
3. **Array.prototype.concat.apply([], arrLikeObj)**
**轉換代碼**
~~~
// 類數組對象(類似數組的對象,沒有數組的方法)
var obj = {
0: 'a',
1: 'b',
length: 2
}
console.log(Array.from(obj)) // ['a', 'b']
console.log(Array.prototype.slice.call(obj)) // ['a', 'b']
console.log(Array.prototype.concat.apply([], obj)) // ['a', 'b']
~~~
需要注意的是, **類數組對象** 只包含 **數字索引** 的元素,**不包含其他屬性 ,因此轉換成數組后也只能保留元素的值,不能保留其他屬性。同時,如果類數組對象的 length 屬性值不準確,可能會導致一些轉換問題**
>[success] ## 總結
**Array.from** 方法不僅可以把 **類數組對象** 轉換成 **數組** ,也可以把 **可迭代對象(Array(數組)、String(字符串)、Map、Set、TypedArray、arguments 對象等)** 轉換成 **數組** 。
- Javascript基礎篇
- Array數組
- 數組插入值
- filter()
- forEach()
- push()
- pop()
- unshift()
- shift()
- valueOf()
- 面向對象思想
- Javascript 面向對象編程(一):封裝
- Javascript面向對象編程(二):構造函數的繼承
- Javascript面向對象編程(三):非構造函數的繼承
- 解構
- 數組的解構賦值
- 對象的解構賦值
- 函數參數解構
- 字符串的解構賦值
- 數值和布爾值的解構賦值
- 圓括號問題
- 字符串.
- split()
- charAt()
- charCodeAt()
- concat()
- indexOf()
- lastIndexOf()
- match()
- replace()
- includes()
- 初識遞歸
- 渲染ul-li樹形結構
- 異步函數解決方案
- 1. callback回調函數
- 2. ES6 - Promise
- JavaScript高級程序設計(書)
- 在html中使用JavaScript
- script標簽的位置
- 延遲腳本
- 異步腳本
- <noscript>元素
- 基本概念
- 嚴格模式
- 變量詳解
- 數據類型
- typeof操作符
- undefined類型
- Null類型
- Boolean類型
- Number類型
- 深入了解ES6(書)
- var 、let 、 const
- 字符串與正則表達式
- 字符串
- 正則表達式
- 函數
- 函數形參默認值
- 使用不具名參數
- 函數構造器的增強能力
- 擴展運算符
- name屬性
- 明確函數的多重用途
- 塊級函數
- 箭頭函數
- 尾調用優化
- 擴展的對象功能
- 對象類別
- 對象字面量語法的擴展
- ES6對象新增方法
- 重復的對象屬性
- 自有屬性的枚舉順序
- 更強大的原型
- 解構:更方便的數據訪問
- 為什么要用解構?
- 對象解構
- 數組解構
- 混合解構
- 參數解構
- Symbol與Symbol屬性
- 創建Symbol
- Symbol的使用方法
- Symbol全局私有屬性
- Symbol與類型強制轉換
- Symbol屬性檢索
- Symbol的一些構造方法
- Set集合與Map集合
- Set集合
- Weak Set集合(弱引用Set集合)
- Map集合
- JS標準內置對象
- Object 構造函數及屬性
- Object 構造方法
- Symbol 內建對象類的函數及屬性
- Set 構造函數及屬性
- Weak Set 構造函數及屬性
- JS雜項
- 類數組對象
- Class類的理解和使用