Add event listener to JavaScript object

Question

I'm getting back an array of JavaScript objects from a database. I'm looping through that array and creating objects to be displayed on the screen. I'm trying to use .addEventListener() to each object but I just realized that addEventListener() only works for DOM objects.

How could I add an event listener to each JavaScript object?

Here is my code:

    var objects = JSON.parse(data.responseText);
    var i;
    var objectLn = objects.length;

    for (i = 0; i < objectLn; i++) {

        //Puts each object into a variable
        var eachObject = objects[i];

        //Establishes pin position
        var pinPos = {
            lat: parseFloat(eachObject.lat),
            lng: parseFloat(eachObject.lng)
        };

        //Creates new icon for pin
        var icon = {
            url: "path/to/img",
            scaledSize: new google.maps.Size(60, 60),
            origin: null,
            anchor: null
        };

        //Creates a new pin from pulled information
        var pin = new google.maps.Marker({
            position: pinPos,
            map: map,
            icon: icon
        });

        //Alerts each object on click
        pin.addListener('click', function() {
            alert(JSON.stringify(eachObject));
            map.panTo(pinPos);
            map.setCenter(pinPos);
        });
    }

addListener is adding a 'click' listener to each pin that is dropped, so that's good. The problem is that it's supposed to alert each object, but it's only alerting the last object I retrieve from the database on every pin I click.

How are you displaying these objects on screen if not using the DOM? — MinusFour
– MinusFour, Commented Feb 29, 2016 at 20:11
you can't click on an object. so it doesn't make much sense to add a click event to one. — user400654
– user400654, Commented Feb 29, 2016 at 20:16
eachObject is being overridden on each iteration, for loops don't have their own scope (unless using es2015 let and const) the array forEach method would be more suitable than a for loop. — user400654
– user400654, Commented Feb 29, 2016 at 20:45

I wrestled a bear once. · Accepted Answer · 2016-02-29 20:54:48Z

1

try doing your loopage like so..

for (i = 0; i < objectLn; i++) {
    (function(eachObject){
        // copy the loop contents here. eachObject is already defined.
    })(objects[i]);
}

answered Feb 29, 2016 at 20:54

I wrestled a bear once.

23.5k20 gold badges74 silver badges122 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Add event listener to JavaScript object

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related