Referencias en javascript


Un caso de referencia incorrecta, sacado de aquí:

function addLinks () {
for (var i=0, link; i<5; i++) {
link = document.createElement("a");
link.innerHTML = "Link " + i;
link.onclick = function () {
alert(i);
};
document.body.appendChild(link);
}
}
window.onload = addLinks;

Clickando en cualquiera de los links siempre se referirá a Link5 ya que el onclick no se ejecuta.

Para solucionarlo, debemos crear una closure en el onclick para que tome el valor de i en ese momento:

function addLinks () {
for (var i=0, link; i<5; i++) {
link = document.createElement("a");
link.innerHTML = "Link " + i;
link.onclick = function (num) {
return function () {
alert(num);
};
}(i);
document.body.appendChild(link);
}
}
window.onload = addLinks;