按属性值从对象数组中获取 JavaScript 对象

IT技术 javascript arrays
2021-01-28 03:07:11

假设我有一个包含四个对象的数组:

var jsObjects = [
   {a: 1, b: 2}, 
   {a: 3, b: 4}, 
   {a: 5, b: 6}, 
   {a: 7, b: 8}
];

有没有办法可以{a: 5, b: 6}通过属性的值获取第三个对象(b,例如没有for...in循环?

6个回答

Filter 属性与值匹配的对象数组,返回数组:

var result = jsObjects.filter(obj => {
  return obj.b === 6
})

请参阅有关 Array.prototype.filter()MDN 文档

Find数组中第一个元素/对象的值,否则undefined返回。

var result = jsObjects.find(obj => {
  return obj.b === 6
})

请参阅Array.prototype.find() 上MDN 文档

这将返回一个数组
2021-03-12 03:07:11
@尼克夫。我认为应该,如果有更多具有相同属性的对象怎么办?否则:result[0]在这种情况下将是第一个(唯一的)对象。
2021-03-18 03:07:11
让它返回第一个很容易。在末尾添加“[0]”。#javaScriptIsAwesome!var 结果 = jsObjects.filter(function(obj) { return obj.b == 6; })[0];
2021-03-22 03:07:11
问题是“获取 JavaScript对象”,而不是“对象数组”。
2021-04-01 03:07:11
@Gothdo 是对的。要获取对象,我们可以使用 Array.find: var result = jsObjects.find(function( obj ) { return obj.b === 6; });
2021-04-01 03:07:11
jsObjects.find(x => x.b === 6)

来自 MDN:

find()如果数组中的元素满足提供的测试函数,则方法返回数组中的值。否则undefined返回。


旁注:find()较旧的浏览器(如 IE)不支持和箭头函数这样的方法,所以如果你想支持这些浏览器,你应该使用Babel转译你的代码

@29er 是的,我写道“find()并非所有浏览器都支持箭头函数这样的方法”。
2021-03-12 03:07:11
这并不完全等同于@elclanrs 使用的答案filter():它只返回第一个匹配项。
2021-03-16 03:07:11
@thdoan OP 要求“对象”,而不是“一组匹配对象”。elclanrs的答案是错误的。
2021-03-17 03:07:11
如果要修改原始数组中的对象,这是最好的选择。filter()返回对象的副本,而不是原始对象,因此更改不会反映在原始数组中
2021-03-22 03:07:11
请注意,这在 IE 中不受支持
2021-03-27 03:07:11

我不知道您为什么反对 for 循环(大概您的意思是 a for loop,而不是专门的for..in),它们快速且易于阅读。无论如何,这里有一些选择。

For循环:

function getByValue(arr, value) {

  for (var i=0, iLen=arr.length; i<iLen; i++) {

    if (arr[i].b == value) return arr[i];
  }
}

。筛选

function getByValue2(arr, value) {

  var result  = arr.filter(function(o){return o.b == value;} );

  return result? result[0] : null; // or undefined

}

.forEach

function getByValue3(arr, value) {

  var result = [];

  arr.forEach(function(o){if (o.b == value) result.push(o);} );

  return result? result[0] : null; // or undefined

}

另一方面,如果您确实是指 for..in 并且想要查找具有值为 6 的任何属性的对象,那么您必须使用 for..in 除非您通过名称进行检查。

例子

function getByValue4(arr, value) {
  var o;

  for (var i=0, iLen=arr.length; i<iLen; i++) {
    o = arr[i];

    for (var p in o) {
      if (o.hasOwnProperty(p) && o[p] == value) {
        return o;
      }
    }
  }
}
@RobG任何具体原因存储arr.lengthiLen,而不是直接用arr.length在为条件的i<arr.length
2021-03-15 03:07:11
@VikasPrasad——只是一个小小的性能增强,现在可能没有帮助,但在早期它确实有帮助。
2021-03-21 03:07:11
与 es6 及更高版本使用: for(let value of arr)
2021-03-31 03:07:11
哪一个是最快的?
2021-04-05 03:07:11
Foor 循环是迄今为止最快的方法(jsperf.com/extract-props/1)。
2021-04-06 03:07:11

尝试滤镜阵列用于过滤的方法array of objectsproperty

var jsObjects = [
   {a: 1, b: 2}, 
   {a: 3, b: 4}, 
   {a: 5, b: 6}, 
   {a: 7, b: 8}
];

使用数组过滤方法:

var filterObj = jsObjects.filter(function(e) {
  return e.b == 6;
});

使用 for 循环:

for (var i in jsObjects) {
  if (jsObjects[i].b == 6) {
    console.log(jsObjects[i]); // {a: 5, b: 6}
  }
}

工作小提琴: https : //jsfiddle.net/uq9n9g77/

好的,有几种方法可以做到这一点,但让我们从最简单和最新的方法开始,这个函数被称为find()

使用时要小心find,因为即使 IE11 也不支持它,因此需要对其进行编译...

所以你有这个对象,正如你所说:

var jsObjects = [
   {a: 1, b: 2}, 
   {a: 3, b: 4}, 
   {a: 5, b: 6}, 
   {a: 7, b: 8}
];

你可以编写一个函数并像这样得到它:

function filterValue(obj, key, value) {
  return obj.find(function(v){ return v[key] === value});
}

并使用这样的功能:

filterValue(jsObjects, "b", 6); //{a: 5, b: 6}

同样在ES6中甚至缩短版本:

const filterValue = (obj, key, value)=> obj.find(v => v[key] === value);

此方法只返回匹配的第一个值...,为了更好的结果和浏览器支持,您可以使用filter

const filterValue = (obj, key, value)=> obj.filter(v => v[key] === value);

我们会回来[{a: 5, b: 6}]...

此方法将返回一个数组而不是...

您也可以简单地使用 for 循环,创建一个这样的函数:

function filteredArray(arr, key, value) {
  const newArray = [];
  for(i=0, l=arr.length; i<l; i++) {
    if(arr[i][key] === value) {
      newArray.push(arr[i]);
    }
  }
 return newArray;
}

并这样称呼它:

filteredArray(jsObjects, "b", 6); //[{a: 5, b: 6}]
谢谢@Alireza。非常完整的答案。至于 .filter 部分: < 此方法将返回一个数组......不是最优雅的解决方案,但考虑在最后添加 [0] 以快速修复。const filterValue = (obj, key, value)=> obj.filter(v => v[key] === value)[0];
2021-03-26 03:07:11