(Angular 5) - Почему for of typescript принимает только последнее число
Я работаю с angular 5, и у меня есть два массива внутри моего компонента:
Массив данных
data = [{...},{...}]
Массив чисел
inputData = [{1,2,3},{4,5,6}]
поэтому проблема в том, что я хочу изменить некоторые значения внутри массива data на значения внутри inputData.
Для этого я использую итератор следующим образом:
for (let x in this.data) {
this.result = this.data[x].ranges;
for (let y in this.result) {
for (let z of this.inputData) {
this.data[x].ranges[y].ph = z;
}
}
}
Проблема в том, что итератор for выполняет все операции по изменению этих значений, но когда я помещаю console.info(data), массив данных имеет только последнее значение (3) inputData:
[
{ "name": "Low", "ph": 3, "day": 0 }, <- Check the ph value
{ "name": "Medium", "ph": 3, "day": 0 }, <- Check the ph value
{ "name": "High", "ph": 3, "day": 0 } <- Check the ph value
]
Я создал stackblitz, чтобы показать проблему при выполнении (Ссылка на stackblitz)
Ответы 2
Измените in на of.
'of' выполняет итерацию по объектам, таким как массив.
'in' выполняет итерацию по свойствам объекта.
Вот два примера:
Кроме того, я посмотрел на ваш stackblitz ... логика не совсем правильная. Попробуй это:
constructor() {
for (let x of this.data) {
this.result = x.ranges;
for (let y in this.result) {
this.result[y].ph = this.inputValues[y];
}
}
}
Вот форк вашего stackblitz: https://stackblitz.com/edit/angular-ckdrqe?file=src/app/app.component.ts
Ваш исходный код:
for (let x in this.data) {
this.result = this.data[x].ranges;
for (let y in this.result) {
for (let z of this.inputValues) {
this.data[x].ranges[y].ph = z;
}
}
}
Первый цикл перебирает данные по индексу. Это намного проще сделать по значению, как показано в моей копии вашего кода выше.
Второй цикл перебирает все результаты по индексу ... затем для каждого результата он обновляет .phнесколько раз, потому что в этом цикле вы просматриваете все inputValues. Вот почему всегда получается последнее значение.
Есть разница между forin и for в javascript / typescript. forin - это не то же самое, что, скажем, foreach на C# или PHP.
let myObject = {a: 1, b: 2, c: 3};
for(let keys in myObject) {
// goes through all the keys of an object (i.e. a,b,c)
}
let myArray = [1,2,3];
for(let i = 0; i < myArray.length; i++) {
// goes through the indexes of an enumerable array (i.e. 0,1,2)
}
// Alternatively, you could also use
myArray.forEach((value, index, array) => {
// lists all the values
}
Просто кажется, что вы еще не до конца понимаете forin. Пойдите, проверьте документ:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...in
https://www.w3schools.com/js/js_loop_for.asp
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach
Я внес некоторые изменения в stackblitz. Вы можете проверить это?
Ах да и
forofdeveloper.mozilla.org/en-US/docs/Web/JavaScript/Reference/…