D3.queue - понимание потока программы

Question

Я стараюсь действительно понять поток программы для d3.queue.

Я подготовил следующий пример.

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

На данный момент у меня есть следующие:

var finished = function(error, results) { 
console.log(results); 
}; 

var fn_1 = function(i, callback) { 
console.log("fn_ 1 called with this argument " +i); 
callback(null, "from function 1"); 
}; 


d3.queue(1) 
    .defer(function(url, callback) { 
    d3.csv(url, function(data) { 
    test_data = data.map(function(d) { return fn_parse_m_tot(d);}); 
    callback(null, "hi there in first function"); 
    }); 

}, url) 

.defer(fn_1, "arg1") 
.await(finished); 

Я ожидаю следующие результаты, когда функция закончена() выполняет:

"привет там в первой функции"

" от функции 1 "

Но я получаю только следующее:

«Привет в первой функции»

Обратный вызов, встроенный в fn_1(), кажется, не выполняет ...?

Answer 1

Первый аргумент в .defer - это асинхронная задача (т. Е. Функция). Все последующие аргументы являются (необязательными) аргументами для этой задачи. Для вашей первой задачи требуется URL-адрес и обратный вызов, поэтому вы должны предоставить их, иначе они не будут определены в теле вашей задачи.

Вы могли бы объявить вашу задачу fn_0 первыми:

var fn_0 = function(url, callback) { 
    console.log('fn_0 (url: ' + url + '; callback: ' + callback + ')'); 
    d3.csv(url, function(error, data) { 
    if (error) { 
     console.log('d3.csv was called but there was an error downloading the data'); 
     throw error; 
    }; 
    test_data = data.map(function(d) { return fn_parse_m_tot(d); }); 
    callback(null, "from fn_0"); 
    }); 
}; 

fn_1 является еще одной задачей для очереди. Вам здесь ничего не нужно менять.

fn_2 Ваш обратный вызов:

var fn_2 = function(a, b) { 
    console.log('fn_2 (a: ' + a + '; b: ' + b + ')'); 
}; 

Теперь код в очереди гораздо более удобным для чтения:

d3.queue() 
    .defer(fn_0, 'url-to-your-csv-file', fn_2) 
    .defer(fn_1, 'arg1', fn_2) 
    .await(finished); 

Вот JSFiddle. Обратите внимание, что если вы напишете d3.queue(1), все ваши задачи будут запускаться последовательно, поэтому задача будет выполняться только в том случае, если все предыдущие задачи будут успешными.

См. d3-queue API documentation.