javascript - how to process functions in order not all at once

Question

I have the following issue:

Let's say that I have a function that process an array to do something with it depending on received parameters. So something like:

 var arr = [];

 function processArr(p1, p2, ....){};

p1, p2 etc are received from the server so we get to:

processArr(<?php echo $p1; ?>, <?php echo $p2; ?>, ...)
processArr(<?php echo $p1; ?>, <?php echo $p2; ?>, ...)
processArr(<?php echo $p1; ?>, <?php echo $p2; ?>, ...)
processArr(<?php echo $p1; ?>, <?php echo $p2; ?>, ...)
processArr(<?php echo $p1; ?>, <?php echo $p2; ?>, ...)

It is actually a php for but doesn't really matter.

Problem: js process the calls simultaneously (not exactly simultaneously but close enough) instead of one after the other. So if in first call I add an element to the array (then some other processing) and in second call I try to delete the element, at delete the element doesn't exist because it wasn't added yet.

How do I make second call to wait for the first to finish?

Added function:

    function processSaved(act, params)
    {
        if (act == 1)
        {
            var newUser = params;
            if (user.id == newUser.id)
                user = clone(newUser);
            activeElementIndex = i;
            // Go to the next level from the active element level
            var newLevel = newUser.level;

            // Set current level
            currentLevel = Math.max(currentLevel, newLevel);

            // Create new object and push it to elements array
            var obj = newUser;
            elements.push(obj);
            activeElementIndex = newUser.parent;
            // Add element to order list
            if (orderElements.length + 1 > newLevel)
            {
                var added = 0;
                for (var i = 0; i < orderElements[newLevel - 1].el.length; i++)
                {
                    if (elements[activeElementIndex].column < elements[elements[orderElements[newLevel - 1].el[i]].parent].column)
                    {
                        orderElements[newLevel - 1].el.splice(i, 0, elements.length - 1);
                        added = 1;
                        break;
                    }
                }

                if (added == 0)
                    orderElements[newLevel - 1].el.push(elements.length - 1);
            }
            else
            {
                var tmp = new Array();
                tmp.push(elements.length - 1);
                var obj = {"el": tmp};
                orderElements[newLevel - 1] = obj;
            }

            flagCreate = 1;
            actions.push(newUser);
            // Call the rearange function
            rearangeElementsWithoutRedraw();
        }
        else if (act == 0)
        {
            activeElementIndex = params.index;
            deleteNode();
        }

        return true;                                                
    }

First call is made with act = 1. Second is made with act = 0. If I add a timeout to the second call with let's say 0.5 seconds everything works fine. If not I get error at removal because element does not exist. This suggests that the second call is made before first finished.

No, it does not. Or does processArr do some asynchronous operations? — Bergi, May 15 '12 at 10:28
Looks like the problem is probably with your processArr code, what are you trying to do there? — Naama Katiee, May 15 '12 at 10:29
Please create a minimal example on JSFiddle where the error occurs. — ThiefMaster, May 15 '12 at 10:38

score 2 · Accepted Answer · edited May 15 '12 at 10:29

2

JS does not call functions in parallel. Your processArr functions are executed sequentially.

This obviously assumes that you do not simply start e.g. an AJAX request in the function - if you do the next function will obviously not wait for the request to finish (until it's synchronous).

edited May 15 '12 at 10:29

Bergi

630,263
148
957
1,375

answered May 15 '12 at 10:27

ThiefMaster

310,957
84
592
636

Added function. Note: No ajax requests, all called functions are defined in same script, no resistivity... don't know what details to add :D – zozo May 15 '12 at 10:34

score 0 · Answer 2 · answered May 15 '12 at 11:31

0

Found the problem. There was an asynchronous call made by a library I was using (raphaeljs). Srry for loss of time :).

answered May 15 '12 at 11:31

zozo

8,230
19
79
134

javascript - how to process functions in order not all at once

2 Answers2