I have three array of objects, I need to extract a single data from each object in each of the arrays and expose them in different paragraphs in an html document. Unfortunately it prints me several times each data. One of the array is:
let objDos = {
Dental: [
{
HORA: "8:30",
ESPECIALISTA: "ANDREA ZUÑIGA",
PACIENTE: "MARCELA RETAMAL",
RUT: "11123425-6",
PREVISION: "ISAPRE"
},
{
HORA: "11:00",
ESPECIALISTA: "MARIA PIA ZAÑARTU",
PACIENTE: "ANGEL MUÑOZ",
RUT: "9878789-2",
PREVISION: "ISAPRE"
},
{
HORA: "11:30",
ESPECIALISTA: "SCARLETT WITTING",
PACIENTE: "MARIO KAST",
RUT: "7998789-5",
PREVISION: "FONASA"
},
{
HORA: "13:00",
ESPECIALISTA: "FRANCISCO VON TEUBER",
PACIENTE: "KARIN FERNANDEZ",
RUT: "18887662-K",
PREVISION: "FONASA"
},
{
HORA: "13:30",
ESPECIALISTA: "EDUARDO VIÑUELA",
PACIENTE: "HUGO SANCHEZ",
RUT: "17665461-4",
PREVISION: "FONASA"
},
{
HORA: "14:00",
ESPECIALISTA: "RAQUEL VILLASECA",
PACIENTE: "ANA SEPULVEDA",
RUT: "14441281-0",
PREVISION: "ISAPRE"
}
]
}
To this array , I apply the following code
let array = objDos.Dental;
for(item of array){
let paragraph = []
for(let value in item){
paragraph.push(item.PACIENTE);
}
console.log(paragraph);
}
But in the browser console it returns me
(5) ["MARCELA RETAMAL", "MARCELA RETAMAL", "MARCELA RETAMAL", "MARCELA RETAMAL", "MARCELA RETAMAL"]
VM457:54 (5) ["ANGEL MUÑOZ", "ANGEL MUÑOZ", "ANGEL MUÑOZ", "ANGEL MUÑOZ", "ANGEL MUÑOZ"]
VM457:54 (5) ["MARIO KAST", "MARIO KAST", "MARIO KAST", "MARIO KAST", "MARIO KAST"]
VM457:54 (5) ["KARIN FERNANDEZ", "KARIN FERNANDEZ", "KARIN FERNANDEZ", "KARIN FERNANDEZ", "KARIN FERNANDEZ"]
VM457:54 (5) ["HUGO SANCHEZ", "HUGO SANCHEZ", "HUGO SANCHEZ", "HUGO SANCHEZ", "HUGO SANCHEZ"]
VM457:54 (5) ["ANA SEPULVEDA", "ANA SEPULVEDA", "ANA SEPULVEDA", "ANA SEPULVEDA", "ANA SEPULVEDA"]
undefined
Unlike that, what I'm looking for is
Marcela retamal
Angel Muñoz
Mario Kast
Karin Fernandez
Hugo Sanchez
Ana Sepulveda
Then replicate this in three more arrays and output this result to an html document, by using the innerHTML method
You have several errors in the code.
You define the variable paragraph inside a loop, so it will be defined several times, but in the end, you want it to accumulate the values, so you should define it only once, outside the loop.
Since you only want to retrieve the patient from each element of the array, you only have to iterate through the array to extract it directly, you don't need to iterate through its attributes (remember you want a single attribute of each object).
Like the variable declaration, the print should only happen once, after finishing traversing the array. You are sending it to print many times, once for each iteration of the loop.
Correcting those problems, the code would look something like:
Click the "Run" button to try it out right here in your browser.
How are you?
Your paragraph array will be filled/repeated 6 times for the objects in your Dental array while in the for loop. Also, you could avoid access variables, empty and multiple tedious iterations.
Simplifying, I propose the following solution with ES8/ES6 , a little cleaner and simpler to understand to achieve what you are looking for, obtaining the same result.
Object.values
returns the values of a property as an array, in this case it will obtain the values of the objects by directly accessing Dental andmap
it will take care of filtering the PATIENT keys, returning their values in a new array.