Console log of array is empty

Question

I have these two code examples:

no1

const r = new Array();

for (i = 0; i < 5; i++) {
  const vari = 'print';
  r.push(vari);
}

console.log(r);

console log of this is [ 'print', 'print', 'print', 'print', 'print' ]

no2(using cheerio for scraping)

const sqft = new Array();
      for (k = 0; k < links.length; k++) {
        request(`${links[k]}`, (error, response, html) => {
          const $ = cheerio.load(html);
          const pr = $('div[class="df2  "]').first().text();
          sqft.push(pr);
        });
      }
console.log(sqft);

Links are pushed in request before this. Now when I console.log(sqft) I get []. If I console.log it inside for loop it will show data. Is it the difference between no1 and no2 or cheerio is making a problem? Thanks!

I think that the request function is asyncronous therefore the console.log is executed before the requests are called — Alex, Jan 12 '21 at 13:57
is there any way to wait for this exact request to finish and then proceed further down the code? @Luceafărul — pupeeterMaster, Jan 12 '21 at 14:06
[Why is my variable unaltered after I modify it inside of a function? - Asynchronous code reference](https://stackoverflow.com/q/23667086) — VLAZ, Jan 12 '21 at 14:39
Does this answer your question? [Why is my variable unaltered after I modify it inside of a function? - Asynchronous code reference](https://stackoverflow.com/questions/23667086/why-is-my-variable-unaltered-after-i-modify-it-inside-of-a-function-asynchron) — Heretic Monkey, Jan 12 '21 at 14:42
this package is deprecated please use axios i put the sample code in answers — Amir, Jan 12 '21 at 15:01

StepUp · Answer 1 · 2021-01-12T14:31:56.533

2

It looks like you have asynchronous operation. So we need to use async and await keywords to make execution synchronous:

async function yourFunction() {
    const sqft = new Array();
    for (k = 0; k < links.length; k++) {
        // here we are waiting for the promise to be resolved
        let res = await request();
        const $ = cheerio.load(res.html);
        const pr = $('div[class="df2  "]').first().text();
        sqft.push(pr);
    }
}

edited Jan 12 '21 at 14:31

answered Jan 12 '21 at 14:19

StepUp

36,391
15
88
148

shouldn't something like this should work: `const sqft = new Array(); async function firstFunction() { for (k = 0; k < links.length; k++) { request(`${links[k]}`, (error, response, html) => { const $ = cheerio.load(html); const pr = $('div[class="df2 "]').first().text(); sqft.push(pr); }); } } async function secondfunction() { await firstFunction(); console.log(sqft); } secondfunction();` – pupeeterMaster Jan 12 '21 at 14:26

score 1 · Answer 2 · edited Jan 12 '21 at 14:59

this how you can do you're stuff with axios

const sqft = new Array();
for (k = 0; k < links.length; k++) {
  const res = await axios
    .get(`${links[k]}`)
    .then((result) => {
      // do youre logic
      //
      const $ = cheerio.load(html);
      const pr = $('div[class="df2  "]').first().text();
      sqft.push(pr);
    })
    .catch((err) => {
      //handle error
      console.log("error");
    });
}
console.log(sqft);





async function doSomeThing() {
  const sqft = new Array();
  for (k = 0; k < links.length; k++) {
    const res = await axios.get(`${links[k]}`);
    // logic    
    // .... 
    // 
    sqft.push(pr);
  }
  console.log(sqft);
}

https://jsfiddle.net/h1ab5mk9/ I did it in this way with cheerio and axios. But again after console.log of object sqft is undefined, and I'm getting an error. @Amir — pupeeterMaster, Jan 12 '21 at 15:14

Console log of array is empty

2 Answers2