もう1つのJavascriptコールバックの問題/例

Question

私はコールバックについてよく読んできましたが、私はclickイベントなどに使用していますが、完全に理解していない状態で使っています。

私は、それぞれ独自のjsページを持つ3つまたは4つのhtmlページを持つ単純なWebアプリケーションを持っています。

私は、必要な各HTMLページによって参照される新しいjsページに配置したいくつかのグローバル関数を持っています。私はこのファイルword_background.jsを使用して、長時間にわたり複数のページで使用される関数を保持しています。

pullLibraryは、word_background.jsに存在する関数で、dbからプルして結果を処理します。

webpageOne.htmlからpullLibraryに電話して、完了していることを確認してから、webpageOne.jsでさらに処理を行います。

webpageOne.jsで私はpullLibraryを呼び出そうとしていますが、完了したら結果をwebpageOne.jsで使用してください。

コードはpullLibrary（word_background.js）を実行しますが、処理を続行するためにwebpageOne.jsに「戻す」ことはありません。

私は続ける、それが完了すると、私はちょうど、（Ajaxの呼び出しなどがあります）pullLibrary機能を実行したいと...私はコールバックにいくつかの重要な、重要な側面が欠落してい

を想定しています私のページ設定。

説明/訂正ありがとうございました。

このコードはwebpageOne.jsである：

pullLibrary(function(){ 
    console.log('Now processing library...'); 
    processLibrary(); 
    updateArrays(); 
    //Do a bunch more stuff 
}); 

----- UPDATE -----

が、私は私の壊れた精神を照らしていると思うコメント...ありがとうこれがどのように機能すべきかについてのモデルです。

pullLibraryはajax関数です。データベースから引き出し、結果を配列とlocalStorageに格納します。

私が期待しているのは、私がpullLibraryを呼び出すことができ、完了したらコールバックコード（この場合は匿名関数）が実行されることです。

function pullLibrary(){ //Values passed from startup() if no data is local 
    //Pull data from database and create basic LIBRARY array for further processing in processLibrary sub 
console.log("Starting to pull library array in background.js..." + "User: " + localStorage.userID + " License: " + localStorage.licType); 

var url1 = baseURL + 'accessComments3.php'; 
var url2 = '&UserID=' + localStorage.userID + '&LicType=' + localStorage.licType; 

//Need global index to produce unique IDs 
var idIndex = 0; 
var index = 0; 

$.ajax({ 
    type: "POST", 
    url: url1, 
    data: url2, 
    // dataType: 'text', 
    dataType: 'json', 
    success: function(result){ 
    // success: function(responseJSON){ 
    arrLibrary = result; //store for use on this page 
    localStorage.library = JSON.stringify(result); //Store for use elsewhere 
    console.log('Saving to global variable: ') + console.log(arrLibrary); 

    //Now mark last update to both sync storage and local storage so access from other browsers will know to pull data from server or just use local arrays (to save resources) 
    var timeStamp = Date.now(); 
    var temp = {}; 
    temp['lastSave'] = timeStamp; 
    // chrome.storage.sync.set(temp, function() { 
     console.log('Settings saved'); 
     localStorage.lastSync = timeStamp; 
     console.log('Last update: ' + localStorage.lastSync); 

    //Store Group List 
     var arrComGroups = $.map(arrLibrary, function(g){return g.commentGroup}); 
     // console.log('List of comment groups array: ') + console.log(arrComGroups); 
     arrComGroups = jQuery.unique(arrComGroups);  //remove dupes 
     // console.log('Unique comment groups array: ') + console.log(arrComGroups); 

     localStorage.groupList = JSON.stringify(arrComGroups); //Store list of Comment Groups 

    //Create individual arrays for each Comment Groups 
     $.each(arrComGroups,function(i,gName){  //Cycle through each group of Comments 
     var arrTempGroup = []; //to hold an array for one comment group 
     arrTempGroup = $.grep(arrLibrary, function (row, i){ 
      return row.commentGroup == gName; 
     }); 

     //Store string version of each Comment Array 
     window.localStorage['group_' + gName] = JSON.stringify(arrTempGroup); 

     console.log('Creating context menu GROUPS: ' + gName); 
     }); 

    // processLibrary(arrLibrary); //We've pulled the array with all comments - now hand off to processor 

    }, //End Success 

    error: function(xhr, status, error) { 
     alert("Unable to load your library from 11trees' server. Check your internet connection?"); 
     // var err = eval("(" + xhr.responseText + ")"); 
     // console.log('Error message: ' + err.Message); 
    } 

}); //End ajax 

}

Answer 1

さて、すべてのインターネット上で投稿を「ここにコールバックがどのように動作するかだ」...しかし、私は最も簡単な例のための透明な例を得ることができませんでしたのトンがあります。

以下は正確ですか？

私たちには、javascriptファイルone.jsとtwo.jsがあります。

one.jsには、apple（）というAjax呼び出しを含む関数があります。

two.jsは、特定のhtmlページを処理してリッスンします。これは、apple（）ajax呼び出しからのデータを必要とします。他のページもapple（）を使用していますので、two.jsに入れることは望ましくありません。

ここで私は今、コールバックを理解する方法は次のとおりです。

one.js：

function apple(callback_function_name){ 

    $.ajax({ 
     type: "POST", 
     url: url1, 
     data: url2, 
     dataType: 'json', 
     success: function(result){ 
      //apple processing of result 
      callback_function_name(); //This is the important part - whatever function was passed from two.js 
     }, //End Success 
     error: function(xhr, status, error) { 
     } 

    }); //End ajax 
} //End apple function 

** two.jsを** これは、ファイル等

$(document).ready(function() { 
    apple(function(apple_callback){ 
     //all kinds of stuff that depends on the ajax call completing 
     //note that we've passed "apple_callback" as the function callback name...which is stored in the apple function as "callback_function_name". 
     //When the ajax call is successful, the callback - in this case, the function in two.js, will be called back...and the additional code will run 
     //So the function apple can be called by all sorts of other functions...as long as they include a function name that is passed. Like apple(anothercallback){} and apple(thirdcallback){} 
    }); //End apple function 
});  //End Document.Ready 

をリスナーのすべての種類を持っているJS