2016-03-19 7 views
0

Hier ist ein Beispiel für einen Getter, der über ein Array iteriert und erwartet, dass ein Element zurückgegeben wird, für das atrue ist. Aber test.active gibt undefined zurück.Warum kehrt dieser Getter undefiniert zurück?

var test = { 
    arr: [ 
    {id: 1, a: false}, 
    {id: 2, a: false}, 
    {id: 3, a: true}, 
    {id: 4, a: false}, 
    {id: 5, a: false}, 
    ], 
    get active() { 
    this.arr.forEach(item => { 
     if(item.a) return item 
    }) 
    } 
} 

Warum?

+0

[ 'find'] (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find) ist die richtige Methode, um hier benutzen. 'return this.arr.find (item => item.a);' –

+0

was ist, wenn mehr als ein Element 'a === true' hat? –

Antwort

2

Ihre return-Anweisung befindet sich in einer inneren-Funktion, wodurch diese Funktion zurückkehrt. Deine äußere Funktion gibt tatsächlich nichts zurück.

Wenn die äußere Funktion zurückgegeben werden soll, verwenden Sie stattdessen eine normale for-Schleife.

var test = { 
 
    arr: [ 
 
    {id: 1, a: false}, 
 
    {id: 2, a: false}, 
 
    {id: 3, a: true}, 
 
    {id: 4, a: false}, 
 
    {id: 5, a: false}, 
 
    ], 
 
    get active() { 
 
    for (var i = 0, e = this.arr.length; i < e; i++) { 
 
     var item = this.arr[i]; 
 
     if (item.a) return item; 
 
    } 
 
    } 
 
} 
 

 
console.log(test.active);

Es könnte, wenn Sie helfen forEach Arbeiten verstanden, wie.

Intern sieht es sehr ähnlich dem folgenden, obwohl dies sehr vereinfacht ist.

function forEach (array, block) { 
 
    var i, length = array.length; 
 
    
 
    for (i = 0; i < length; i++) { 
 
    // This is where your return would end up, unused, in a different context. 
 
    block(array[i], i); 
 
    } 
 
} 
 

 

 
forEach(['a', 'b', 'c', 'd'], item => { 
 
    return 'is meaningless here'; 
 
});

0

Alternativ können Sie Array.prototype.find() Funktion für einen bestimmten Zustand zu prüfen und das gefundene Element zurückzukehren.

var test = { 
    arr: [ 
    {id: 1, a: false}, 
    {id: 2, a: false}, 
    {id: 3, a: true}, 
    {id: 4, a: false}, 
    {id: 5, a: false}, 
    ], 
    get active() { 
    return this.arr.find(item => { 
     return (item.a === true); 
    }); 
    } 
} 

alert(test.active.id) 

https://jsfiddle.net/arqxcbkv/1/