자바스크립트에서 객체 배열에서 값을 찾는 방법은?
다음 개체의 배열:
Object = {
1 : { name : bob , dinner : pizza },
2 : { name : john , dinner : sushi },
3 : { name : larry, dinner : hummus }
}
키가 "저녁"인 개체/배열을 검색하여 "스시"와 일치하는지 확인하고 싶습니다.
jQuery가 $.inArray를 가지고 있다는 것은 알고 있지만 객체 배열에서는 작동하지 않는 것 같습니다.아니면 내가 틀렸을 수도 있습니다.indexOf 또한 하나의 배열 수준에서만 작동하는 것으로 보입니다.
이것에 대한 기능이나 기존 코드가 없습니까?
다음과 같은 배열이 있는 경우
var people = [
{ "name": "bob", "dinner": "pizza" },
{ "name": "john", "dinner": "sushi" },
{ "name": "larry", "dinner": "hummus" }
];
Array 개체의 메서드를 사용할 수 있습니다.
people.filter(function (person) { return person.dinner == "sushi" });
// => [{ "name": "john", "dinner": "sushi" }]
최신 자바스크립트 구현에서는 다음과 같은 함수식을 사용할 수 있습니다.
people.filter(p => p.dinner == "sushi")
// => [{ "name": "john", "dinner": "sushi" }]
당신은 다음과 같은 사람들을 검색할 수 있습니다."dinner": "sushi"
a를 이용하여
people.map(function (person) {
if (person.dinner == "sushi") {
return person
} else {
return null
}
}); // => [null, { "name": "john", "dinner": "sushi" }, null]
아니면.
people.reduce(function (sushiPeople, person) {
if (person.dinner == "sushi") {
return sushiPeople.concat(person);
} else {
return sushiPeople
}
}, []); // => [{ "name": "john", "dinner": "sushi" }]
이것을 임의의 키와 값으로 일반화할 수 있다고 확신합니다!
jQuery에는 ES5와 유사하게 작동하는 내장형 방식이 있습니다.filter
@adamse's Answer에서 작동하며 이전 브라우저에서는 잘 작동합니다.
Adamse의 예를 사용하면 다음과 같습니다.
var peoples = [
{ "name": "bob", "dinner": "pizza" },
{ "name": "john", "dinner": "sushi" },
{ "name": "larry", "dinner": "hummus" }
];
당신은 다음을 할 수 있습니다.
jQuery.grep(peoples, function (person) { return person.dinner == "sushi" });
// => [{ "name": "john", "dinner": "sushi" }]
var getKeyByDinner = function(obj, dinner) {
var returnKey = -1;
$.each(obj, function(key, info) {
if (info.dinner == dinner) {
returnKey = key;
return false;
};
});
return returnKey;
}
하기만 하면 됩니다.-1
절대 유효한 열쇠가 아닙니다
이 검색을 자주 할 경우 저녁 식사가 중요하도록 개체의 형식을 변경하는 것을 고려해 보십시오.이는 데이터베이스 테이블에 기본 클러스터 키를 할당하는 것과 같습니다.예를 들어 다음과 같습니다.
Obj = { 'pizza' : { 'name' : 'bob' }, 'sushi' : { 'name' : 'john' } }
이제 다음과 같이 쉽게 액세스할 수 있습니다.Object['sushi']['name']
또는 개체가 정말로 이렇게 간단한 경우(개체에 '이름'만 있는 경우), 다음과 같이 변경할 수 있습니다.
Obj = { 'pizza' : 'bob', 'sushi' : 'john' }
다음과 같이 액세스할 수 있습니다.Object['sushi']
.
데이터 개체를 이와 같이 재구성하는 것이 항상 가능하거나 자신에게 유리한 것은 아니지만, 때로는 데이터 개체가 최상의 방식으로 구성되어 있는지를 고려하는 것이 가장 좋은 답이 될 수 있습니다.이와 같은 키를 만드는 것은 더 빠르고 깨끗한 코드를 만들 수 있습니다.
Alasql 라이브러리를 사용하여 배열된 개체를 찾을 수 있습니다.
var data = [ { name : "bob" , dinner : "pizza" }, { name : "john" , dinner : "sushi" },
{ name : "larry", dinner : "hummus" } ];
var res = alasql('SELECT * FROM ? WHERE dinner="sushi"',[data]);
jsFiddle에서 이 예를 사용해 보십시오.
simple for in loop을 사용할 수 있습니다.
for (prop in Obj){
if (Obj[prop]['dinner'] === 'sushi'){
// Do stuff with found object. E.g. put it into an array:
arrFoo.push(Obj[prop]);
}
}
다음 fiddle 예제는 다음을 포함하는 모든 개체를 넣습니다.dinner:sushi
배열:
https://jsfiddle.net/3asvkLn6/1/
여기에는 이미 좋은 답이 많이 나와 있으니 한 개라도 더 lodash나 언더스코어 같은 라이브러리를 이용해보세요. :)
obj = {
1 : { name : 'bob' , dinner : 'pizza' },
2 : { name : 'john' , dinner : 'sushi' },
3 : { name : 'larry', dinner : 'hummus' }
}
_.where(obj, {dinner: 'pizza'})
>> [{"name":"bob","dinner":"pizza"}]
주어진 경로와 일치하는 첫 번째 리프 항목에 대해 중첩된 사이트 맵 구조를 검색해야 했습니다.저는 그냥 사용해서 다음 코드를 생각해 냈습니다..map()
.filter()
그리고..reduce
합니다. 합니다./c
.
var sitemap = {
nodes: [
{
items: [{ path: "/a" }, { path: "/b" }]
},
{
items: [{ path: "/c" }, { path: "/d" }]
},
{
items: [{ path: "/c" }, { path: "/d" }]
}
]
};
const item = sitemap.nodes
.map(n => n.items.filter(i => i.path === "/c"))
.reduce((last, now) => last.concat(now))
.reduce((last, now) => now);
검색 기능을 통해 특정 개체를 찾으려면 다음과 같이 시도해 보십시오.
function findArray(value){
let countLayer = dataLayer.length;
for(var x = 0 ; x < countLayer ; x++){
if(dataLayer[x].user){
let newArr = dataLayer[x].user;
let data = newArr[value];
return data;
}
}
return null;
}
findArray("id");
이는 예시적인 개체입니다.
layerObj = {
0: { gtm.start :1232542, event: "gtm.js"},
1: { event: "gtm.dom", gtm.uniqueEventId: 52},
2: { visitor id: "abcdef2345"},
3: { user: { id: "29857239", verified: "Null", user_profile: "Personal", billing_subscription: "True", partners_user: "adobe"}
}
코드는 "사용자" 배열을 반복하여 찾고 내부에서 찾는 개체를 검색합니다.
문제는 배열 인덱스가 윈도우 새로 고침마다 변경되고 3번째 배열 또는 2번째 배열로 변경되는 경우였지만 상관이 없습니다.
저한테 매력적으로 작용했습니다.
예제에서는 다음과 같이 좀 더 짧습니다.
function findArray(value){
let countLayer = Object.length;
for(var x = 0 ; x < countLayer ; x++){
if(Object[x].dinner === value){
return Object[x];
}
}
return null;
}
findArray('sushi');
우리는 대부분의 데이터 처리에 object-scan을 사용합니다.개념적으로 매우 간단하지만, 많은 멋진 것들을 허용합니다.질문을 해결하는 방법은 다음과 같습니다.
// const objectScan = require('object-scan');
const findDinner = (dinner, data) => objectScan(['*'], {
abort: true,
rtn: 'value',
filterFn: ({ value }) => value.dinner === dinner
})(data);
const data = { 1: { name: 'bob', dinner: 'pizza' }, 2: { name: 'john', dinner: 'sushi' }, 3: { name: 'larry', dinner: 'hummus' } };
console.log(findDinner('sushi', data));
// => { name: 'john', dinner: 'sushi' }
.as-console-wrapper {max-height: 100% !important; top: 0}
<script src="https://bundle.run/object-scan@13.8.0"></script>
면책 사항:저는 object-scan의 저자입니다.
언급URL : https://stackoverflow.com/questions/5181493/how-to-find-a-value-in-an-array-of-objects-in-javascript
'programing' 카테고리의 다른 글
열에서 공통 값을 기준으로 큰 데이터 프레임을 데이터 프레임 목록으로 나눕니다. (0) | 2023.10.01 |
---|---|
jQuery에서 여러 ID 처리 (0) | 2023.10.01 |
Sping-Boot 구성:맵 채우기에 사용되는 yaml 키의 공백을 유지하는 방법 (0) | 2023.09.26 |
jQuery에서 프로그래밍과 사용자 클릭을 구분하려면 어떻게 해야 합니까? (0) | 2023.09.26 |
printf에서 선행 0을 숨기는 방법 (0) | 2023.09.26 |