Javascript [ NodeList 배열로 변환 ]

Array.from()

• 노드리스트를 실제 배열로 변환
• ES6 에 새로 도입

const li_list = document.querySelectorAll("div > ul > li");
// NodeList(4) [li, li, li, li]

===========================================================

// === 방법1 === //
const li_arr = Array.from(li_list);
// (4) [li, li, li, li]

// map 메소드는 NodeList 가 아닌 실제 배열만 사용 가능
const name_arr1 = li_arr.map(item => item.innerText);
// (4) ['이름1', '이름2', '이름3', '이름4']

const names = name_arr1.join();
// 이름1,이름2,이름3,이름4

===========================================================

// === 방법2 === //
const name_arr2 = Array.from(li_list
                             , function(item, index, array){
	return item.innerText;	// item : 배열요소 li 
});
// (4) ['이름1', '이름2', '이름3', '이름4']

const names = name_arr1.join();
// 이름1,이름2,이름3,이름4

===========================================================

// 방법2-1 ( function, 사용하지 않는 파라미터, return 생략) //
const name_arr2 
	= Array.from(li_list, item => item.innerText);
// (4) ['이름1', '이름2', '이름3', '이름4']

const names = name_arr1.join();
// 이름1,이름2,이름3,이름4

정리

• 09javascriptStandardObject
  -> 01_Array_class
  -> 03기타Array와관련된메소드.html, 03.css, 03.js