Почему всегда возвращает undefined?

Question

[Дмитрий]

Здравствуйте, есть простая функция которая должна возвращать true либо false в зависимости от ответа сервера.

function mobileClassExist(className){
            $.ajax({
                url: 'styles-check.php',
                type: 'POST',
                data: {classNameToCheck: className},
                dataType: 'json',
                success: function(data, status, jqXHR){
                    console.log( 'data - ', data );
                    if (data) {
                        console.log( true );
                        return true
                    } else {
                        console.log( false );
                        return false;
                    }
                },
                error: function(jqXHR,status,error){},
            });
        }

        const re = mobileClassExist('test');
        const re2 = mobileClassExist('TPad0');
        console.log('re - ', re);
        console.log('re2 - ', re2);

вызов функции всегда возвращает undrfined хотя console.log внутри success выводит все правильно.
В чем ошибка?

Спасибо.

Answer 1

[v3shin]

$.ajax - функция асинхронная, она выполняется отдельно от остального кода. Так что, код, зависящий от результатов ее выполнения, перенесите в success.

Answer 2

[Somewhere Intech]

Параметр success у Вас содержит коллбэк функцию, которая вызывается только после успешного получения ответа от сервера. Т.е. return true / false она делает, но сама то функция вызывается не сразу и уже движком jquery, результат в ту область и отдается. Вообще почитайте про асинхронщину или сразу про промисы

Answer 3

[ptvalx]

Потому что $.ajax у вас работает асинхронно. Плюс к этому return в функции success вернёт результат в никуда.

Answer 4

[Александр]

Потому что функция асинхронная. Варианта 2:
1. Передаете функцию обратного вызова

function mobileClassExist(className, callback) {
	$.ajax({
		...,
		success(data) {
			callback(data);
		}
	});
}

mobileClassExist(..., function (exists) {
	console.log(exists);
});

2. Используете Promise API и, опционально, async/await.

function mobileClassExist(className) {
	return new Promise(function (resolve, reject) {
		$.ajax({
			...,
			success(data) {
				resolve(data);
			},
			error(data) {
				reject(data);
			}
		});
	});
}

mobileClassExist(...)
	.then(function (exists) {
		console.log(exists);
	});

Answer 5

[Loli E1ON]

Используйте .then, так как вы вызываете асинхронную функцию