精华内容
下载资源
问答
  • 对象数组中提取属性值作为数组

    千次阅读 2020-04-07 17:04:35
    I have JavaScript object array with the following structure: 我有以下结构的JavaScript对象数组: objArray = [ {

    本文翻译自:From an array of objects, extract value of a property as array

    I have JavaScript object array with the following structure: 我有以下结构的JavaScript对象数组:

    objArray = [ { foo: 1, bar: 2}, { foo: 3, bar: 4}, { foo: 5, bar: 6} ];
    

    I want to extract a field from each object, and get an array containing the values, for example field foo would give array [ 1, 3, 5 ] . 我想从每个对象中提取一个字段,并获取一个包含值的数组,例如foo字段将给出array [ 1, 3, 5 ]

    I can do this with this trivial approach: 我可以用这种简单的方法做到这一点:

    function getFields(input, field) {
        var output = [];
        for (var i=0; i < input.length ; ++i)
            output.push(input[i][field]);
        return output;
    }
    
    var result = getFields(objArray, "foo"); // returns [ 1, 3, 5 ]
    

    Is there a more elegant or idiomatic way to do this, so that a custom utility function would be unnecessary? 是否有更优雅或惯用的方式来执行此操作,从而不需要自定义实用程序功能?


    Note about suggested duplicate , it covers how to convert a single object to an array. 关于建议的重复项的注释,它涵盖了如何将单个对象转换为数组。


    #1楼

    参考:https://stackoom.com/question/1KCTh/从对象数组中提取属性值作为数组


    #2楼

    Yes, but it relies on an ES5 feature of JavaScript. 是的,但是它依靠JavaScript的ES5功能。 This means it will not work in IE8 or older. 这意味着它将无法在IE8或更低版本中使用。

    var result = objArray.map(function(a) {return a.foo;});
    

    On ES6 compatible JS interpreters you can use an arrow function for brevity: 在与ES6兼容的JS解释器上,为了简洁起见,您可以使用箭头功能

    var result = objArray.map(a => a.foo);
    

    Array.prototype.map documentation Array.prototype.map文档


    #3楼

    Using Array.prototype.map : 使用Array.prototype.map

    function getFields(input, field) {
        return input.map(function(o) {
            return o[field];
        });
    }
    

    See the above link for a shim for pre-ES5 browsers. 有关ES5之前版本浏览器的填充程序,请参见上面的链接。


    #4楼

    It depends of your definition of "better". 这取决于您对“更好”的定义。

    The other answers point out the use of map, which is natural (especially for guys used to functional style) and concise. 其他答案指出地图的使用是自然的(特别是对于习惯使用功能样式的人)并且简洁。 I strongly recommend using it (if you don't bother with the few IE8- IT guys). 我强烈建议使用它(如果您不打扰那些IE8-IT专家的话)。 So if "better" means "more concise", "maintainable", "understandable" then yes, it's way better. 因此,如果“更好”的意思是“更简洁”,“可维护”,“可理解”,那么它会更好。

    In the other hand, this beauty don't come without additional costs. 另一方面,这种美丽并非没有额外费用。 I'm not a big fan of microbench, but I've put up a small test here . 我不是microbench的忠实拥护者,但是我在这里做了一个小测试 The result are predictable, the old ugly way seems to be faster than the map function. 结果是可以预测的,旧的丑陋方法似乎比map函数要快。 So if "better" means "faster", then no, stay with the old school fashion. 因此,如果“更好”的意思是“更快”,那么不,保留传统的流行。

    Again this is just a microbench and in no way advocating against the use of map , it's just my two cents :). 同样,这只是一个微平台,绝不主张使用map ,这只是我的两分钱:)。


    #5楼

    Check out Lodash's _.pluck() function or Underscore's _.pluck() function. 查看Lodash的_.pluck()函数或_.pluck()_.pluck()函数。 Both do exactly what you want in a single function call! 两者都完全可以在单个函数调用中完成您想要的!

    var result = _.pluck(objArray, 'foo');
    

    Update: _.pluck() has been removed as of Lodash v4.0.0 , in favour of _.map() in combination with something similar to Niet's answer . 更新: _.pluck()从Lodash v4.0.0起已被删除 ,转而使用_.map()并结合了类似于Niet的答案 _.pluck() is still available in Underscore . _.pluck()_.pluck()中仍然可用

    Update 2: As Mark points out in the comments , somewhere between Lodash v4 and 4.3, a new function has been added that provides this functionality again. 更新2:正如Mark 在注释中指出的那样,在Lodash v4和4.3之间的某个地方,添加了一个新功能,再次提供了此功能。 _.property() is a shorthand function that returns a function for getting the value of a property in an object. _.property()是一种简写函数,它返回用于获取对象中属性值的函数。

    Additionally, _.map() now allows a string to be passed in as the second parameter, which is passed into _.property() . 此外, _.map()现在允许将字符串作为第二个参数传递进来,该字符串被传递到_.property() As a result, the following two lines are equivalent to the code sample above from pre-Lodash 4. 结果,以下两行等效于Lodash 4之前的上述代码示例。

    var result = _.map(objArray, 'foo');
    var result = _.map(objArray, _.property('foo'));
    

    _.property() , and hence _.map() , also allow you to provide a dot-separated string or array in order to access sub-properties: _.property()以及_.map() ,还允许您提供一个以点分隔的字符串或数组,以便访问子属性:

    var objArray = [
        {
            someProperty: { aNumber: 5 }
        },
        {
            someProperty: { aNumber: 2 }
        },
        {
            someProperty: { aNumber: 9 }
        }
    ];
    var result = _.map(objArray, _.property('someProperty.aNumber'));
    var result = _.map(objArray, _.property(['someProperty', 'aNumber']));
    

    Both _.map() calls in the above example will return [5, 2, 9] . 上例中的两个_.map()调用都将返回[5, 2, 9] _.map() [5, 2, 9]

    If you're a little more into functional programming, take a look at Ramda's R.pluck() function, which would look something like this: 如果您更喜欢函数式编程,请看一下R.pluck() R.pluck()函数,它看起来像这样:

    var result = R.pluck('foo')(objArray);  // or just R.pluck('foo', objArray)
    

    #6楼

    Function map is a good choice when dealing with object arrays. 处理对象数组时,函数映射是一个不错的选择。 Although there have been a number of good answers posted already, the example of using map with combination with filter might be helpful. 尽管已经发布了许多好的答案,但结合使用带有过滤器的地图的示例可能会有所帮助。

    In case you want to exclude the properties which values are undefined or exclude just a specific property, you could do the following: 如果要排除未定义值的属性或仅排除特定属性,可以执行以下操作:

        var obj = {value1: "val1", value2: "val2", Ndb_No: "testing", myVal: undefined};
        var keysFiltered = Object.keys(obj).filter(function(item){return !(item == "Ndb_No" || obj[item] == undefined)});
        var valuesFiltered = keysFiltered.map(function(item) {return obj[item]});
    

    https://jsfiddle.net/ohea7mgk/ https://jsfiddle.net/ohea7mgk/

    展开全文
  • 需求:将下面数组-对象中的index_name相同的对象抽离出来,放入一个新数组中 let tempArr = [ { domain: 'a', index_name: '云淡风轻' }, { domain: 'b', index_name: '递归' }, { domain: 'c', index_name: '...

    需求:将下面对象数组中的index_name相同的对象抽离出来,放入一个新数组中

    let tempArr = [
      { domain: 'a', index_name: '云淡风轻' },
      { domain: 'b', index_name: '递归' },
      { domain: 'c', index_name: '云淡风轻' },
      { domain: 'd', index_name: '遍历' },
      { domain: 'e', index_name: '云淡风轻' },
      { domain: 'f', index_name: '云淡风轻' },
      { domain: 'g', index_name: '递归' }
    ]

    解决办法1:

    const formateArrData1 = (initialArr, name, newArr) => {
      // newArr是承接分类的新数组,整个initialArr处理完成之后,会根据不同的name生成一个二维数组
      // 判定传参是否符合规则
      if (!(initialArr instanceof Array) || !(newArr instanceof Array)) {
        return '请传入正确格式的数组'
      }
      if (!name) {
        return '请传入对象属性'
      }
      // 每一个类型的单独数组,注意此处不能return出每个alikeArr,
      // 因为递归的返回值只返回最后一次的值
      let alikeArr = []
      let propertyName = ''
      if (initialArr.length > 0) {
        propertyName = initialArr[0][`${name}`]
        let tempArr = []
        // 将拥有共同propertyName属性的对象放到此次遍历的alikeArr中,
        // 将其他的对象放入到tempArr中,等待下次遍历
        initialArr.forEach((val, key) => {
          if (val[`${name}`] === propertyName) {
            alikeArr.push(val)
          } else {
            tempArr.push(val)
          }
        })
        newArr.push(alikeArr)
        initialArr = tempArr
        return formateArrData1(initialArr, name, newArr)
      } else {
        return newArr
      }
    }

    实现效果:

     

    展开全文
  • 后端返回的是一个没有分组的对象数组,前端需要实现根据对象数组对象的某个属性进行分类显示。 举例: 后端返回的数据结构如: [{ CreateTime: "2020-06-22 16:36:11" OrgType: "财务" OrgTypeCode: "5" ...

    场景:

    已选组织类型数据(这里包含多个不同的组织类型),前端需要展示不同组织类型下,已选的组织数据。

    分析:

    后端返回的是一个没有分组的对象数组,前端需要实现根据对象数组中对象的某个属性进行分类显示。

    举例: 

    后端返回的数据结构如:

    [{
        CreateTime: "2020-06-22 16:36:11"
        OrgType: "财务"
        OrgTypeCode: "5"
        Count: "1000"
        UpdateTime: "2020-06-22 16:36:11"
    },
    {
        CreateTime: "2020-06-22 16:36:11"
        OrgType: "人事"
        OrgTypeCode: "4"
        Count: "5"
        UpdateTime: "2020-06-22 16:36:11"
    },
    {
        CreateTime: "2020-06-22 16:36:11"
        OrgType: "技术"
        OrgTypeCode: "3"
        Count: "99"
        UpdateTime: "2020-06-22 16:36:11"
    },
    {
        CreateTime: "2020-06-22 16:36:11"
        OrgType: "人事"
        OrgTypeCode: "4"
        Count: "10"
        UpdateTime: "2020-06-22 16:36:11"
    }...]

    前端需要拿到的是多个数组。

    相关代码:

    //根据数组对象属性分割成多个数组(已选组织进行分组显示)
        classify(arr){
            //console.log("classify",arr);
            let obj = {}
            arr.map(v => {
                obj[v.OrgType] = 0  
            })
            let OrgTypeArr = Object.keys(obj)
            // console.log('OrgTypeArr', OrgTypeArr)
            let result = OrgTypeArr.map(v => {
                return {
                data: arr.filter(_v => v == _v.OrgType)
                }
            })
            return result
        },

    分割后的数据结构

    [{
       data:[
            {
                CreateTime: "2020-06-22 16:36:11"
                OrgType: "财务"
                OrgTypeCode: "5"
                Count: "1000"
                UpdateTime: "2020-06-22 16:36:11"      
            }
        ]
    },
    {
        data:[
            {
                 CreateTime: "2020-06-22 16:36:11"
                 OrgType: "人事"
                 OrgTypeCode: "4"
                 Count: "5"
                 UpdateTime: "2020-06-22 16:36:11"        
            },
            {
                 CreateTime: "2020-06-22 16:36:11"
                 OrgType: "人事"
                 OrgTypeCode: "4"
                 Count: "10"
                 UpdateTime: "2020-06-22 16:36:11"
            }
        ]
    },
    {
        data:[
            {
                CreateTime: "2020-06-22 16:36:11"
                OrgType: "技术"
                OrgTypeCode: "3"
                Count: "99"
                UpdateTime: "2020-06-22 16:36:11"
            }
        ]
    }]
    

    我们可以通过遍历这个数组,获取到我们需要的数据

     

    展开全文
  • 根据对象的某个属性值,删除对象数组中的对应的对象 问题:elem参数获取了当前的对象,根据elem中某个属性值来匹配self.checkedList这个对象数组,并删除匹配到的对象。 解决方法:如图 注:find()方法返回数组中符合...

    根据对象的某个属性值,删除对象数组中的对应的对象

    问题:elem参数获取了当前的对象,根据elem中某个属性值来匹配self.checkedList这个对象数组,并删除匹配到的对象。
    解决方法:如图在这里插入图片描述
    :find()方法返回数组中符合测试函数条件的第一个元素。否则返回undefined
    indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置

    展开全文
  • const statusList = [ { value: 'UN_PUBLISH', label: '未发布' }, { value: 'PUBISH', label: '已发布' }, { ...
  • 1. 该方法可获得对象属性名,返回一个数组 Object.keys(arg): Object 是固定格式; arg 是需要检测的对象; ...var fruits = { first: &...Object.keys(fruits) // 返回数组: first,second, last 2. 用Obje...
  • 判断数组对象属性值是否相等

    千次阅读 2020-03-11 12:25:15
    最近做一个文件上传批量导入数据功能,但因后台返回的数据没做属性值重复处理,需要前端处理: 返回的数据结构如下: , 因项目的要求,返回来的所有值都要,所以使用数组的filter,indexOf方法并不能达到预期的要求...
  • 获取对象属性值并将他们组成数组

    千次阅读 2018-08-06 16:22:50
    var params={ "categories":["男裤","女裤","童裤"], ...//获取属性值 ... //打印对象属性名称组成的数组 console.log(key1[0]) //打印其中一个属性名称...
  • upshow属性是在请求到后台的数据...//给后台返还的数据就对象加对象属性值 array.forEach((r) => { //array是后台返回的数据 r.upshow = false; //r = array[0]的所有数据,这样直接 r.新属性 = 属性值 即可 ...
  • 获取实体的所有可见属性值以下代码提供了两种实现,一种是基于List,一种是基于Map; 基于List的实现更节省内存,更高效一些;如果你有其它特殊的需求... * @return 返回一个Object数组,该数组包含实体的所有可见属性值
  • js实现对象数组属性值的批量查询

    千次阅读 2019-02-28 09:58:30
    此方法适用于批量查询一个数组中的各个对象中的某一属性值,结果返回true 或者false 示例:查询数组中name是否全部有值 let search = [{name : 'a'} , {name : ' ' }] if (search.every(item => item.name !==...
  • 查找对象数组中某个对象属性值是否存在并返回完整对象 查找对象数组中某个对象属性值是否存在并返回Index 以对象数组中对象某个属性排序 找出对象数组中某个属性的最大最小值 let testArray = [ { ...
  • Here are a few ways toremove an item from an array using JavaScript. All the method describeddo not mutate the original array, and instead create a new one. If you know the index of an item ...
  • 请求接口返回数据两种常见数组对象[object Object]单个属性值得获取 No.1 第一种是用JSON转换得到的是 {“属性”:“属性值”},我用的取值方法如下: 最终取到的结果:![在这里插 No.2 第二种是用JSON转换得到...
  • 如题 想要查找数组对象的某个属性是否相同 data() { return { iosDicData:[ { label1: '6001', value1: 600, productId: "C1" }, { label1: '12001', value1: 1200, p
  • Object.keys(‘检测对象’) var obj = {“a”:1,”b”:2}; Console.log(Object.keys(obj)) //[ ‘a’, ‘b’ ]
  • js根据相同属性值将一个一维对象数组转为二维数组es6的方法 将一个一维对象数组,根据相同的属性值,转化成一个二维数组 如 // 待转换的一维数组 var arrayFirst = [{ code: 1, datas: 'a网吧' }, { code: 1, ...
  • 获取对象数组中某个属性值最小的对象
  • 例: let list=[ { id:1, name:'zhangsan' }, { id:2, name:'zhangsan' }, { id:3, name:'zhangsan' }, { id:4, name:'zhangsan' } ] getNames(list) { ... list.forEach( (item,...
  • 以下例子是根据time属性把一维数组转为二维数组。 先定义一个数组: const array = [ { id: 123, time: '2018-7', name: 'aaa' }, { id: 123, time: '2018-8', name: 'aaa' }...
  • 遍历一个对象数组返回一个包含相匹配的属性-对的所有对象数组
  • 要确定数组对象中每一项中有没有发布状态的,如果有也就是判断releaseStatus字段有没有为true的,只要有一个为true就给出提示让撤回后再删除,如果没有发布中的直接删除,下面这句可以快速判断,只要有一个是true就...
  • 例: var outArr=[ {"name":"张三","id":1,age:18}, {"name":"李四","id":2,age:19}, {"name":"王五","id":3,age:18}, {"name":"小红","id":4,age:20}, {"name":"小明","id":5,age:17}, {"name":"小白","id":6...
  • * description: java8 对list集合中的对象遍历,重新赋值两种方法,遍历某个属性返回数组 * date: 2020/1/10 16:46 * author: * version: 1.0 */ @Slf4j public class DaoThree { public static void main...
  • 根据数组对象中的属性值删除对象

    千次阅读 2017-01-22 18:42:00
    如图: 一个数组中包括三个对象 我要根据属性isHost的值为1,来删除其中的object; ...最后,解决的方法: ...//可以把筛选后的对象... function removeByValue(arr,attr,value) {//数组,属性,属性值 for(var ...
  • 1.json对象属性是json对象,结构如下: info属性为json对象 { "name":"zhangsan", ...2.json对象属性是json数组,结构如下: info属性为json数组 { "name":"zhangsan", "age":14, "inf
  • 对于原始类型元素的数组,可以直接使用indexOf()神器,会返回数组中元素的下标,若没找到则返回-1:var arr = [1,2,3,4,5]; var index = arr.indexOf(3); //2对于以对象为元素的数组,没有直接的函数可以使用,但是...
  • 一、some():用于检测数组中的元素是否...如果数组中检测到有一个元素不满足,则整个表达式返回false,且剩余的元素不会再进行检测。 如果所有元素都满足条件,则返回 true。 1、判断数组: var arr = [0,0,0,...
  • 今天在做前端项目时候,需要调用后端接口,获取客户名称和客户Id,需要放在下拉框中 ,但是给出来的接口...怎么写一个通用函数呢,t1获取t2,既能满足需要的数据,又能指定返回对象属性 var t1 = [{customerName : '客户0...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 508,392
精华内容 203,356
关键字:

对象属性值返回数组