Adăugarea unei noi achiziții în calculatorul de produse

Pentru început, să facem astfel încât la apăsarea butonului în tabel să fie adăugat un nou rând cu achiziția:

add.addEventListener('click', function() {
	let tr = document.createElement('tr');
	
	let td;
	
	td = document.createElement('td');
	td.textContent = name.value;
	td.classList.add('name');
	tr.appendChild(td);
	
	td = document.createElement('td');
	td.textContent = price.value;
	td.classList.add('price');
	tr.appendChild(td);
	
	td = document.createElement('td');
	td.textContent = amount.value;
	td.classList.add('amount');
	tr.appendChild(td);
	
	td = document.createElement('td');
	td.textContent = price.value * amount.value;
	td.classList.add('cost');
	tr.appendChild(td);
	
	td = document.createElement('td');
	td.textContent = 'șterge';
	td.classList.add('remove');
	tr.appendChild(td);
	
	table.appendChild(tr);
});

Soluția pe care am prezentat-o, totuși, are probleme evidente cu duplicarea codului: practic pentru fiecare celulă scriem același cod.

Ar fi oportun să avem o anumită funcție pentru crearea celulei tabelului. Fie că această funcție primește ca prim parametru o referință la rândul tabelului, ca al doilea parametru - textul celulei tabelului, iar ca al treilea - numele clasei CSS a celulei:

function createCell(tr, value, name) {
	
}

Având o astfel de funcție am putea rescrie codul de mai sus în felul următor:

add.addEventListener('click', function() {
	let tr = document.createElement('tr');
	
	createCell(tr, name.value, 'name');
	createCell(tr, price.value, 'price');
	createCell(tr, amount.value, 'amount');
	createCell(tr, price.value * amount.value, 'cost');
	createCell(tr, 'șterge', 'remove');
	
	table.appendChild(tr);
});

Implementați funcția descrisă de mine createCell.

Copiați codul meu pentru adăugarea unei noi achiziții. Testați adăugarea unei noi achiziții în tabel.

Modificați funcția createCell astfel, încât să returneze prin return celula tabelului creată.