javascript - 선언 - 자바스크립트 속성값 가져오기




자바 스크립트 객체의 배열에서 id로 객체 찾기 (20)

네이티브 Array.reduce 사용하기

var array = [ {'id':'73' ,'foo':'bar'} , {'id':'45' ,'foo':'bar'} , ];
var id = 73;
var found = array.reduce(function(a, b){
    return (a.id==id && a) || (b.id == id && b)
});

발견되면 object 요소를 반환하고, 그렇지 않으면 false 반환합니다.

배열이 있습니다.

myArray = [{'id':'73','foo':'bar'},{'id':'45','foo':'bar'}, etc.]

배열의 구조를 변경할 수 없습니다. 나는 45 라는 ID를 전달 받고 있는데 배열의 해당 객체에 대해 'bar' 를 가져 오려고합니다.

JavaScript 또는 jQuery를 사용하여이 작업을 수행하려면 어떻게해야합니까?


"axesOptions"를 {{field_type => 2, : fields => [1,3,4]} 인 객체 형식의 배열로 간주합니다.

function getFieldOptions(axesOptions,choice){
  var fields=[]
  axesOptions.each(function(item){
    if(item.field_type == choice)
        fields= hashToArray(item.fields)
  });
  return fields;
}

jQuery의 필터 메소드 사용 :

 $(myArray).filter(function()
 {
     return this.id == desiredId;
 }).first();

그러면 지정된 ID를 가진 첫 번째 요소가 반환됩니다.

또한 멋진 C # LINQ 형식의 이점이 있습니다.


가장 쉬운 방법은 다음과 같을 것이라고 생각하지만 Internet Explorer 8 (또는 이전 버전)에서는 작동하지 않습니다.

var result = myArray.filter(function(v) {
    return v.id === '45'; // Filter out the appropriate one
})[0].foo; // Get result and access the foo property

다음을 시도해보십시오.

function findById(source, id) {
  for (var i = 0; i < source.length; i++) {
    if (source[i].id === id) {
      return source[i];
    }
  }
  throw "Couldn't find object with id: " + id;
}

또 다른 해결책은 조회 객체를 만드는 것입니다.

var lookup = {};
for (var i = 0, len = array.length; i < len; i++) {
    lookup[array[i].id] = array[i];
}

... now you can use lookup[id]...

많은 조회를해야하는 경우 특히 유용합니다.

ID와 객체가 공유되므로 더 많은 메모리가 필요하지 않습니다.


배열의 항목을 반복합니다. 방문하는 모든 항목에 대해 해당 항목의 ID를 확인하십시오. 일치하는 경우 반환하십시오.

만약 당신이 단지 코드를 원한다면 :

function getId(array, id) {
    for (var i = 0, len = array.length; i < len; i++) {
        if (array[i].id === id) {
            return array[i];
        }
    }
    return null; // Nothing found
}

그리고 ECMAScript 5의 Array 메소드를 사용하는 경우도 마찬가지입니다.

function getId(array, id) {
    var obj = array.filter(function (val) {
        return val.id === id;
    });

    // Filter returns an array, and we just want the matching item.
    return obj[0];
}

브라우저가 ECMA-262 , 5th edition (2009 년 12 월)을 지원하는 한 거의 한 줄짜리입니다.

var bFound = myArray.some(function (obj) {
    return obj.id === 45;
});

여기에 많은 정답이 있지만, 많은 사람들이 두 번 이상 수행되면 불필요하게 값 비싼 작업이라는 사실을 언급하지 않습니다. 극단적 인 경우 이것이 실제 성능 문제의 원인 일 수 있습니다.

실제 세계에서 많은 항목을 처리하고 성능이 문제가되는 경우 처음에는 조회를 작성하는 것이 훨씬 빠릅니다.

var items = [{'id':'73','foo':'bar'},{'id':'45','foo':'bar'}];

var lookup = items.reduce((o,i)=>o[i.id]=o,{});

다음과 같이 고정 된 시간에 항목을 가져올 수 있습니다.

var bar = o[id];

조회 대신 객체 대신 Map을 사용하는 것도 고려해 볼 수 있습니다. https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Map


용도:

var retObj ={};
$.each(ArrayOfObjects, function (index, obj) {

        if (obj.id === '5') { // id.toString() if it is int

            retObj = obj;
            return false;
        }
    });
return retObj;

그것은 id에 의해 객체를 반환해야합니다.


위의 findById 함수의 일반적이고보다 유연한 버전 :

// array = [{key:value},{key:value}]
function objectFindByKey(array, key, value) {
    for (var i = 0; i < array.length; i++) {
        if (array[i][key] === value) {
            return array[i];
        }
    }
    return null;
}

var array = [{'id':'73','foo':'bar'},{'id':'45','foo':'bar'}];
var result_obj = objectFindByKey(array, 'id', '45');

이 작업을 여러 번 수행하는 경우 Map (ES6)을 설정할 수 있습니다.

const map = new Map( myArray.map(el => [el.id, el]) );

그럼 간단하게 할 수 있습니다 :

map.get(27).foo

이미 jQuery를 사용하고 있으므로 배열 검색을위한 grep 함수를 사용할 수 있습니다.

var result = $.grep(myArray, function(e){ return e.id == id; });

결과는 항목이있는 배열입니다. 개체가 항상 있고 한 번만 발생한다는 것을 알면 result[0].foo 를 사용하여 값을 얻을 수 있습니다. 그렇지 않으면 결과 배열의 길이를 확인해야합니다. 예:

if (result.length == 0) {
  // not found
} else if (result.length == 1) {
  // access the foo property using result[0].foo
} else {
  // multiple items found
}

최단 시간,

var theAnswerObj = _.findWhere(array, {id : 42});

map() 함수를 사용하면 쉽게 얻을 수 있습니다.

myArray = [{'id':'73','foo':'bar'},{'id':'45','foo':'bar'}];

var found = $.map(myArray, function(val) {
    return val.id == 45 ? val.foo : null;
});

//found[0] == "bar";

실례 : http://jsfiddle.net/hunter/Pxaua/


http://sugarjs.com/ 에서 Sugarjs를 사용해 볼 수 있습니다.

그것은 배열, .find 에 아주 달콤한 방법이 있습니다. 그래서 당신은 다음과 같은 요소를 찾을 수 있습니다 :

array.find( {id: 75} );

또 다른 "where-clause"를 추가하기 위해 더 많은 속성을 가진 객체를 전달할 수 있습니다.

Sugarjs는 네이티브 객체를 확장하고 일부 사람들은 이것을 매우 악의적이라고 생각합니다.


Array.prototype.filter() 함수를 사용하십시오.

DEMO : https://jsfiddle.net/sumitridhal/r0cz0w5o/4/

JSON

var jsonObj =[
 {
  "name": "Me",
  "info": {
   "age": "15",
   "favColor": "Green",
   "pets": true
  }
 },
 {
  "name": "Alex",
  "info": {
   "age": "16",
   "favColor": "orange",
   "pets": false
  }
 },
{
  "name": "Kyle",
  "info": {
   "age": "15",
   "favColor": "Blue",
   "pets": false
  }
 }
];

필터

var getPerson = function(name){
    return jsonObj.filter(function(obj) {
      return obj.name === name;
    });
}

find() 메소드를 사용하십시오.

myArray.find(x => x.id === '45').foo;

MDN :

find() 메서드는 배열의 요소가 제공된 테스트 함수를 충족시키는 경우 배열의 값을 반환합니다. 그렇지 않으면 undefined 가 리턴됩니다.

대신 색인 을 찾으려면 findIndex() 사용 findIndex() .

myArray.findIndex(x => x.id === '45');

MDN :

findIndex() 메서드는 제공된 테스트 함수를 만족하는 배열의 첫 번째 요소의 인덱스를 반환합니다. 그렇지 않으면 -1이 리턴됩니다.

일치하는 요소의 배열을 가져 오려면 대신 filter() 메서드를 사용하십시오.

myArray.filter(x => x.id === '45');

이렇게하면 객체 배열이 반환됩니다. foo 속성의 배열을 얻으려면 map() 메서드를 사용하면 map() .

myArray.filter(x => x.id === '45').map(x => x.foo);

참고 사항 : find() 또는 filter()arrow 함수 와 같은 메서드는 IE와 같은 구형 브라우저에서 지원되지 않으므로 이러한 브라우저를 지원하려면 Babel ( polyfill )을 사용하여 코드를 이동해야합니다.


aggaton의 대답 에서부터 시작하여, 이것은 "올바른"요소에 대한 진리 값을 반환하는 callback 함수와 array 을 사용하여 실제로 원하는 요소 (찾지 못하면 null )를 반환하는 함수입니다.

function findElement(array, callback) {
    var elem;
    return array.some(function(e) {
        if (callback(e)) {
            elem = e;
            return true;
        }
    }) ? elem : null;
});

이것이 IE8에서 기본적으로 작동하지 않는다는 점을 기억하십시오. some 는 지원하지 않기 때문입니다. 폴리 필 (polyfill)을 제공 할 수 있습니다.

function findElement(array, callback) {
    for (var i = 0; i < array.length; i++)
        if (callback(array[i])) return array[i];
    return null;
});

사실 더 빠르고 컴팩트합니다. 그러나 바퀴를 재발 명하고 싶지 않다면, 밑줄이나 lodash와 같은 유틸리티 라이브러리를 사용하는 것이 좋습니다.


myArray.filter(function(a){ return a.id == some_id_you_want })[0]




javascript-objects