Подсчет нескольких уникальных значений в одном ключе в Object

Question

Я пытаюсь отследить, сколько раз в одном и том же ключе отображаются четыре конкретных строковых значения.

Проблема в том, что мне трудно добавить несколько счетчиков.Первый счетчик работает и отслеживает первое условие, но следующее условие в операторе if / else препятствует тому, чтобы начальное и каждое условие с этого момента добавлялось правильно.Данные поступают с Promise.all, который содержит несколько URL-адресов.

Вот мой код:

const urls = [
  'https://api.github.com/users/TylerP33/repos?page=1',
  'https://api.github.com/users/TylerP33/repos?page=2',
  'https://api.github.com/users/TylerP33/repos?page=3',
  'https://api.github.com/users/TylerP33/repos?page=4',
  'https://api.github.com/users/TylerP33/repos?page=5',
  'https://api.github.com/users/TylerP33/repos?page=6',
  'https://api.github.com/users/TylerP33/repos?page=7',
  'https://api.github.com/users/TylerP33/repos?page=8',
  'https://api.github.com/users/TylerP33/repos?page=9',
  'https://api.github.com/users/TylerP33/repos?page=10',
  'https://api.github.com/users/TylerP33/repos?page=11',
  'https://api.github.com/users/TylerP33/repos?page=12'
]


function getLanguages() {
  return Promise.all(urls.map(url =>
    fetch(`${url}`)
    .then(response => response.json())
    .then(obj => obj.forEach(function(val) {
      var rubyCounter = 0
      var cssCounter = 0
      var htmlCounter = 0
      var jsCounter = 0
      if (val.language === "Ruby") {
        rubyCounter++;
        console.log(rubyCounter);
      }

    })))
  )
}

getLanguages();

rubyCounter вернет 235, что является правильной суммой, ноесли я добавлю больше условий, это похоже на условие истина / ложь, проходящее через один и тот же ключ.Возможно, мне не хватает чего-то вопиющего, но мне было любопытно посмотреть, что вы, ребята, подумали.

Заранее спасибо.

Answer 1

Пожалуйста, проверьте, работает ли это для вас:

const urls = [
            'https://api.github.com/users/TylerP33/repos?page=1',
            'https://api.github.com/users/TylerP33/repos?page=2'
        ]

        var counters = {};
        function getLanguages() {
            return Promise.all(urls.map(url => {
                fetch(`${url}`)
                    .then(response => response.json())
                    .then(json => json.forEach(function (val) {
                        if (!counters[val.language])
                            counters[val.language] = 0;

                        counters[val.language]++;

                    }))
                    .then(() => {
                        console.log(counters);
                    });
            }));
        }

        getLanguages();

Answer 2

Для этого кода rubyCounter всегда будет 1, если он зарегистрирован, потому что эти счетчики всегда инициализируются в обратном вызове.

Вам не нужно перемещать определение этих счетчиков в корень getLanguages.

И вместо использования многозначных переменных для каждого счетчика я бы использовал объект, и для каждого языка, который вы хотите считать, у вас есть свойство.

const urls = [
  'https://api.github.com/users/TylerP33/repos?page=1',
  'https://api.github.com/users/TylerP33/repos?page=2',
  'https://api.github.com/users/TylerP33/repos?page=3',
  'https://api.github.com/users/TylerP33/repos?page=4',
  'https://api.github.com/users/TylerP33/repos?page=5',
  'https://api.github.com/users/TylerP33/repos?page=6',
  'https://api.github.com/users/TylerP33/repos?page=7',
  'https://api.github.com/users/TylerP33/repos?page=8',
  'https://api.github.com/users/TylerP33/repos?page=9',
  'https://api.github.com/users/TylerP33/repos?page=10',
  'https://api.github.com/users/TylerP33/repos?page=11',
  'https://api.github.com/users/TylerP33/repos?page=12'
]


function getLanguages() {
  let counter = {
    ruby: 0,
    html: 0
  }

  return Promise.all(urls.map(url =>
      fetch(`${url}`)
      .then(response => response.json())
      .then(obj => obj.forEach(function(val) {
        /*var rubyCounter = 0
        var cssCounter = 0
        var htmlCounter = 0
        var jsCounter = 0*/
        if (val.language === "Ruby") {
          counter.ruby++;
        } else if (val.language === "HTML") {
          counter.html++;
        }

      }))))
    .then(() => {
      console.dir(counter)
    })
}

getLanguages();

Если вы хотите объединить все языки, это еще проще:

const urls = [
  'https://api.github.com/users/TylerP33/repos?page=1',
  'https://api.github.com/users/TylerP33/repos?page=2',
  'https://api.github.com/users/TylerP33/repos?page=3',
  'https://api.github.com/users/TylerP33/repos?page=4',
  'https://api.github.com/users/TylerP33/repos?page=5',
  'https://api.github.com/users/TylerP33/repos?page=6',
  'https://api.github.com/users/TylerP33/repos?page=7',
  'https://api.github.com/users/TylerP33/repos?page=8',
  'https://api.github.com/users/TylerP33/repos?page=9',
  'https://api.github.com/users/TylerP33/repos?page=10',
  'https://api.github.com/users/TylerP33/repos?page=11',
  'https://api.github.com/users/TylerP33/repos?page=12'
]


function getLanguages() {
  let counter = {}

  return Promise.all(urls.map(url =>
      fetch(`${url}`)
      .then(response => response.json())
      .then(obj => obj.forEach(function(val) {
        if( val.language ) {
          counter[val.language] = counter[val.language] || 0
          counter[val.language]++
        }
      }))))
    .then(() => {
      console.dir(counter)
    })
}

getLanguages();