JavaScript의 배열에서 객체 검색

Sahil Bhosale 2023년10월12일

JavaScript JavaScript Object JavaScript Array

JavaScript에서 forEach()를 사용하여 배열에서 객체 검색
JavaScript의 find() 메서드를 사용하여 배열에서 객체 검색

JavaScript에서 배열 데이터 구조 내부에 데이터를 사용하고 저장하는 것은 매우 일반적입니다. 배열 데이터 구조는 숫자, 문자열, 요소로서의 다른 배열 또는 객체와 같은 다양한 방식을 취할 수 있습니다. 이 기사에서는 배열의 개체와 모든 개별 개체 내부에 있는 다양한 값을 검색하는 방법에 대해 설명합니다.

여기에 arrayofObjects라는 이름의 객체 배열이 있습니다. 각 객체 내부에는 키-값 쌍으로 표현되는 다양한 값이 있습니다. 3개의 키-값 쌍이 있습니다. 키는 name, profession 및 company입니다. 이 키를 사용하여 모든 개별 개체의 해당 값에 액세스할 수 있습니다.

var arrayofObjects = [
  {name: 'Adam', profession: 'Engineer', company: 'Google'},
  {name: 'Sam', profession: 'Manager', company: 'Amazon'},
  {name: 'Gerogia', profession: 'Designer', company: 'Netflix'},
  {name: 'Kate', profession: 'Engineer', company: 'Microscoft'},
  {name: 'James', profession: 'Sales', company: 'Amazon'},
];

배열은 대괄호 []로 표시되는 반면 객체는 중괄호 {}로 표시됩니다.

배열에서 개체를 찾을 수 있는 몇 가지 방법이 있습니다. 몇 가지 방법이 아래에 나와 있습니다.

JavaScript에서 `forEach()`를 사용하여 배열에서 객체 검색

배열에서 객체를 찾는 전통적인 방법은 forEach() 루프를 사용하는 것입니다. 이를 통해 for 루프 내부에 있는 각 요소를 반복할 수 있습니다.

먼저 배열에서 forEach()를 사용하여 전체 객체에 액세스하겠습니다. 나중에 객체 내부에 있는 개별 값에 액세스하는 방법을 볼 것입니다. 위의 배열에서 전체 객체를 인쇄하려면 forEach() 루프를 사용할 수 있습니다. 이 루프는 배열의 요소 자체와 요소의 인덱스라는 두 가지를 제공합니다. 이를 위해 forEach()에 두 개의 매개변수를 전달해야 합니다. 이 경우 인덱스가 아닌 요소만 필요하므로 object라는 매개변수를 전달합니다. 이 매개변수에 이름을 지정할 수 있습니다.

// print name of the people who work at amazon
arrayofObjects.forEach(object => {
  console.log(object);
});

forEach() 루프는 모든 요소를 반복하므로 해당 요소는 이 object 변수 안에 저장됩니다. 이제 object 변수에는 배열의 전체 개체가 포함됩니다. 콘솔을 사용하여 이 object 변수를 인쇄하면 배열에 있는 모든 개체가 인쇄됩니다.

출력:

Object { name: "Adam", profession: "Engineer", company: "Google" }
Object { name: "Sam", profession: "Manager", company: "Amazon" }
Object { name: "Gerogia", profession: "Designer", company: "Netflix" }
Object { name: "Kate", profession: "Engineer", company: "Microsoft" }
Object { name: "James", profession: "Sales", company: "Amazon" }

배열에서 모든 객체를 얻었습니다. 이 개체의 내부 값에 액세스해 보겠습니다. 이제 Amazon 회사에서 일하는 직원의 이름을 출력해 보겠습니다. 객체의 키에 액세스하려면 object 변수 뒤에 점을 사용하고 키를 지정할 수 있습니다. 예를 들어 회사 키에 액세스하려면 object.company를 사용합니다.

// print name of the people who work at amazon
arrayofObjects.forEach(object => {
  if (object.company === 'Amazon') {
    console.log('Amazon Employee:', object.name);
  }
});

if 문을 사용하여 키 값을 Amazon 문자열과 비교하고 일치하는 경우 if 문 내부에 입력합니다. 그런 다음 위와 같이 object.name을 사용하여 amazon에서 근무하는 직원의 이름을 인쇄합니다. 이것은 우리에게 아래의 출력을 줄 것입니다.

출력:

Amazon Employee: Sam
Amazon Employee: James

Amazon에서는 두 사람만 일하기 때문에 Sam과 James를 출력으로 얻습니다.

마찬가지로 아래의 name, profession 및 company 키를 사용하여 모든 개체의 모든 값을 인쇄할 수 있습니다.

// print every details of a person
arrayofObjects.forEach(object => {
  console.log(
      object.name + ' is ' + object.profession + ' who works at ' +
      object.company);
});

출력:

Adam is Engineer who works at Google
Sam is Manager who works at Amazon
Georgia is a Designer who works at Netflix
Kate is Engineer who works at Microsoft
James is Sales who works at Amazon

JavaScript의 `find()` 메서드를 사용하여 배열에서 객체 검색

find() 메서드는 JavaScript의 배열에서 객체와 해당 요소를 찾는 대체 방법입니다. find()는 ES6 메서드입니다. 이 메소드는 forEach() 루프와 유사하게 작동하며 객체 내부의 요소에 액세스하는 것은 이전에 본 것과 유사합니다.

코드에서 forEach를 find로 바꾸면 바로 사용할 수 있습니다. 아래 코드는 배열의 모든 객체도 인쇄합니다.

arrayofObjects.find(object => {
  console.log(object);
});

출력:

Object { name: "Adam", profession: "Engineer", company: "Google" }
Object { name: "Sam", profession: "Manager", company: "Amazon" }
Object { name: "Gerogia", profession: "Designer", company: "Netflix" }
Object { name: "Kate", profession: "Engineer", company: "Microsoft" }
Object { name: "James", profession: "Sales", company: "Amazon" }

마찬가지로 다음과 같이 해당 키를 사용하여 배열의 개체에서 모든 값에 액세스할 수도 있습니다.

arrayofObjects.find(object => {
  console.log(
      object.name + ' is ' + object.profession + ' who works at ' +
      object.company);
});

출력:

Adam is Engineer who works at Google
Sam is Manager who works at Amazon
Georgia is Designer who works at Netflix
Kate is Engineer who works at Microsoft
James is Sales who works at Amazon

작가: Sahil Bhosale

Sahil is a full-stack developer who loves to build software. He likes to share his knowledge by writing technical articles and helping clients by working with them as freelance software engineer and technical writer on Upwork.

JavaScript의 배열에서 객체 검색

JavaScript에서 `forEach()`를 사용하여 배열에서 객체 검색

JavaScript의 `find()` 메서드를 사용하여 배열에서 객체 검색

관련 문장 - JavaScript Object

관련 문장 - JavaScript Array

JavaScript에서 forEach()를 사용하여 배열에서 객체 검색

JavaScript의 find() 메서드를 사용하여 배열에서 객체 검색

관련 문장 - JavaScript Object

관련 문장 - JavaScript Array

JavaScript에서 `forEach()`를 사용하여 배열에서 객체 검색

JavaScript의 `find()` 메서드를 사용하여 배열에서 객체 검색