[lnkForumImage]
TotalShareware - Download Free Software
Confronta i prezzi di migliaia di prodotti.
Asp Forum
 Home | Login | Register | Search 


 

Forums >

comp.lang.javascript

Object.observe and Array

Une Bévue

1/11/2015 10:16:00 AM

say, I've an Object :

var org_ytho_controller = Object.create(null);
with the 'categories' attribute :
org_ytho_controller.categories = 'Android BIOS CSS'.split(' ');

and I observe this Object by:
var org_ytho_controllerChanges = function(changes) {
document.getElementById('log').innerHTML += "changes.length
= " + changes.length + "" + "\n";
changes.forEach(function(change) {
var txt = "change.type = '" + change.type + "', ";
txt += "change.name = '" + change.name + "', ";
txt += "change.oldValue = '" + change.oldValue + "'";
document.getElementById('log').innerHTML += txt + "\n";
});
console.log("changes:");
console.dir(changes);
}
Object.observe(org_ytho_controller, org_ytho_controllerChanges);

(Notice the element with id "log" is a pre one.)

when the changes are done like that :

org_ytho_controller.categories[org_ytho_controller.categories.length] =
'Another Category';

org_ytho_controllerChanges(changes) report nothing.

then i thought, this is because org_ytho_controller.categories is still
an Array, the no change.

However changing like that :

var a = org_ytho_controller.categories;
org_ytho_controller.categories = null;
a[a.length] = 'Another Category';
org_ytho_controller.categories = a;

Then, org_ytho_controllerChanges(changes) report 2 changes :
change.type = 'update', change.name = 'categories', change.oldValue =
'Android BIOS CSS Another Category'
change.type = 'update', change.name = 'categories', change.oldValue = 'null'

the NEW value 'Android BIOS CSS Another Category' coming as an oldValue ???

may be the sole workaround could be to add a length property :

org_ytho_controller.categoriesLength =
org_ytho_controller.categories.length;
and update it each time org_ytho_controller.categories is updated :
org_ytho_controller.categories[org_ytho_controller.categories.length] =
'Another Category';
org_ytho_controller.categoriesLength =
org_ytho_controller.categories.length;

BUT the Array could be changed without affecting the number of
categories, for example:
org_ytho_controller.categories[1] = 'SBIOS'; // BIOS -o-> SBIOS
org_ytho_controller.categoriesLength =
org_ytho_controller.categories.length; // no change here...
2 Answers

Une Bévue

1/11/2015 3:54:00 PM

0

Le 11/01/15 11:15, Une Bévue a écrit :
> when the changes are done like that :
>
> org_ytho_controller.categories[org_ytho_controller.categories.length] =
> 'Another Category';
>
> org_ytho_controllerChanges(changes) report nothing.


If, instead of previous, I do :
var a = 'Android BIOS CSS'.split(' ');
a[a.length] = 'Dell Latitude d620';
a[a.length] = 'FreeBox';
a[a.length] = 'HackIntosh';
a[a.length] = 'ImageMagick';
a[a.length] = 'JavaSCript et DOM';
org_ytho_controller.categories = a;

the changes are detected.

with :
var a = org_ytho_controller.categories;
a[a.length] = 'Dell Latitude d620';
a[a.length] = 'FreeBox';
a[a.length] = 'HackIntosh';
a[a.length] = 'ImageMagick';
a[a.length] = 'JavaSCript et DOM';
org_ytho_controller.categories = a;

the changes aren't detected, i suppose this is because in the latest
case the pointer didn't change.

Une Bévue

1/13/2015 8:54:00 AM

0

The solution is given here :
<http://www.html5rocks.com/en/tutorials/es7/ob...
scroll down to "Observing arrays" giving :
Array.observe(model, function(changeRecords) {
count++;
console.log('Array observe', changeRecords, count);
});