Почему выводит [object Object]?

Question

Вот часть кода в которой содержится функция.

Answer 1

У вас проблема в коде filter. dbOperation.reduce даже не вызывается. Исправьте на

const resultIncome = dbOperation.filter(item => item.amount > 0).reduce((acc,item)=> acc + item.amount,0)

Либо сразу

const resultIncome = dbOperation.reduce((acc,item)=> acc + item.amount >0? item.amount:0,0)

Аналогичная проблема с Expences

Answer 2

Потому что во время присваивания elem.textContent = x, этот x автоматически будет превращен в строку. А когда пытаются сделать строку из объекта, вызывается его встроенный метод .toString(), который приводит к такому результату.

console.log( {}.toString() ); // [object Object]
// Объект: Возвращает строку "[object название_конструктора]"

console.log( [1, 2, 3].toString() ) // "1,2,3"
// Массив: Превращает свои элементы в строку, расставляя между ними запятые.

// Комбо:
console.log( "" + [{}, {}, {}] ); // [object Object],[object Object],[object Object]

Если нужно выводить массив объектов в читаемом для пользователя виде, собирайте необходимую строку вручную:

let test = [
  { item: 1, amount: 100 },
  { item: 2, amount: 200 },
  { item: 3, amount: 300 },
];

let str = test.map(obj => `> item: ${obj.item} || amount: ${obj.amount}`).join("\n");

document.getElementById("pre").textContent = str;

<pre id="pre"></pre>

Или используйте JSON.stringify:

let test = [
  { item: 1, amount: 100 },
  { item: 2, amount: 200 },
  { item: 3, amount: 300 },
];

function showData(data) {
  return JSON.stringify(data, null, 2);
}

document.getElementById("pre").textContent = showData(test);

<pre id="pre"></pre>

Два подхода можно комбинировать в разных вариациях.

БЛОГ НА HUSL

Почему выводит [object Object]?

Ответы (2 шт):