Async / Await в простом файле JS - PullRequest
0 голосов
/ 14 января 2019

Моя проблема в том, чтобы написать async / await в простом файле JS.

Я хочу реализовать react-native-languages в своем приложении, как показано в примере, поэтому мне нужно создать файл i18n, в котором я устанавливаю конфигурацию, которая работает, как и ожидалось. Одна из проблем заключается в том, что я хочу предоставить пользователю возможность изменять язык, а когда он хочет, я хочу сохранить выбранный язык в моем localStorage, поэтому обычно мне нужно проверить в файле i18n для localStorage, если есть язык или нет, но, как мы все знаем, localStorage асинхронен, так как я могу это сделать?

Вот мой файл i18n

import React from 'react';
import { AsyncStorage } from 'react-native';
import RNLanguages from 'react-native-languages';
import i18n from 'i18n-js';

import en from '@languages/en.json';
import ar from '@languages/ar.json';

let default_language = async () => {
  return await AsyncStorage.getItem('language');
}

// the above approach is not working

i18n.locale = RNLanguages.language;
i18n.fallbacks = true;
i18n.translations = { ar, en }

export default i18n;

Как заставить код ожидать выборки в локальном хранилище, прежде чем выполнять что-либо еще?

Ответы [ 2 ]

0 голосов
/ 14 января 2019

Вы хотели бы использовать defaultLanguage, когда оно разрешится. Выражение await приводит к приостановке выполнения асинхронной функции до разрешения обещания. Когда вы вызываете функцию setLanguage, она будет ждать, пока defaultLanguage не будет решена или отклонена. Вместо использования async вы можете сначала посмотреть, как использовать функцию обратного вызова. Я считаю, что более полезно понять, как работает async.

let setLanguage = async () => {
   // you may add get keyword to function name
   let defaultLanguage = await default_language();
   // check defaultLanguage and set if necessary
}
0 голосов
/ 14 января 2019

Асинхронные функции являются асинхронными.

Нельзя заставить асинхронную функцию работать синхронно.

Вы можете создать иллюзию синхронного запуска асинхронной функции, используя ключевое слово await внутри функции, помеченной ключевым словом async.

Вы можете только await значение, которое является Обещанием. (Я понятия не имею, возвращает ли AsyncStorage.getItem('language') Обещание или нет).

Чтобы это работало, функция async будет всегда возвращать Обещание .

Итак:

let default_language = async () => {
  return await AsyncStorage.getItem('language');
}

Создает функцию, которая назначена на default_language.

Эта функция вернет обещание. Это обещание будет соответствовать стоимости, которую вы возвращаете. Так как это должно быть Обещанием, это значение будет Обещанием. Если вы выполняете обещание с другим обещанием, оно принимает новое обещание.

Это означает, что ваш код функционально такой же, как:

let default_language = () => AsyncStorage.getItem('language');

Обертывание дополнительной функции вокруг нее более или менее бессмысленно. Это просто делает немного более короткое имя, чтобы позвонить позже.

Полезно использовать async / await, если вы собираетесь что-то делать со значением внутри функцией async:

let default_language = async () => {
  const lang = await AsyncStorage.getItem('language');
  console.log(lang);
  something_useful(lang);
  return lang;
}
...