accessing specific values of objects nested inside an array

Question

I am trying to access certain key value for objects nested inside an array. When I try to do that with filter(x => x.key('duration'));

I get .key is not a function.

Here I want to access the values of keys "duration" within the objects of the array:

'use strict';

const monday = [
  {
    name: 'Write a summary HTML/CSS',
    duration: 180,
  },
  {
    name: 'Some web development',
    duration: 120,
  },
  {
    name: 'Fix homework for class10',
    duration: 20,
  },
  {
    name: 'Talk to a lot of people',
    duration: 200,
  },
];

const tuesday = [
  {
    name: 'Keep writing summary',
    duration: 240,
  },
  {
    name: 'Some more web development',
    duration: 180,
  },
  {
    name: 'Staring out the window',
    duration: 10,
  },
  {
    name: 'Talk to a lot of people',
    duration: 200,
  },
  {
    name: 'Look at application assignments new students',
    duration: 40,
  },
];

const maartjesTasks = monday.concat(tuesday);
const maartjesHourlyRate = 20;
console.log(maartjesTasks);

```js

This is because x.key('duration') item "x" has no "key" method since it's an object. Just use x.duration or x['duration']. — briosheje
– briosheje, Commented May 9, 2019 at 8:29

Orelsanpls · Accepted Answer · 2019-05-09 08:53:25Z

To get the list of all duration, do not use Array.filter that will create a new array containing elements matching a specific condition, but Array.map that will create a new array containing the returned values. Here we are returning the key duration, so it creates a new array containing all duration.

Also, when using Array.filter or Array.map, the first argument of the function is the element of the array you are treating.

This element being an object, as example :

{
    name: 'Write a summary HTML/CSS',
    duration: 180,
},

The proper way to access the duration value is to use . notation, like : x.duration.

There is no key method to access an object key.

Also in my example you will see that I use of ... which is called a spread operator. I use it to concatenate both arrays. It's the same as calling concat except that it's a lot faster.

const monday = [
  {
    name: 'Write a summary HTML/CSS',
    duration: 180,
  },
  {
    name: 'Some web development',
    duration: 120,
  },
  {
    name: 'Fix homework for class10',
    duration: 20,
  },
  {
    name: 'Talk to a lot of people',
    duration: 200,
  },
];

const tuesday = [
  {
    name: 'Keep writing summary',
    duration: 240,
  },
  {
    name: 'Some more web development',
    duration: 180,
  },
  {
    name: 'Staring out the window',
    duration: 10,
  },
  {
    name: 'Talk to a lot of people',
    duration: 200,
  },
  {
    name: 'Look at application assignments new students',
    duration: 40,
  },
];

const durations = [
 ...tuesday,
 ...monday,
].map(x => x.duration);

console.log(durations);

NOTA: This do not handle the duplicates duration. If you wants no duplicates, I advise you to take a look at : Set

chatnoir · Accepted Answer · 2019-05-09 08:31:39Z

0

Try calling the object property directly with a "." like so:

let arr = monday.filter(obj => {
    console.log(obj.duration) // 180, 120, 20, 200 
})

answered May 9, 2019 at 8:31

chatnoir

2,3131 gold badge17 silver badges17 bronze badges

Comments

Maheer Ali · Accepted Answer · 2019-05-09 08:37:23Z

0

x.key('duration') would call the "key" method of x, which doesn't have one.

Use bracket notation:

filter(x => x['duration']);

edited May 9, 2019 at 8:37

Maheer Ali

36.5k8 gold badges53 silver badges83 bronze badges

answered May 9, 2019 at 8:32

Zekromaster

13 bronze badges

3 Comments

briosheje Over a year ago

x.key('duration') is, in fact, not valid JS. this is not correct. It is valid js, it's just that Objects has no .key prototype, so it throws exception.

Maheer Ali Over a year ago

"x.key('duration') is, in fact, not valid JS." Its valid JS syntax(though it will not work in this case). x.key('duration') is calling the method key of x with first paramter passed as a string.

Zekromaster Over a year ago

@MaheerAli Agreed, bad wording. Edited.

Collectives™ on Stack Overflow

accessing specific values of objects nested inside an array

3 Answers 3

Comments

Comments

3 Comments

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

3 Comments

Related