blocks|key|940412|text|错误是不能在grep中使用this，但必须使用对元素的引用。这是可行的：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|940413|function+findPurpose(purposeName){
++++return+$.grep(purposeObjects,+function(n,+i){
++++++return+n.purpose+==+purposeName;
++++});
};

findPurpose("daily");|code-block|syntax|javascript|940414|返回：|940415|[Object+{+purpose="daily"}]|940416|entityMap^0|D|4|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@$9|R|A|S|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|T|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|U|8|@]|D|@]|E|$]]|$1|M|3|N|5|H|7|V|8|@]|D|@]|E|$I|J]]|$1|O|3|-4|5|6|7|W|8|@]|D|@]|E|$]]]|P|$]]

The error was that you cannot use <code>this</code> in the grep, but you must use a reference to the element. This works:

<pre><code>function findPurpose(purposeName){
 return $.grep(purposeObjects, function(n, i){
 return n.purpose == purposeName;
 });
};

findPurpose("daily");
</code></pre>

returns: 

<pre><code>[Object { purpose="daily"}]
</code></pre>

blocks|key|940469|text|您应该在grep函数中传递对项目的引用：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|940470|function+findPurpose(purposeName){
++++return+$.grep(purposeObjects,+function(item){
++++++return+item.purpose+==+purposeName;
++++});
};|code-block|syntax|javascript|940471|Example|offset|length|940472|entityMap|0|LINK|mutability|MUTABLE|url|http://jsfiddle.net/v34DM/^0|0|0|0|7|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|T|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|U|8|@]|9|@$I|V|J|W|1|X]]|A|$]]|$1|K|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]]|L|$M|$5|N|O|P|A|$Q|R]]]]

you should pass reference on item in grep function:

<pre><code>function findPurpose(purposeName){
 return $.grep(purposeObjects, function(item){
 return item.purpose == purposeName;
 });
};
</code></pre>

<a href="http://jsfiddle.net/v34DM/" rel="noreferrer">Example</a>

blocks|key|724484|text|我个人使用了一个更通用的函数，它适用于任何数组的任何属性：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|724485|function+lookup(array,+prop,+value)+{
++++for+(var+i+=+0,+len+=+array.length;+i+<+len;+i%2B%2B)
++++++++if+(array[i]+&&+array[i][prop]+===+value)+return+array[i];
}|code-block|syntax|javascript|724486|你可以这样称呼它：|724487|lookup(purposeObjects,+"purpose",+"daily");|724488|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

I personally use a more generic function that works for any property of any array:

<pre><code>function lookup(array, prop, value) {
 for (var i = 0, len = array.length; i &lt; len; i++)
 if (array[i] &amp;&amp; array[i][prop] === value) return array[i];
}
</code></pre>

You just call it like this:

<pre><code>lookup(purposeObjects, "purpose", "daily");
</code></pre>

blocks|key|724514|text|最好、最快的方法是|type|unstyled|depth|inlineStyleRanges|entityRanges|data|724515|function+arrayLookup(array,+prop,+val)+{
++++for+(var+i+=+0,+len+=+array.length;+i+<+len;+i%2B%2B)+{
++++++++if+(array[i].hasOwnProperty(prop)+&&+array[i][prop]+===+val)+{
++++++++++++return+array[i];
++++++++}
++++}
++++return+null;
}|code-block|syntax|javascript|724516|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

Best, Fastest way is

<pre><code>function arrayLookup(array, prop, val) {
 for (var i = 0, len = array.length; i &lt; len; i++) {
 if (array[i].hasOwnProperty(prop) &amp;&amp; array[i][prop] === val) {
 return array[i];
 }
 }
 return null;
}
</code></pre>

blocks|key|724545|text|另一个解决方案：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|724546|function+firstOrNull(array,+expr)+{
++for+(var+i+=+0;+i+<+array.length;+i%2B%2B)+{
++++if+(expr(array[i]))
++++++return+array[i];
++++}
++return+null;
}|code-block|syntax|javascript|724547|使用：firstOrNull([{+a:+1,+b:+2+},+{+a:+3,+b:+3+}],+function(item)+{+return+item.a+===+3;+});|offset|length|style|CODE|724548|此函数不会对数组中的每个元素执行(它对于大型数组很有价值)|724549|entityMap^0|0|0|3|2F|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|R|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|S|8|@$I|T|J|U|K|L]]|9|@]|A|$]]|$1|M|3|N|5|6|7|V|8|@]|9|@]|A|$]]|$1|O|3|-4|5|6|7|W|8|@]|9|@]|A|$]]]|P|$]]

One more solution:

<pre><code>function firstOrNull(array, expr) {
 for (var i = 0; i &lt; array.length; i++) {
 if (expr(array[i]))
 return array[i];
 }
 return null;
}
</code></pre>

Using: <code>firstOrNull([{ a: 1, b: 2 }, { a: 3, b: 3 }], function(item) { return item.a === 3; });</code>

This function don't executes for each element from the array (it's valuable for large arrays)

blocks|key|940654|text|如果您的数组实际上是一组JQuery对象，那么简单地使用.filter()方法又如何呢？|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|940655|purposeObjects.filter('[purpose="daily"]')|code-block|syntax|javascript|940656|entityMap|0|LINK|mutability|MUTABLE|url|http://api.jquery.com/filter/^0|S|9|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@$A|R|B|S|1|T]]|C|$]]|$1|D|3|E|5|F|7|U|8|@]|9|@]|C|$G|H]]|$1|I|3|-4|5|6|7|V|8|@]|9|@]|C|$]]]|J|$K|$5|L|M|N|C|$O|P]]]]

If your array is actually a set of JQuery objects, what about simply using the <a href="http://api.jquery.com/filter/" rel="nofollow">.filter()</a> method ?

<pre><code>purposeObjects.filter('[purpose="daily"]')
</code></pre>

blocks|key|724645|text|我已经为我的angular应用程序创建了一个util服务。它有两个经常使用函数。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|724646|例如，你有一个对象。|724647|首先以递归方式从对象获取值，而不抛出未定义的错误。|724648|{prop：{+nestedProp1：{+nestedProp2+:+somevalue}；获取nestedProp2+2而不进行未定义的检查。|724649|基于第二个过滤器数组|724650|{prop：{+nestedProp1：{nestedProp2:+somevalue1}，{prop：{+nestedProp1：{nestedProp2:+somevalue2}；|724651|使用nestedProp2=somevalue2从数组中查找对象|724652|app.service('UtilService',+function(httpService)+{
this.mapStringKeyVal+=+function(map,+field)+{
++++var+lastIdentifiedVal+=+null;
++++var+parentVal+=+map;
++++field.split('.').forEach(function(val){
++++++++if(parentVal[val]){
++++++++++++lastIdentifiedVal+=+parentVal[val];+
++++++++++++parentVal+=+parentVal[val];+
++++++++}
++++});
++++return+lastIdentifiedVal;
}


this.arrayPropFilter+=+function(array,+field,value)+{
++++var+lastIdentifiedVal+=+null;
++++var+mapStringKeyVal+=+this.mapStringKeyVal;
++++array.forEach(function(arrayItem){
++++++++var+valueFound+=+mapStringKeyVal(arrayItem,field);
++++++++if(!lastIdentifiedVal++&&+valueFound+&&+valueFound==value){
++++++++++++lastIdentifiedVal+=+arrayItem;
++++++++}
++++});
++++return+lastIdentifiedVal;
}});|code-block|syntax|javascript|724653|获取当前问题的解决方案。注入UtilService并调用，|724654|UtilService.arrayPropFilter(purposeArray,'purpose','daily');|724655|或更高级|724656|UtilService.arrayPropFilter(purposeArray,'purpose.nestedProp1.nestedProp2','daily');|724657|entityMap^0|0|0|0|0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|12|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|13|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|14|8|@]|9|@]|A|$]]|$1|F|3|G|5|6|7|15|8|@]|9|@]|A|$]]|$1|H|3|I|5|6|7|16|8|@]|9|@]|A|$]]|$1|J|3|K|5|6|7|17|8|@]|9|@]|A|$]]|$1|L|3|M|5|6|7|18|8|@]|9|@]|A|$]]|$1|N|3|O|5|P|7|19|8|@]|9|@]|A|$Q|R]]|$1|S|3|T|5|6|7|1A|8|@]|9|@]|A|$]]|$1|U|3|V|5|P|7|1B|8|@]|9|@]|A|$Q|R]]|$1|W|3|X|5|6|7|1C|8|@]|9|@]|A|$]]|$1|Y|3|Z|5|P|7|1D|8|@]|9|@]|A|$Q|R]]|$1|10|3|-4|5|6|7|1E|8|@]|9|@]|A|$]]]|11|$]]

I have created a util service for my angular application. It have two function which use very often. 

For example you have object.

First getting value from object recursively without throwing undefined error.

{prop: { nestedProp1: {nestedProp2: somevalue}}}; 
get nestedProp2 2 without undefined checks.

Second filter array on basis 

[{prop: { nestedProp1: {nestedProp2: somevalue1}}}, {prop: { nestedProp1: {nestedProp2: somevalue2}}}]; 

Find object from array with nestedProp2=somevalue2

<pre><code>app.service('UtilService', function(httpService) {
this.mapStringKeyVal = function(map, field) {
 var lastIdentifiedVal = null;
 var parentVal = map;
 field.split('.').forEach(function(val){
 if(parentVal[val]){
 lastIdentifiedVal = parentVal[val]; 
 parentVal = parentVal[val]; 
 }
 });
 return lastIdentifiedVal;
}


this.arrayPropFilter = function(array, field,value) {
 var lastIdentifiedVal = null;
 var mapStringKeyVal = this.mapStringKeyVal;
 array.forEach(function(arrayItem){
 var valueFound = mapStringKeyVal(arrayItem,field);
 if(!lastIdentifiedVal &amp;&amp; valueFound &amp;&amp; valueFound==value){
 lastIdentifiedVal = arrayItem;
 }
 });
 return lastIdentifiedVal;
}});
</code></pre>

For solution for current question. inject UtilService and call,

<pre><code>UtilService.arrayPropFilter(purposeArray,'purpose','daily');
</code></pre>

Or more advanced

<pre><code>UtilService.arrayPropFilter(purposeArray,'purpose.nestedProp1.nestedProp2','daily');
</code></pre>

blocks|key|724691|text|Javascript有一个专门用于此的函数：Array.prototype.find。作为示例|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|724692|function+isBigEnough(element)+{
++return+element+>=+15;
}

[12,+5,+8,+130,+44].find(isBigEnough);+//+130|code-block|syntax|javascript|724693|将回调扩展到一个函数并不困难。但是，这与IE不兼容(部分与Edge不兼容)。有关完整列表，请查看Browser+Compatibility|724694|entityMap|0|LINK|mutability|MUTABLE|url|https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find|1|https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find#Browser_compatibility^0|M|K|0|0|0|1C|L|1|0^^$0|@$1|2|3|4|5|6|7|U|8|@]|9|@$A|V|B|W|1|X]]|C|$]]|$1|D|3|E|5|F|7|Y|8|@]|9|@]|C|$G|H]]|$1|I|3|J|5|6|7|Z|8|@]|9|@$A|10|B|11|1|12]]|C|$]]|$1|K|3|-4|5|6|7|13|8|@]|9|@]|C|$]]]|L|$M|$5|N|O|P|C|$Q|R]]|S|$5|N|O|P|C|$Q|T]]]]

Javascript has a function just for that: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find" rel="nofollow noreferrer">Array.prototype.find</a>. As example

<pre><code>function isBigEnough(element) {
 return element &gt;= 15;
}

[12, 5, 8, 130, 44].find(isBigEnough); // 130
</code></pre>

It not difficult to extends the callback to a function. However this is not compatible with IE (and partially with Edge). For a full list look at the <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find#Browser_compatibility" rel="nofollow noreferrer">Browser Compatibility</a>

blocks|key|940839|text|从Array.find的polyfill+Array.prototype.find代码复制，并添加数组作为第一个参数。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|940840|您可以将搜索项作为谓词函数进行传递|940841|​|940842|//+Example
var+listOfObjects+=+[{key:+"1",+value:+"one"},+{key:+"2",+value:+"two"}]
var+result+=+findInArray(listOfObjects,+function(element)+{
++return+element.key+==+"1";
});
console.log(result);

//+the+function+you+want
function+findInArray(listOfObjects,+predicate)+{
++++++if+(listOfObjects+==+null)+{
++++++++throw+new+TypeError('listOfObjects+is+null+or+not+defined');
++++++}

++++++var+o+=+Object(listOfObjects);

++++++var+len+=+o.length+>>>+0;

++++++if+(typeof+predicate+!==+'function')+{
++++++++throw+new+TypeError('predicate+must+be+a+function');
++++++}

++++++var+thisArg+=+arguments[1];

++++++var+k+=+0;

++++++while+(k+<+len)+{
++++++++var+kValue+=+o[k];
++++++++if+(predicate.call(thisArg,+kValue,+k,+o))+{
++++++++++return+kValue;
++++++++}
++++++++k%2B%2B;
++++++}

++++++return+undefined;
}|code-block|syntax|javascript|940843|940844|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|O|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|P|8|@]|9|@]|A|$]]|$1|F|3|G|5|H|7|Q|8|@]|9|@]|A|$I|J]]|$1|K|3|E|5|6|7|R|8|@]|9|@]|A|$]]|$1|L|3|-4|5|6|7|S|8|@]|9|@]|A|$]]]|M|$]]

copied from polyfill Array.prototype.find code of Array.find, and added the array as first parameter.

you can pass the search term as predicate function

<div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>// Example
var listOfObjects = [{key: "1", value: "one"}, {key: "2", value: "two"}]
var result = findInArray(listOfObjects, function(element) {
 return element.key == "1";
});
console.log(result);

// the function you want
function findInArray(listOfObjects, predicate) {
 if (listOfObjects == null) {
 throw new TypeError('listOfObjects is null or not defined');
 }

 var o = Object(listOfObjects);

 var len = o.length &gt;&gt;&gt; 0;

 if (typeof predicate !== 'function') {
 throw new TypeError('predicate must be a function');
 }

 var thisArg = arguments[1];

 var k = 0;

 while (k &lt; len) {
 var kValue = o[k];
 if (predicate.call(thisArg, kValue, k, o)) {
 return kValue;
 }
 k++;
 }

 return undefined;
}</code></pre>
</div>
</div>

Given I have an array of "purpose" objects:

<pre><code>//array of purpose objects:
var purposeObjects = [
 {purpose: "daily"},
 {purpose: "weekly"},
 {purpose: "monthly"}
];
</code></pre>

(for simplicity i am omitting other attributes)

Now I want to have a method that returns a specific one of the objects if a matching purpose name is found. 

This is not working:

<pre><code>function findPurpose(purposeName){
 return $.grep(purposeObjects, function(){
 return this.purpose == purposeName;
 });
};

findPurpose("daily");
</code></pre>

but it actually returns an empty array:

<pre><code>[]
</code></pre>

I am using JQuery 1.5.2. I have also tried with $.each() but with no luck. 
Apparently, most JQuery methods are designed for usage with DOM elements (such as <code>filter()</code>. 

Any ideas on how to achieve this?

Jquery how to find an Object by attribute in an Array

假设我有一个"purpose“对象数组：//array of purpose objects:var purposeObjects = [    {purpose: "daily"},    {purpose: "weekly"},    {purpose: "monthly"}];(为了简单起见，我省略了其他属性)现...

问Jquery如何在数组中按属性查找对象
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Jquery如何在数组中按属性查找对象EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Jquery如何在数组中按属性查找对象
EN