How do I pass the value (not the reference) of a JS variable to a function? [duplicate]

In modern browsers, you can use the let or const keywords to create a block-scoped variable:

for (let i = 0; i < results.length; i++) {  let marker = results[i];  google.maps.event.addListener(marker, 'click', () => change_selection(i));}

In older browsers, you need to create a separate scope that saves the variable in its current state by passing it as a function parameter:

for (var i = 0; i < results.length; i++) {  (function (i) {    marker = results[i];    google.maps.event.addListener(marker, 'click', function() {       change_selection(i);    });   })(i);}

By creating an anonymous function and calling it with the variable as the first argument, you're passing-by-value to the function and creating a closure.

As well as the closures, you can use function.bind:

google.maps.event.addListener(marker, 'click', change_selection.bind(null, i));

passes the value of i in as an argument to the function when called. (null is for binding this, which you don't need in this case.)

function.bind was introduced by the Prototype framework and has been standardised in ECMAScript Fifth Edition. Until browsers all support it natively, you can add your own function.bind support using closures:

if (!('bind' in Function.prototype)) {    Function.prototype.bind= function(owner) {        var that= this;        var args= Array.prototype.slice.call(arguments, 1);        return function() {            return that.apply(owner,                args.length===0? arguments : arguments.length===0? args :                args.concat(Array.prototype.slice.call(arguments, 0))            );        };    };}

closures:

for (var i = 0, l= results.length; i < l; i++) {    marker = results[i];    (function(index){        google.maps.event.addListener(marker, 'click', function() {             change_selection(index);        });     })(i);}

EDIT, 2013:These are now commonly referred to as an IIFE