асинхронная форма проверки подлинности - PullRequest
3 голосов
/ 08 мая 2019

Доброе утро! В настоящее время я пытаюсь создать какую-то простую проверку с использованием javascript, но у меня проблема с использованием асинхронных функций.

Ниже вы можете увидеть метод пользовательского интерфейса, который перебирает коллекции validityChecks

    checkValidity: function(input){
        for(let i = 0; i<this.validityChecks.length; i++){

            var isInvalid = this.validityChecks[i].isInvalid(input);//promise is returned
            if(isInvalid){
                this.addInvalidity(this.validityChecks[i].invalidityMessage);
            }

            var requirementElement = this.validityChecks[i].element;
            if(requirementElement){
                if(isInvalid){
                    requirementElement.classList.add('invalid');
                    requirementElement.classList.remove('valid');
                }else{
                    requirementElement.classList.remove('invalid');
                    requirementElement.classList.add('valid');
                }
            }
        }
    }

Ниже приведен конкретный объект коллекции, который не работает так, как предполагалось

var usernameValidityChecks = [
    {
        isInvalid: function(input){
            var unwantedSigns = input.value.match(/[^a-zA-Z0-9]/g);
            return unwantedSigns ? true:false;
        },
        invalidityMessage:'Only letters and numbers are allowed',
        element: document.querySelector('.username-registration li:nth-child(2)')
    },
    {
        isInvalid: async function (input){
            return await checkUsername(input.value);
        },
        invalidityMessage: 'This value needs to be unique',
        element: document.querySelector('.username-registration li:nth-child(3)')
    }

]
function checkUsername (username) {
    return new Promise ((resolve, reject) =>{
        $.ajax({
            url: "check.php",
            type: "POST",
            data: { user_name: username },
            success: (data, statusText, jqXHR) => {
                resolve(data);
            },
            error: (jqXHR, textStatus, errorThrown) => {
                reject(errorThrown);
            }
        });
    });
}

Проблема в том, что в var isInvalid в методе checkValidity возвращается обещание. Может кто-нибудь посоветовать, как вернуть туда значение вместо обещания? Или как справиться с обещанием там? Заранее спасибо!
РЕДАКТИРОВАТЬ:
Простите, но я впервые со стеком, и, возможно, мой вопрос немного неточен. Некоторые объекты в коллекциях также синхронны , я изменил usernameValidityChecks . Как справиться с такой ситуацией?
Где у меня есть асинхронный и синхронный метод одновременно?

Ответы [ 2 ]

1 голос
/ 08 мая 2019

Вместо строки ниже

var isInvalid = this.validityChecks [i] .isInvalid (input);

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

var isInvalid = await this.validityChecks [i] .isInvalid (input) .catch ((err) => {console.log (err)});

После этой строки вы получите желаемое значение для isInvalid переменная

, а также добавьте async ключевое слово во всех остальных isInvalid определение функции

0 голосов
/ 08 мая 2019

Используйте .then для доступа к результату обещания:

var isInvalid = this.validityChecks[i].isInvalid(input).then(res => res);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...