How to select data from an array?

How to select data from an array?
0

#1

I data API structured like this.

const article =  [

    { "title": "title 1", "body": "body 1" }
    { "title": "title 2",  "body": "body 2" }

]

but when i tried to get the title data with

let title =  article.title

I got undefined sure when i tried this

let title = article[0].title

I got only the data in array 1. How to get all the title data?


#2

You mean

Object.keys(article[0])

?


#3

First of all, you have a syntax error, you are missing a comma after your first object in the array. Having said that, based on what you said, you would like to get the title key values and store those values somewhere ?

const article =  [
 { "title": "title 1", "body": "body 1" },
 { "title": "title 2",  "body": "body 2" }
]

const titles = []

for(let i = 0; i < article.length; i++) {
 if(article[i].title) {
  titles.push(article[i].title)
 }
}

console.log(titles) // output: ["title 1", "title 2"]

I am not sure if this is what you asked given that you were not very clear with what you are trying to do.


#4

sorry my bad, forgot that coma


#5

Gilbert’s solution surely works. It would probably be more common to use functional programming and the map method on that array.

const titles = article.map(function(a) { return a.title })

And with an ES6 arrow function, it is:

const titles = article.map(a => a.title)

Under the hood it’s doing the same thing, but I would argue that this is more readable.

Just for the halibut, I would also point out that you do not need quotes around those object properties, so your definition could be:

const article =  [
    { title: "title 1", body: "body 1" },
    { title: "title 2", body: "body 2" }
]

The only time you need the quotes is if the property name is not a valid JS identifier (like if it has a space). Also you need the quotes when you are doing a JSON file. There’s nothing inherently wrong with using the quotes, but it does look a bit odd to people used to JS.


#6

This is my code now. Thanks anyway

yeah i know that but i get that data from API that I’m using


#7

but why this keep saying on console that map is not a function
I think it is like this :

 const titles = article.map(a => {
   title:  a.title
   body:  a.body
})

#8

I would have to see the exact code you are using in its entirety. But if it says map is not a function that would indicate that article is not an array so it is not defined properly.

I think it is like this :

 const titles = article.map(a => {
   title:  a.title
   body:  a.body
})

No, that will not work, it will just return an array of undefined. There are a couple syntax mistakes there.

This is the entirety of the code that works:

const article =  [
    { title: "title 1", body: "body 1" },
    { title: "title 2", body: "body 2" }
]
const titles = article.map(a => a.title)
console.log(titles)

#9

okay thanks. I got it. realy helpfull :blush::+1:

Actualy it is in vuejs. so the data are jumping from one tho another component

I sometimes got an array and not an array. this is where the problem comes from. I dont know why maybe its the way i call and map that data.

I get rid of the error code with this.

const article = . request.dataArticle || []

From your code i should map all data one by one right?