i'm new javascript , have ptoblem code looks this:
function job1() { var subtext1=""; var subtext2=""; var text=""; var vocabulary = "abcdefghijklmnopqrstuvwxyz abcdefghijklmnopqrstuvwxyz0123456789"; // use delay function create full text in 20 * 150 milliseconds var = 0, action = function() { var temp = vocabulary.charat(math.floor(math.random() * vocabulary.length)); text+= temp; document.write(text + "<br>"); i++; if (i < 20) { settimeout(action, 150); } else { // first subtext position 0 until random number random between 0 , text length subtext1 = text.slice(0, math.floor(math.random() * text.length)); // second subtext first subtext ends until last character form text input subtext2 = text.slice(subtext1.length, text.length); // output of subtext1 , subtext2 first time document.write("subtext1: " + subtext1 + "<br>"); document.write("subtext2: " + subtext2 + "<br>"); document.write("text: " + text + "<br>"); } }; settimeout(action, 0); // output of subtext1 , subtext2 once more document.write("subtext1: " + subtext1 + "<br>"); document.write("subtext2: " + subtext2 + "<br>"); // nextjob: job2, job3 // job dependency var nextjob = "job2, job3"; var prevjob = "null"; // results return { subtext1_rt : subtext1, subtext2_rt : subtext2 }; } my problem need subtext1 , subtext2 action = function().... section section:
return { subtext1_rt : subtext1, subtext2_rt : subtext2 }; but subtext1 , subtext2 variables empty.
here fiddle code: http://jsfiddle.net/talgoz/4tgc372e/
it looks parts of job1() function executed before action = function() part. important working function inside function, can’t separate functions purpose of goal.
i hope here can me see problem , solve it.
edit: final processing of text values needs in callback function because of way javascript works -- single threaded, meaning 1 piece of code runs @ time. looking @ original code, execution first goes job1(). builds action() function without executing it , them moves on settimeout(), sets action() run doesn't run yet. settimeout() execute, time value 0, current code has finish executing. next moves on end code in job1() document.write, job1/job3, , returning object. since action() has not yet executed, subtext objects not yet set.
once control has left job1(), , finished current code, browser start executing action() settimeout() call. inside action() there other settimeout calls, , behave -- current code must finish executing, there's wait, , code specified execute.
so in summary, must use callback function because execution must finish current code before code queued settimeout() execute. can't take asynchronous function job1() , make synchronous because none of async settimeout() calls can possibly execute while you're inside job1().
in other languages, c++ or java, can make code run in parallel, can spawn code in "background thread" , current thread can wait finish, giving effect want. cannot javascript. async functions require callback. callback literally means, "call me when you're done". in future, there web workers may support multiple pieces of code running @ time: web workers
here example using callback whendone, referenced below. gets called when values have been set.
function job1(whendone) { var subtext1=""; var subtext2=""; var text=""; var vocabulary = "abcdefghijklmnopqrstuvwxyz abcdefghijklmnopqrstuvwxyz0123456789"; // use delay function create full text in 20 * 150 milliseconds var = 0, action = function() { var temp = vocabulary.charat(math.floor(math.random() * vocabulary.length)); text+= temp; document.write(text + "<br>"); i++; if (i < 20) { settimeout(action, 150); } else { // first subtext position 0 until random number random between 0 , text length subtext1 = text.slice(0, math.floor(math.random() * text.length)); // second subtext first subtext ends until last character form text input subtext2 = text.slice(subtext1.length, text.length); // output of subtext1 , subtext2 first time document.write("subtext1: " + subtext1 + "<br>"); document.write("subtext2: " + subtext2 + "<br>"); document.write("text: " + text + "<br>"); // we're done whendone(subtext1, subtext2); } }; settimeout(action, 0); } job1(function(subtext1, subtext2) { // output of subtext1 , subtext2 once more document.write("subtext1: " + subtext1 + "<br>"); document.write("subtext2: " + subtext2 + "<br>"); // nextjob: job2, job3 // job dependency var nextjob = "job2, job3"; var prevjob = "null"; // results var returned = { subtext1_rt : subtext1, subtext2_rt : subtext2 }; // code doing 'returned' here }); the value want ends in returned. if want value, add code after returned = statement.
Comments
Post a Comment