본문 바로가기

JavaScript/methods

[javascript] 객체와 배열 간의 변환 Object.fromEntries() / Object.entries()

 

export default function Page() {
  async function createInvoice(formData) {
    'use server'
 
    const rawFormData = {
      customerId: formData.get('customerId'),
      amount: formData.get('amount'),
      status: formData.get('status'),
    }
 
    // 데이터 변조
    // 캐시 재검증
  }
 
  return <form action={createInvoice}>...</form>
}

 

Next js 에서 필드가 많은 폼을 작업할 때는 

Object.fromEntries() 혹은 Object.entries() 메서드를 사용하면 좀 더 수월하게 작업할 수 있습니다.

 

Object.fromEntries()와 Object.entries()는 JavaScript에서 객체와 배열 간의 변환을 돕는 메서드입니다.

 


1. Object.entries()


Object.entries() 메서드는 객체의 열거 가능한 속성 [key, value] 쌍의 배열을 반환합니다. 

이 메서드는 객체를 배열로 변환할 때 유용합니다.

const obj = { a: 1, b: 2, c: 3 };
const entries = Object.entries(obj);
console.log(entries); // [['a', 1], ['b', 2], ['c', 3]]


2. Object.fromEntries()


Object.entries() 메서드는 객체의 열거 가능한 속성 [key, value] 쌍의 배열을 반환합니다. 

이 메서드는 객체를 배열로 변환할 때 유용합니다.

 

const entries = [['a', 1], ['b', 2], ['c', 3]];
const obj = Object.fromEntries(entries);
console.log(obj); // { a: 1, b: 2, c: 3 }

 

 

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Object/entries

 

Object.entries() - JavaScript | MDN

Object.entries() 메서드는 for...in와 같은 순서로 주어진 객체 자체의 enumerable 속성 [key, value] 쌍의 배열을 반환합니다. (for-in 루프가 다른점은 프로토 타입 체인의 속성도 열거한다는 점입니다).

developer.mozilla.org

 

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Object/fromEntries

 

Object.fromEntries() - JavaScript | MDN

Object.fromEntries() 메서드는 키값 쌍의 목록을 객체로 바꿉니다.

developer.mozilla.org