Impossible de demander la propriété d'objet deux fois en Javascript

Question

Pardonnez-moi pour ce qui pourrait être le code javascript terrible. Ceci est ma première fois d'essayer quelque chose javascript ...

function Tile (window_id, size) 
{ 
    this.window_id = window_id; 
    this.size = size; 
}; 

function Desktop() 
{ 
    this.tiles = []; 
    this.ntiles = function() {return this.tiles.length;}; 
    this.size = function() 
    { 
    var sum = 0; 
    for (i = 0; i < this.ntiles(); i++) {sum += this.tiles[i].size;}; 
    return sum; 
    }; 

    this.addTile = function (tile) 
    { 
    if (this.size() === 1) {return -1;}; 
    this.tiles.push(tile); 
    return 0; 
    }; 
}; 

function Layer() 
{ 
    this.desktops = []; 
    this.ndesktops = function() {return this.desktops.length;}; 

    this.addDesktop = function (desktop) 
    { 
    this.desktops.push(desktop); 
    return 0; 
    }; 

    this.availableDesktopSize = function (size) 
    { 
    for (i = 0; i < this.ndesktops(); i++) 
    { 
     print(this.desktops[i].size()); 
     print('hi'); 
     print(this.desktops[i].size()); 
     print('hihi'); 
     var space = 1.0 - this.desktops[i].size(); 
     print('hihihi'); 
     print(space); 
     print(size); 
     if (space >= size) {return i;}; 
    }; 
    return -1; 
    }; 
}; 

var layer = new Layer(); 

var desktop1 = new Desktop(); 
var desktop2 = new Desktop(); 

var tile = new Tile(100, 0.5); 

desktop1.addTile(tile); 
desktop1.addTile(tile); 
desktop2.addTile(tile); 

layer.addDesktop(desktop1); 
layer.addDesktop(desktop2); 

print(layer.availableDesktopSize(0.51)); 
print(layer.availableDesktopSize(0.49)); 

Je suis en train de faire une méthode pour la classe de couche qui trouve le premier bureau qui a assez d'espace. En essayant d'y parvenir, tout en essayant mon code, j'ai observé que pour une raison quelconque lorsque j'appelle la propriété desktop.size(), j'obtiens la bonne valeur la première fois mais quand je l'appelle une deuxième fois, mon script meurt. C'est la sortie

1 
hi 
TypeError: Result of expression 'this.desktops[i]' [undefined] is not an object. 

Donc, il fait la première impression bien, mais pourquoi ne peut-il pas faire exactement la même fonction une autre fois?

(Si vous avez d'autres conseils pour améliorer mon code, ce serait très utile)

Answer 1

Le problème est que vous utilisez un global i variable dans plusieurs boucles.

Vous appelez une méthode à partir d'une telle boucle, et cette méthode possède sa propre boucle donnant une valeur différente à la même variable i. Donc, quand vous revenez de cet appel je n'est plus le même que précédemment. Solution: déclarez vos variables en tant que variables locales.

for (let i = 0; // ...etc 
// ^^^ 

Answer 2

Utilisez var pour Déclarez votre iterator variables i pour la lier à la portée. Maintenant, vous utilisez un i à portée globale qui cause des problèmes.

Cependant, dans les navigateurs modernes let serait mieux car cela lie la variable à la portée du bloc. Le courant {} empêche la valeur de cette variable d'être utilisée en dehors de ce bloc.

function Tile (window_id, size) 
 
{ 
 
    this.window_id = window_id; 
 
    this.size = size; 
 
}; 
 

 
function Desktop() 
 
{ 
 
    this.tiles = []; 
 
    this.ntiles = function() {return this.tiles.length;}; 
 
    this.size = function() 
 
    { 
 
    var sum = 0; 
 
    for (var i = 0; i < this.ntiles(); i++) {sum += this.tiles[i].size;}; //var i binds i to this function scope. 
 
    return sum; 
 
    }; 
 

 
    this.addTile = function (tile) 
 
    { 
 
    if (this.size() === 1) {return -1;}; 
 
    this.tiles.push(tile); 
 
    return 0; 
 
    }; 
 
}; 
 

 
function Layer() 
 
{ 
 
    this.desktops = []; 
 
    this.ndesktops = function() {return this.desktops.length;}; 
 

 
    this.addDesktop = function (desktop) 
 
    { 
 
    this.desktops.push(desktop); 
 
    return 0; 
 
    }; 
 

 
    this.availableDesktopSize = function (size) 
 
    { 
 

 
    for (var i = 0; i < this.ndesktops(); i++) //var i binds i to this function scope. 
 
    { 
 
     console.log(this.desktops[i].size()); 
 
     console.log('hi'); 
 
     console.log(this.desktops[i].size()); 
 
     console.log('hihi'); 
 
     var space = 1.0 - this.desktops[i].size(); 
 
     console.log('hihihi'); 
 
     console.log(space); 
 
     console.log(size); 
 
     if (space >= size) {return i;}; 
 
    }; 
 
    return -1; 
 
    }; 
 
}; 
 

 
var layer = new Layer(); 
 

 
var desktop1 = new Desktop(); 
 
var desktop2 = new Desktop(); 
 

 
var tile = new Tile(100, 0.5); 
 

 
desktop1.addTile(tile); 
 
desktop1.addTile(tile); 
 
desktop2.addTile(tile); 
 

 
layer.addDesktop(desktop1); 
 
layer.addDesktop(desktop2); 
 

 
console.log(layer.availableDesktopSize(0.51)); 
 
console.log(layer.availableDesktopSize(0.49));

Answer 3

Je ne suis pas positif, mais il semble être la façon dont i est attribué dans votre pour les boucles. dans ce morceau de code

print(this.desktops[i].size()); 
    print('hi'); 
    print(this.desktops[i].size()); 

i est 0 mais est ensuite mis à 2 dans la ligne ci-dessous

for (i = 0; i < this.ntiles(); i++) {sum += this.tiles[i].size;}; 

function Tile (window_id, size) 
 
{ 
 
    this.window_id = window_id; 
 
    this.size = size; 
 
}; 
 

 
function Desktop() 
 
{ 
 
    this.tiles = []; 
 
    this.ntiles = function() {return this.tiles.length;}; 
 
    this.size = function() 
 
    { 
 
    var sum = 0; 
 
    for (i = 0; i < this.ntiles(); i++) {sum += this.tiles[i].size;}; 
 
    return sum; 
 
    }; 
 

 
    this.addTile = function (tile) 
 
    { 
 
    if (this.size() === 1) {return -1;}; 
 
    this.tiles.push(tile); 
 
    return 0; 
 
    }; 
 
}; 
 

 
function Layer() 
 
{ 
 
    this.desktops = []; 
 
    this.ndesktops = function() {return this.desktops.length;}; 
 

 
    this.addDesktop = function (desktop) 
 
    { 
 
    this.desktops.push(desktop); 
 
    return 0; 
 
    }; 
 

 
    this.availableDesktopSize = function (size) 
 
    { 
 
    for (i = 0; i < this.ndesktops(); i++) 
 
    { 
 
     console.log(this.desktops[i].size()); 
 
     console.log(i) 
 
     print('hi'); 
 
     print(this.desktops[i].size()); 
 
     print('hihi'); 
 
     var space = 1.0 - this.desktops[i].size(); 
 
     print('hihihi'); 
 
     print(space); 
 
     print(size); 
 
     if (space >= size) {return i;}; 
 
    }; 
 
    return -1; 
 
    }; 
 
}; 
 

 
var layer = new Layer(); 
 

 
var desktop1 = new Desktop(); 
 
var desktop2 = new Desktop(); 
 

 
var tile = new Tile(100, 0.5); 
 

 
desktop1.addTile(tile); 
 
desktop1.addTile(tile); 
 
desktop2.addTile(tile); 
 

 
layer.addDesktop(desktop1); 
 
layer.addDesktop(desktop2); 
 

 
console.log(layer.availableDesktopSize(0.51)); 
 
console.log(layer.availableDesktopSize(0.49));