Looping through data in Javascript, combining new id's with old.

Question

Many times I'm having to loop through data and add the new to the old, but I can never seem to get it right.. Here's what I have now, basically trying to concatinate together the previous number from the new number, ultimately building a comma delimited string of numbers:

            function showItems(){
            if(prev_numbers == undefined){
                var prev_numbers = '';
            }else{
                prev_numbers = prev_numbers;    
            }

            numbers = Math.floor(Math.random()*101);
            values = numbers +','+ prev_numbers;

                // Here is where some code would be that makes use of comma delimited numbers
                alert(values);  

            prev_numbers = values;

        }

        setInterval(showItems, 1000);

Answer 1

Why not use the Array.join method?

var numbers = [1, 2, 3, 4, 5];
values = numbers.join(',');

It's not clear where the numbers are coming from. Perhaps post a little more code.

It seems like you're storing the history as a comma-delimited string, and adding new numbers to the beginning of the string as they come in.

Generally, it would make more sense to store the numbers as an array of numbers, then use join to build the string for display as needed. You can prepend to the array using unshift:

numbers.unshift(Math.random() * 100);

Actually, I would recommend this even if the id's are strings.

Answer 2

As meder said, you'd need to define prev_numbers outside showItems, or specify them as global by referencing them as a property of window (substitute prev_numbers by window.prev_numbers). That said, harpo's solution is a lot faster if you're splitting the string up again to access the separate numbers. We need to know a bit more about the context as well as your priority (speed? memory? code length? maintainability?).

By the way, this

        if(prev_numbers == undefined){
            var prev_numbers = '';
        }else{
            prev_numbers = prev_numbers;    
        }

is completely useless as far as I know. It might change the internal representation of prev_numbers, but with complicated things like JIT I'm not sure if that still holds. Your application doesn't seem to be interested in that anyway. As far as I can tell, this code can be removed.

Answer 3

What you need to do is to implement the memoize technique, i.e. you need a memoizer function.

Here's what Google came up with for a JS memoize implementation.

Your doing it right, only that your neglecting that functions are implemented as a type in JS--it's a first-class object, so these are completely valid statements:

function a() { };
a.foo = 'bar';
a.hasOwnProperty('foo'); // true
a.foo; // 'bar'

a = function { this.foo = 'bar' }
a.foo; // 'bar'
a['foo']; // 'bar', because objects are implemented as dictionaries

The only thing that you need to change is to set prev_numbers as a property of showItems:

function showItems() {
    // bool check for undefined object properties returns false
    if(!this.prev_numbers)
        this.prev_numbers = '';

    numbers = Math.floor(Math.random()*101);
    this.prev_numbers = numbers + ',' + this.prev_numbers;
}

As to your particular problem of always receiving ReferenceError in your code, I do not know the exact implementation details, but I have observed that accessing undefined globals will raise ReferenceError instead of simply returning undefined, as you'd expect. This is how to properly handle it:

 if (hasOwnProperty('prev_numbers') { ... }
 // equivalent to
 if(window.hasOwnProperty('prev_numbers') { ... }

Take a look at this:

baz; // ReferenceError
hasOwnProperty('baz'); // false
window.hasOwnProperty('baz') //false

baz = 'bar';
hasOwnProperty('baz'); // true
window.hasOwnProperty('baz) // true

An alternative to calling hasOwnProperty is:

foo; // ReferenceError
window.foo // undefined (no ReferenceError raised)

if (!window.foo) 'yay'; // 'yay'
if (window.foo == undefined) 'yay'; // 'yay'