Javascript에서 배열에 대한 객체


데이터를 특정 형식으로 변환해야하는 시나리오를 접할 수 있습니다. 마찬가지로, 자바 스크립트에서는 아래에서 설명하는 것처럼 여러 가지 방법으로 Objects 메서드를 사용하여 객체를 배열로 변환 할 수 있습니다. 아래 접근 방식을 사용하여 키-값 쌍으로 데이터를 가져올 수 있습니다.

ES6 : Object.keys ()를 사용하여 JavaScript에서 Object를 배열로 변환

ECMAScript 2015 또는 ES6에서는 객체의 키 데이터 (속성)를 가져 오는 Object.keys () 메서드를 도입했습니다. 아래 예에서는 "Book"개체의 속성 이름을 가져옵니다. 이런 식으로 객체를 배열로 변환 할 수 있습니다.

const Book = {
  Name : "Revolution 2020",
  Author : "Chethan Bhagat"
};

const propertyBook = Object.keys(Book);
console.log(propertyBook);
Output:
[ 'Name', 'Author' ]

ES7 : Object.values ​​()를 사용하여 JavaScript에서 객체를 배열로 변환

ES6 롤아웃에서는 속성 이름 만 가져올 수 있지만 값은 가져올 수 없습니다. 그러나 ts 값도 검색 할 수 있습니다. 따라서 ES7은 아래 예와 같이 값을 가져 오는 옵션을 도입했습니다. 따라서 얻은 출력은 배열 형식입니다. 여기서는 Object.keys ()를 사용하여 속성 이름을 가져오고 Object.values ​​()를 사용하여 속성 값을 가져옵니다.

const Book = {
  Name : "Revolution 2020",
  Author : "Chethan Bhagat"
};

const propertyBook = Object.keys(Book);
const propertyValues = Object.values(Book);

console.log(propertyBook);
console.log(propertyValues);
Output:
[ 'Name', 'Author' ]
[ 'Revolution 2020', 'Chethan Bhagat' ]

ES7 : Object.entries () 사용

때로는 단일 메서드를 사용하여 속성 이름과 값을 모두 검색 할 수 있습니다. 이를 위해 ES7은 Object.entries () 메서드를 출시하여 객체 데이터를 배열 형식으로 가져옵니다. 즉,이 메서드는 키-값 쌍의 배열을 반환합니다. 사용하여 개별 배열 값을 얻을 수 있습니다. for 루프. 이것은 자바 스크립트에서 객체를 배열로 변환하는 가장 적합한 방법입니다.

const Book = {
  Name : "Revolution 2020",
  Author : "Chethan Bhagat"
};

const entries = Object.entries(Book);

console.log(entries);
for(i=0;i<entries.length;i++)
{
	console.log(entries[i]);
}
Output:
[ [ 'Name', 'Revolution 2020' ], [ 'Author', 'Chethan Bhagat' ] ]
[ 'Name', 'Revolution 2020' ]
[ 'Author', 'Chethan Bhagat' ]

지도 기능 사용

Objet.keys () 메서드를 map () 메서드와 함께 사용하여 키-값 데이터를 배열로 검색 할 수 있습니다. 아래 예에서는 Object.keys ()를 사용하여 키 데이터를 검색 한 다음이를 map ()에 전달하여 데이터를 키-값 쌍으로 가져옵니다. Book [key]는 값을 검색합니다.

const Book = {
  Name : "Revolution 2020",
  Author : "Chethan Bhagat"
};
var array = Object.keys(Book)
      .map(function(key) {
        return [key,Book[key]]
        });
console.log(array);
Output:
[ [ 'Name', 'Revolution 2020' ], [ 'Author', 'Chethan Bhagat' ] ]

Object.entries () 메서드는 동일한 출력을 제공하는 한 줄짜리이므로 더 효율적입니다.

참조