Создайте обобщенную функцию c для получения данных с использованием fetch в Javascript - PullRequest
Новая
       22

Создайте обобщенную функцию c для получения данных с использованием fetch в Javascript

0 голосов
/ 23 февраля 2020

Я пытаюсь взять в руки ваниль JS.

Я наткнулся на API выборки, который можно использовать для звонков на URL, и мне интересно, могу ли я сделать обобщенный c функция, которая будет использоваться в моем приложении.

Это функция, которую я имею в настоящее время 

async function get(url){
      const response = await fetch(url);
      const data = await response.json()
      return data
}

Я работал с Fetch раньше, но в процессе реагирования, где я бы вызвал функцию this.setState() внутри функция asyn c. Функция выше возвращает обещание, а не фактические json данные, которые я должен получить по URL. Я полностью понимаю, почему это так.

Я хочу знать, есть ли способ сделать обобщенную c функцию, скажем, функцию myGet(url), которая при вызове возвращает объект json, полученный из вызова GET а не обещание. Затем я могу вызывать эту функцию во всем приложении.

Я не хочу писать оставшуюся часть кода внутри функции .then () после получения ответа.

1 Ответ

0 голосов
/ 23 февраля 2020

Вы в основном просите написать синхронный код с асинхронной функциональностью. Как можно ближе, используя async / await. Вы сможете получить ответ JSON, не попадая в .then() вложенный ад. 

// leave this as is
async function get(url){
      const response = await fetch(url);
      const data = await response.json()
      return data
}

// example function consuming the get method
async function doThings() {
  const googleData = await get('http://www.google.com');
  console.log(googleData); // this would output the actual JSON response (if real)
}

Ключ обозначает любую функцию потребления как также асинхронный. Все, кроме этого, потребует от вас использования .then() или какого-то другого ада обратного вызова. Async / await - определенно мое предпочтение, хотя это всего лишь синтаксический сахар для Promises.

...