Catatan: Jawaban ini ditulis pada Februari 2010.
Lihat pembaruan dari tahun 2015, 2016 dan 2017 di bagian bawah. Anda tidak dapat mengembalikan apa pun dari fungsi yang asinkron. Apa yang dapat Anda kembalikan adalah janji. Saya menjelaskan bagaimana janji bekerja di jQuery dalam jawaban saya untuk pertanyaan-pertanyaan itu:

• Fungsi JavaScript yang mengembalikan data panggilan AJAX
• jQuery jqXHR - membatalkan panggilan berantai, memicu rantai kesalahan Jika Anda dapat menjelaskan mengapa Anda ingin mengembalikan data dan apa yang ingin Anda lakukan dengannya nanti, maka saya mungkin dapat memberi Anda jawaban yang lebih spesifik bagaimana melakukannya. Secara umum, bukannya:

function testAjax() {
  $.ajax({
    url: "getvalue.php",  
    success: function(data) {
      return data; 
    }
  });
}

Anda dapat menulis fungsi testAjax Anda seperti ini:

function testAjax() {
  return $.ajax({
      url: "getvalue.php"
  });
}

Kemudian Anda bisa mendapatkan janji Anda seperti ini:

var promise = testAjax();

Anda dapat menyimpan janji Anda, Anda dapat meneruskannya, Anda dapat menggunakannya sebagai argumen dalam panggilan fungsi dan Anda dapat mengembalikannya dari fungsi, tetapi ketika Anda akhirnya ingin menggunakan data Anda yang dikembalikan oleh panggilan AJAX, Anda harus melakukannya seperti ini:

promise.success(function (data) {
  alert(data);
});

(Lihat pembaruan di bawah ini untuk sintaksis yang disederhanakan.) Jika data Anda tersedia pada saat ini maka fungsi ini akan segera dipanggil. Jika tidak, maka fungsi ini akan dipanggil segera setelah data tersedia. Inti dari melakukan semua ini adalah bahwa data Anda tidak tersedia segera setelah panggilan ke $.ajax karena bersifat asinkron. Promises adalah abstraksi yang bagus untuk fungsi-fungsi untuk mengatakan: Saya tidak dapat mengembalikan data Anda karena saya belum memilikinya dan saya tidak ingin memblokir dan membuat Anda menunggu, jadi inilah janji sebagai gantinya dan Anda akan dapat menggunakannya nanti, atau hanya memberikannya kepada orang lain dan selesai dengan itu. Lihat ini [DEMO](http://jsfiddle.net/jW68r/). PEMBARUAN (2015)

Saat ini (per Maret, 2015) jQuery Promises tidak kompatibel dengan Promises/A+ specification yang berarti bahwa mereka mungkin tidak bekerja sama dengan baik dengan Promises/A+ conformant implementations. Namun jQuery Promises pada versi 3.x yang akan datang akan kompatibel dengan spesifikasi Promises/A+ (terima kasih kepada Benjamin Gruenbaum yang telah menunjukkannya). Saat ini (per Mei 2015) versi stabil jQuery adalah 1.x dan 2.x.

Apa yang saya jelaskan di atas (pada bulan Maret 2011) adalah cara untuk menggunakan jQuery Deferred Objects untuk melakukan sesuatu secara asinkron yang dalam kode sinkron akan dicapai dengan mengembalikan nilai. Tetapi pemanggilan fungsi sinkron dapat melakukan dua hal - bisa mengembalikan nilai (jika bisa) atau melempar pengecualian (jika tidak bisa mengembalikan nilai). Promises/A+ menangani kedua kasus penggunaan tersebut dengan cara yang cukup kuat seperti penanganan pengecualian dalam kode sinkron. Versi jQuery menangani setara dengan mengembalikan nilai dengan baik tetapi penanganan pengecualian yang kompleks agak bermasalah. Secara khusus, inti dari penanganan pengecualian dalam kode sinkron tidak hanya menyerah dengan pesan yang bagus, tetapi mencoba untuk memperbaiki masalah dan melanjutkan eksekusi, atau mungkin melempar ulang pengecualian yang sama atau berbeda untuk ditangani oleh beberapa bagian lain dari program. Dalam kode sinkron Anda memiliki call stack. Dalam panggilan asinkron Anda tidak memiliki call stack dan penanganan pengecualian lanjutan di dalam janji Anda seperti yang dipersyaratkan oleh spesifikasi Promises / A + benar-benar dapat membantu Anda menulis kode yang akan menangani kesalahan dan pengecualian dengan cara yang berarti bahkan untuk kasus penggunaan yang kompleks. Untuk perbedaan antara jQuery dan implementasi lainnya, dan cara mengonversi janji jQuery menjadi sesuai dengan Promises / A +, lihat Berasal dari jQuery oleh Kris Kowal et al. di perpustakaan Q wiki dan Promises arrive in JavaScript oleh Jake Archibald di HTML5 Rocks.

Bagaimana mengembalikan janji yang sebenarnya

Fungsi dari contoh saya di atas:

function testAjax() {
  return $.ajax({
      url: "getvalue.php"
  });
}

mengembalikan objek jqXHR, yang merupakan jQuery Deferred Object. Untuk membuatnya mengembalikan janji yang nyata, Anda dapat mengubahnya menjadi - menggunakan metode dari Q wiki:

function testAjax() {
  return Q($.ajax({
      url: "getvalue.php"
  }));
}

atau, menggunakan metode dari artikel HTML5 Rocks:

function testAjax() {
  return Promise.resolve($.ajax({
      url: "getvalue.php"
  }));
}

Promise.resolve($.ajax(...)) ini juga yang dijelaskan dalam dokumentasi modul promise dan seharusnya bekerja dengan ES6 Promise.resolve(). Untuk menggunakan ES6 Promise saat ini Anda dapat menggunakan es6-promise module's polyfill() oleh Jake Archibald. Untuk melihat di mana Anda dapat menggunakan ES6 Promises tanpa polyfill, lihat: Can I use: Promises. Untuk info lebih lanjut, lihat:

• http://bugs.jquery.com/ticket/14510
• https://github.com/jquery/jquery/issues/1722
• https://gist.github.com/domenic/3889970
• http://promises-aplus.github.io/promises-spec/
• http://www.html5rocks.com/en/tutorials/es6/promises/

  Masa Depan jQuery

  Versi jQuery di masa depan (mulai dari 3.x - versi stabil saat ini pada Mei 2015 adalah 1.x dan 2.x) akan kompatibel dengan spesifikasi Promises/A+ (terima kasih kepada Benjamin Gruenbaum karena telah menunjukkannya di komentar). "Dua perubahan yang telah kami putuskan adalah kompatibilitas Promise/A+ untuk implementasi Deferred kami [...] " (jQuery 3.0 dan masa depan pengembangan Web). Untuk info lebih lanjut lihat: jQuery 3.0: The Next Generations oleh Dave Methvin dan jQuery 3.0: More interoperability, less Internet Explorer oleh Paul Krill.

  Pembicaraan yang menarik

• [Boom, Promises/A+ Was Born](http://youtu.be/V2Q13hzTGmA) oleh Domenic Denicola (JSConfUS 2013)
• [Redemption from Callback Hell](http://youtu.be/hf1T_AONQJU) oleh Michael Jackson dan Domenic Denicola (HTML5DevConf 2013)

• [JavaScript Promises](https://youtu.be/oa2clhsYIDY) oleh David M. Lee (Nodevember 2014) PEMBARUAN (2016)

  Ada sintaks baru dalam ECMA-262, Edisi ke-6, Bagian 14.2 yang disebut arrow functions yang dapat digunakan untuk lebih menyederhanakan contoh di atas. Menggunakan API jQuery, bukannya:

promise.success(function (data) {
  alert(data);
});

Anda dapat menulis:

promise.success(data => alert(data));

atau menggunakan Promises/A+ API:

promise.then(data => alert(data));

Ingatlah untuk selalu menggunakan penangan penolakan baik dengan:

promise.then(data => alert(data), error => alert(error));

atau dengan:

promise.then(data => alert(data)).catch(error => alert(error));

Lihat jawaban ini untuk melihat mengapa Anda harus selalu menggunakan penangan penolakan dengan janji:

• https://stackoverflow.com/questions/40920179/should-i-refrain-from-handling-promise-rejection-asynchronously/40921505#40921505 Tentu saja dalam contoh ini Anda bisa menggunakan promise.then(alert) karena Anda hanya memanggil alert dengan argumen yang sama dengan callback Anda, tetapi sintaks panah lebih umum dan memungkinkan Anda menulis hal-hal seperti:

promise.then(data => alert("x is " + data.x));

Belum semua browser mendukung sintaks ini, tetapi ada beberapa kasus tertentu ketika Anda yakin browser apa yang akan digunakan untuk menjalankan kode Anda - misalnya saat menulis Chrome extension, Firefox Add-on, atau aplikasi desktop menggunakan Electron, NW.js, atau AppJS (lihat jawaban ini untuk detailnya). Untuk dukungan fungsi panah, lihat:

• http://caniuse.com/#feat=arrow-functions
• http://kangax.github.io/compat-table/es6/#test-arrow_functions PEMBARUAN (2017)

• Ada sintaks yang lebih baru sekarang yang disebut fungsi async dengan kata kunci await baru yang bukan kode ini:

functionReturningPromise()
    .then(data => console.log('Data:', data))
    .catch(error => console.log('Error:', error));

memungkinkan Anda menulis:

try {
    let data = await functionReturningPromise();
    console.log('Data:', data);
} catch (error) {
    console.log('Error:', error);
}

Anda hanya dapat menggunakannya di dalam fungsi yang dibuat dengan kata kunci async. Untuk info lebih lanjut, lihat:

• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function
• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/await Untuk dukungan di browser, lihat:
• http://caniuse.com/async-functions Untuk dukungan di Node, lihat:
• http://node.green/#ES2017-features-async-functions Di tempat-tempat di mana Anda tidak memiliki dukungan asli untuk async dan await, Anda dapat menggunakan Babel:
• https://babeljs.io/docs/plugins/transform-async-to-generator/ atau dengan sintaks yang sedikit berbeda, pendekatan berbasis generator seperti di co atau Bluebird coroutines:
• https://www.npmjs.com/package/co

• http://bluebirdjs.com/docs/api/promise.coroutine.html Info lebih lanjut

  Beberapa pertanyaan lain tentang promises untuk lebih jelasnya:

• https://stackoverflow.com/questions/40720512/promise-call-separate-from-promise-resolution/40721397#40721397
• Q Promise delay
• Mengembalikan hasil Promise bukan Promise
• Mengekspor modul dari hasil promise
• https://stackoverflow.com/questions/41284107/what-is-wrong-with-promise-resolving/41284674#41284674
• https://stackoverflow.com/questions/40785769/return-value-in-function-from-a-promise-block/40785901#40785901
• https://stackoverflow.com/questions/39764599/how-can-i-return-status-inside-the-promise/39765591#39765591
• https://stackoverflow.com/questions/40920179/should-i-refrain-from-handling-promise-rejection-asynchronously/40921505#40921505
• https://stackoverflow.com/questions/11845328/is-the-deferred-promise-concept-in-javascript-a-new-one-or-is-it-a-traditional-p/11845403#11845403
• https://stackoverflow.com/questions/39659829/how-can-i-chain-these-functions-together-with-promises/39660257#39660257
• https://stackoverflow.com/questions/40643386/promise-all-in-javascript-how-to-get-resolve-value-for-all-promises/40643489#40643489
• Mengapa Promise.all tidak terdefinisi
• https://stackoverflow.com/questions/42071337/function-will-return-null-from-javascript-post-get/42072290#42072290
• https://stackoverflow.com/questions/40515775/use-cancel-inside-a-then-chain-created-by-promisifyall/40515981#40515981
• https://stackoverflow.com/questions/42094764/why-is-it-possible-to-pass-in-a-non-function-parameter-to-promise-then-without/42094874#42094874
• https://stackoverflow.com/questions/15245867/implement-promises-pattern/15246695#15246695
• Janji dan kinerja
• Trouble scraping two URLs with promises
• http.request tidak mengembalikan data bahkan setelah menentukan return pada event 'end'
• https://stackoverflow.com/questions/41567353/async-each-not-iterating-when-using-promises/41567712#41567712
• https://stackoverflow.com/questions/5111695/jquery-jqxhr-cancel-chained-calls-trigger-error-chain/5112734#5112734
• https://stackoverflow.com/questions/39661064/correct-way-of-handling-promisses-and-server-response/39661503#39661503
• Mengembalikan nilai dari pemanggilan fungsi sebelum menyelesaikan semua operasi di dalam fungsi itu sendiri?
• https://stackoverflow.com/questions/40729806/resolving-a-settimeout-inside-api-endpoint/40730062#40730062
• https://stackoverflow.com/questions/40741374/async-wait-for-a-function/40741587#40741587
• https://stackoverflow.com/questions/5150571/javascript-function-that-returns-ajax-call-data/5150650#5150650
• https://stackoverflow.com/questions/40884153/try-catch-blocks-with-async-await/40886720#40886720
• https://stackoverflow.com/questions/5159304/jquery-deferred-not-calling-the-resolve-done-callbacks-in-order/5159765#5159765
• https://stackoverflow.com/questions/12660596/returning-data-from-ajax-results-in-strange-object/12660711#12660711
• https://stackoverflow.com/questions/40523091/javascript-why-is-there-a-spec-for-sync-and-async-modules/40525271#40525271

Satu-satunya cara untuk mengembalikan data dari fungsi tersebut adalah dengan membuat panggilan sinkron, bukan panggilan asinkron, tetapi itu akan membekukan browser saat menunggu respons.

Anda dapat memasukkan fungsi callback yang menangani hasilnya:

function testAjax(handleData) {
  $.ajax({
    url:"getvalue.php",  
    success:function(data) {
      handleData(data); 
    }
  });
}

Panggil seperti ini:

testAjax(function(output){
  // here you use the output
});
// Note: the call won't wait for the result,
// so it will continue with the code here while waiting.

anda dapat menambahkan async pilihan untuk palsu dan kembali di luar ajax call.

function testAjax() {
    var result="";
    $.ajax({
      url:"getvalue.php",
      async: false,  
      success:function(data) {
         result = data; 
      }
   });
   return result;
}

Idk jika kalian soal itu, tapi saya merekomendasikan cara lain untuk melakukannya, dan bekerja :)

    ServiceUtil = ig.Class.extend({
        base_url : 'someurl',

        sendRequest: function(request)
        {
            var url = this.base_url + request;
            var requestVar = new XMLHttpRequest();
            dataGet = false;

            $.ajax({
                url: url,
                async: false,
                type: "get",
                success: function(data){
                    ServiceUtil.objDataReturned = data;
                }
            });
            return ServiceUtil.objDataReturned;                
        }
    })

Jadi ide utama di sini adalah bahwa, dengan menambahkan async: false, maka anda membuat semuanya menunggu sampai data yang diperoleh. Kemudian anda menetapkan ke sebuah variabel statis kelas, dan segala sesuatu yang ajaib bekerja :)

Lihat contoh dokumen jquery: http://api.jquery.com/jQuery.ajax/ (sekitar 2/3 halaman)

Anda mungkin mencari kode berikut:

    $.ajax({
     url: 'ajax/test.html',
     success: function(data) {
     $('.result').html(data);
     alert('Load was performed.');
   }
});

Halaman yang sama...lebih rendah.