Почему мой .done срабатывает до выполнения обещания?

Question

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

Вот мой код:

function editPer () {
    // load permissions from server
    $.when(loadPermissions())
    .done( function () {
        // display returned data
        console.log('done');
        console.log(permissions);
    })
    .fail(console.log('fail'));
} // end function editPer

function loadPermissions () {
    $.ajax({
        type: "POST",
        url:  "server/permissions.php",
        data: {action:'list',acc:33},
        dataType: 'json',
        success: function(data){
            console.log(data);
            listPermissions(data);
        } // end success function
    }); // end ajax
} // end function loadPermissions

function listPermissions (data) {
    status = data.status;
    if (status == 'LISTREADY') // list successful
    {
        // create list
        permissions = data.list; 
    }
} // end function listPermissions

loadPermissions успешно выполняется и передает данные в listPermissions, который создает список (с одной записью).Моя функция editPer не должна обрабатываться до тех пор, пока список не будет готов, но когда я пытаюсь вывести список, он пуст.

Чтобы еще больше сбить меня с толку, оба .done и .fail запускаются в editPer указывает на то, что отложенное было разрешено и отклонено.

Как я могу гарантировать, что .done срабатывает только тогда, когда список готов (listPermissions завершен)?

listPermissions можно вызывать из других функций, поэтому я бы предпочел разделить listPermissions и editPer.И если есть лучший способ сделать это без обещания, я тоже заинтересован в этом.

Answer 1

Аргумент (ы) для when должен быть отложен (ы), но на самом деле вы вместо этого передаете undefined, потому что функция loadPermissions ничего не возвращает.

Отсрочка для возврата равнатот, который возвращает вызов $.ajax, поэтому ... верните его:

return $.ajax({ // ...

Во-вторых, ваш обработчик fail не является функцией, так как вы немедленно выполняете console.log.Это должно быть:

.fail(function () {
    console.log('fail');
});

Следует отметить, что использование глобальных переменных (permissions) не является наилучшей практикой.Возможно, вы захотите разрешить своему отложенному разрешению эти значения вместо того, чтобы указывать их как глобальные.

Вот как это может выглядеть:

function editPer () {
    loadPermissions().then(function (permissions) {
        console.log('then');
        console.log(permissions);
    }).catch(function(error) {
        console.log('catch: ' + error);
    });
}

function loadPermissions () {
    return $.ajax({
        type: "POST",
        url:  "server/permissions.php",
        data: {action:'list',acc:33},
        dataType: 'json',
    }).then(function(data){
        return listPermissions(data);
    });
}

function listPermissions (data) {
    // Throwing error will make the promise reject and execute the catch callback
    if (data.status != 'LISTREADY') throw "not ready";
    return data.list; 
}