es6怎麼將類別數組物件轉數組

轉換方法：1、使用「for in」語句將類別數組物件轉換為數組，語法「for(var i in obj){console.log(arr.push(obj[i])); }」；2、使用內建物件keys和valus，語法「Object.keys(obj)」和「Object.values(obj)」；3、使用Array物件的from()函數，語法「Array.from(obj) 」。

本教學操作環境：windows7系統、ECMAScript 6版、Dell G3電腦。

什麼是類別數組？

JavaScript中有一些看起來像卻又不是陣列的對象，叫做類別數組。

什麼是類別數組物件？

只包含使用從0開始的，並且是自然遞增的整數作為鍵，也定義了length用來表示元素個數的對象，通常就認為是類別數組物件。

• 具有指向物件元素的數字索引下標，以及length 屬性告訴我們物件的元素個數；

• 不具有例如像push 、 forEach 以及indexOf 等數組物件具有的方法；

類別數組轉換為數組

第一種方法：使用for in 將類別數組物件轉換為陣列

<script type="text/javascript">
		var obj = {
			0: &#39;a&#39;,
			1: &#39;b&#39;,
			2: &#39;c&#39;,
		};
		console.log(obj[0]);
		console.log(typeof obj);
		var arr = [];
		for(var i in obj){
			console.log(arr.push(obj[i]));
		}
		console.log(arr);
		//把类数组对象放在一个名为arr的新数组里使得obj变成了数组

		console.log(arr instanceof Array);//判断arr是否为数组

	</script>

#如果想要取得整個物件：

let arr1 = []
		for (let i in obj) {
			let newobj = {}
			newobj[i] = obj[i]
			arr1.push(newobj);
		}
		console.log(arr1);

 第二種方法:內建物件keys和valus

內建物件Object.keys：取得鍵

內建物件Object.values取得值

let obj = {
			'1': 5,
			'2': 8,
			'3': 4,
			'4': 6
		};
		//内置对象Object.keys：获取键
		var arr = Object.keys(obj)
		console.log(arr);
		//内置对象Object.values获取值
		var arr2 = Object.values(obj)
		console.log(arr2);

# 第三種方法：Array.from( )

let obj = {
		'0': 5,
		'1': 8,
		'2': 4,
		'3': 6,
		'length':4
	};
	    let arr = Array.from(obj)
		console.log(arr);

 

Array.from()把物件轉換為陣列必須符合2個條件

1:鍵必須是數值

2:必須帶有length的鍵值對

#不寫length時：

加上length鍵值對時：

#擴充知識：for of、for in與forEach的差別

<pre class='brush:php;toolbar:false;'>let arr = [&amp;#39;周一&amp;#39;, &amp;#39;周二&amp;#39;, &amp;#39;周三&amp;#39;, &amp;#39;周四&amp;#39;,&amp;#39;周五&amp;#39;,&amp;#39;周六&amp;#39;,&amp;#39;周日&amp;#39;] // for of for (let item of arr) { console.log(item); } // for in for (let i in arr) { console.log(i); } // forEach arr.forEach(item =&gt; { console.log(item); })</pre>效果如圖所示：
#for of中item代表在陣列中的某一項 
for in中i代表索引，一般用來遍歷物件

forEach方法用於呼叫陣列的每個元素，並將元素傳遞給回呼函數。

for of

1.可以避免 #for-in

 迴圈中的所有陷阱

2.可以使用 break

, 

continue 與 return

#3.

for-of

 迴圈不只支援陣列的遍歷。同樣適用於許多類似陣列的物件

4.它也支援字串的遍歷

5.for-of 並不適用於處理原有的原生物件 

for in

###註：for..in迴圈會把某個類型的原型(prototype)中方法與屬性給遍歷出來，所以這可能會導致程式碼中出現意外的錯誤############for Each#############1、###foreach### 方法沒辦法使用return,break,continue語句來跳出循環#########2、forEach方法中的function回呼有三個參數：##################（1）參數是遍歷的陣列內容（必需）###（2）參數是對應的陣列索引（可選）###（3）參數是陣列本身（可選）###### 3、對陣列的每個元素執行一次提供的函數。返回undefined###

【推薦學習：javascript影片教學】

以上是es6怎麼將類別數組物件轉數組的詳細內容。更多資訊請關注PHP中文網其他相關文章！