Как я могу выполнить две операции внутри одной функции карты в Javascript

Question

В настоящее время я пытаюсь получить все трендовые репозитории со страницы трендов Github и звездочек, которые у них есть, и создать из них текстовый файл.URL-адрес это

Я использую Puppeteer для того же.

Для списка репозиториев я сделал это

const data = await page.evaluate(()=>{
        const tds =Array.from(document.querySelectorAll('.explore-content ol li div h3'));
        return tds.map(td => td.textContent);
    });

, что дает мне такой результат

The top repositories are 

    charlax / professional-programming
,

    ssloy / tinyraytracer
,

    komeiji-satori / Dress
,

    ForrestKnight / open-source-cs
,

    hjacobs / kubernetes-failure-stories
,

    osforscience / deep-learning-ocean
,

    alexkimxyz / nsfw_data_scrapper
,

    kamranahmedse / developer-roadmap
,

    typescript-eslint / typescript-eslint
,

    Musish / Musish
,

    MisterBooo / LeetCodeAnimation
,

    yagiz / Bagel
,

    SpaceVim / SpaceVim
,

    antonmedv / fx
,

    pjialin / py12306
,

    braver / programmingfonts
,

    macrozheng / mall
,

    Snailclimb / JavaGuide
,

    schollz / howmanypeoplearearound
,

    flutterchina / flutter-in-action
,

    flutter / flutter
,

    rikschennink / shiny
,

    doocs / advanced-java
,

    MFatihMAR / Awesome-Game-Networking
,

    go-task / task

Чтобы получить звезды, у меня есть еще одна функция, напримерэто

const stars = await page.evaluate(()=>{
        const stars = Array.from(document.querySelectorAll('.explore-content ol li div:nth-child(4) a'));
        return stars.map(star=>star.textContent);

    });

, который выводит таким образом

В верхних репозиториях есть

    5,304
  ,

    379
  ,
          ,,,,,,

    1,173
  ,

    44

Я хочу объединить выходные данные двух методов в одном методе так, чтобыЯ могу получить результат, как

Чарлакс / профессиональное программирование имеет 5,304 звезды.

Как объединить результаты метода data и stars или как можно выполнить две разные операции в одном методе.Могу ли я выполнить две симулятивные операции в одном методе map?Если да, то как?

Answer 1

Вы можете сделать что-то вроде этого.Вам не нужно дважды ждать одного и того же.

const data = await page.evaluate(()=>{
  const stars = Array.from(document.querySelectorAll('.explore-content ol li div:nth-child(4) a'));
  const tds =Array.from(document.querySelectorAll('.explore-content ol li div h3'));
  var resArr = []
  for(let i = 0; i<stars.length; i++){
    resArr.push(`${tds[i].textContent} has ${stars[i].textContent}`)
  }
  return resArr;
}

Answer 2

Возможно, более безопасный способ сделать это:

const data = await page.evaluate(() => {
  const exctactedData = [];
  for (const entry of document.querySelectorAll('ol.repo-list > li')) {
    exctactedData.push(`${
      entry.querySelector('h3').innerText
    } has ${
      entry.querySelector('a[href$="/stargazers"]').innerText.trim()
    } stars.`);
  }
  return exctactedData.join('\n');
});

Answer 3

вы хотите "сжать" результаты двух массивов, а затем отобразить на них

await page.evaluate(()=>{
  const repos = Array.from(document.querySelectorAll('.explore-content ol li div h3'));
  const stars = Array.from(document.querySelectorAll('.explore-content ol li div:nth-child(4) a'));

  // this is an array of tuples (two element arrays)
  // where the first element is the name and the second is the star count
  const zipped = repos.map((repoName, idx) => [repoName, stars[idx])

  return zipped.map(([repoName, starCount]) => `${repoName.textContent} ${starCount.textContent}`)
});