Предотвращение ленивой оценки в функции, вызванной fabric.js

Question

Этот ответ дает полезное объяснение того, как добавить «ссылку» (действительно, событие, перенаправляющее URL) к определенному объекту, а не ко всем объектам на холсте :

How to add URL to an image in Fabric.js?

Однако при размещении внутри цикла, который генерирует несколько объектов, она связывает только последний объект, созданный своей стоимости.

Вот пример:

for (var p = 0; p<2; p++) { 
    var object = new fabric.Circle({ radius: 10, top: 10 + 20 * p, left: 10 }); 
    object.on('selected', function() { 
    window.location.href = "mylink" + "/" + p; 
    }) 
    canvas.add(object); 
} 

Это будет иметь оба объекта, ссылающихся на «MyLink/1», когда то, что я хочу, это первый объект для ссылки на «MyLink/0», а второй для связи на «mylink/1».

Мои навыки работы с Javascript застряли в 1999 году, но это выглядит как ленивая проблема загрузки. Как заставить объект, созданный из каждого цикла, иметь свою собственную функцию?

Answer 1

Это похоже на ленивую оценку/закрытие.

Используя этот красивый ответ (Javascript: Creating Functions in a For Loop), я смог обработать решение. Проводя здесь в надежде, это будет полезно для других. См. Связанный ответ, почему он работает.

var fxnArr = []; 
    for(var p = 0; p < rows.length; p++) { 
    fxnArr[fxnArr.length] = (function(val) { return function(){ 
     window.location.href = "mylink" + "/" + val; 
    } })(p); 
    } 
    for (var p = 0; p<2; p++) { 
    var object = new fabric.Circle({ radius: 10, top: 10 + 20 * p, left: 10 }); 
    object.on('selected', fxnArr[p]); 
    canvas.add(object); 
    }