JavaScript的then函數用法是很常見的,它是Promise對象的一個方法,用于處理異步操作的結果。當我們使用異步操作時,通常需要進行一些數據的處理或操作,這時就需要用到then函數。
比如,我們通過fetch函數獲取一個JSON格式的數據:
fetch('https://example.com/api/data.json') .then(response => response.json()) .then(data => console.log(data))我們可以看到,fetch函數返回一個Promise對象,而then函數則在Promise對象中的resolve狀態被觸發后執行,將返回的數據轉成JSON格式并輸出到控制臺中。 另一個常見的例子是在AJAX請求中使用then函數:
$.ajax({ url: 'https://example.com/api/getdata.php', dataType: 'json' }) .done(function(data) { console.log(data); }) .fail(function(error) { console.log(error); })在這個例子中,我們使用jQuery的$.ajax函數發送請求獲取JSON數據,如果請求成功則使用done函數處理返回的數據,如果請求失敗則使用fail函數處理錯誤信息。 除了上面的示例外,then函數還有其他一些常見的用法: 1. 處理異步操作的結果和異常
const promise = new Promise((resolve, reject) => { setTimeout(() => { resolve('success'); // reject('error'); }, 1000); }); promise.then( result => console.log(result), error => console.log(error) );在這個例子中,我們使用Promise對象創建一個異步操作,通過setTimeout模擬一個1秒鐘的延遲后,根據傳入的參數resolve或reject來觸發Promise的resolve或reject狀態。在使用then函數時,我們可以傳入兩個函數作為參數,一個用于處理resolve狀態,一個用于處理reject狀態,以處理異步操作的結果和異常。 2. 實現函數的鏈式調用
const wait = ms => { return new Promise(resolve => setTimeout(resolve, ms)); }; wait(1000) .then(() => { console.log('Hello'); return wait(1000); }) .then(() => { console.log('World'); });在這個例子中,我們使用wait函數返回一個Promise對象,使得代碼可以暫停1秒鐘后再執行下一步操作,然后使用then函數實現函數之間的鏈式調用,使得代碼可以按順序執行。 總結起來,then函數是Promise對象的一個方法,用于處理異步操作的結果以及異常情況,常見的用法包括處理返回數據、處理錯誤信息、鏈式調用等。因此,掌握then函數的用法是非常重要的。