JavaScript-ზე მასივიდან HTML ცხრილის შექმნა

დავუშვათ, გვაქვს ცარიელი ცხრილი:

<table id="table"></table>

ასევე დავუშვათ, მოცემულია ორგანზომილებიანი მასივი, მაგალითად, ასეთი:

let arr = [[1, 2, 3, 4], [5, 6, 7, 8], [9, 10, 11, 12]];

მოდით, ამ მასივის საფუძველზე შევქმნათ HTML ცხრილი, რომელიც სავსე იქნება მოცემული მასივის ელემენტებით. ანუ, მივიღებთ ცხრილს სამი მწკრივით, რომელთაგან თითოეულში იქნება 4 უჯრა.

ამოვხსნათ ამოცანა ორი ჩადგმული ციკლის for-of გამოყენებით:

let arr = [[1, 2, 3, 4], [5, 6, 7, 8], [9, 10, 11, 12]];
let table = document.querySelector('#table');

for (let subArr of arr) {
	let tr = document.createElement('tr');
	
	for (let elem of subArr) {
		let td = document.createElement('td');
		td.textContent = elem;
		tr.appendChild(td);
	}
	
	table.appendChild(tr);
}

როგორც ხედავთ, ჩვენი ამოხსნა უნივერსალური აღმოჩნდა და არ არის დამოკიდებული ქვემასივების რაოდენობაზე და ელემენტების რაოდენობაზე თითოეულ ქვემასივში. ერთადერთი პირობა - რომ ქვემასივებში იყოს ელემენტების ერთნაირი რაოდენობა.

მოცემულია მასივი:

let arr = [[1, 2, 3], [4, 5, 6], [7, 8, 9], [10, 11, 12]];

გაკვეთილის თეორიულ ნაწილში ჩახედვის გარეშე, გამოიტანეთ მოცემული მასივის ელემენტები HTML ცხრილის table სახით.

შეცვალეთ წინა ამოცანა ისე, რომ ცხრილში ჩაიწეროს არა ელემენტები, არამედ ამ ელემენტების კვადრატები.