povtorniy-repeating-ui/таблица|table.js

Таблица = function(id)
{
    this.задатьЗаголовки = (заголовки) =>
    {
        this.заголовки = заголовки;
        this.__пересобрать();
    };

    this.задатьСтроки = (строки) =>
    {
        this.строки = строки;
        this.__пересобрать();
    };
    
    this.элемент = (номер) =>
    {
        return $(`#${id}-${номер}`);
    };

    this.__пересобрать = () =>
    {
        this.__задатьСодержимое();
        this.__отслеживатьВыбор();
    };

    this.__задатьСодержимое = () =>
    {
        var содержимое = "";
        if (this.заголовки && this.заголовки.length)
        {
            var заголовок = "";
            for (var номер in this.заголовки)
            {
                var значение = this.заголовки[номер];
                заголовок += `<th>${значение}</th>`
            }
            содержимое += `
<thead>
    <tr>
        ${заголовок}
    </tr>
</thead>
            `;
        }
        
        if (this.строки && this.строки.length)
        {
            var тело = "";
            for (var номер in this.строки)
            {
                var столбцы = this.строки[номер];
                var строка = "";
                for (var н in столбцы)
                {
                    var значение = столбцы[н];
                    строка += `<td>${значение}</td>`;
                }
                тело += `<tr id="${id}-${номер}">${строка}</tr>`;
            }
            содержимое += `<tbody>${тело}</tbody>`;
        }
        
        $(`#${id}`).html(содержимое);
    };
    
    this.__отслеживатьВыбор = () =>
    {
        if (!(this.строки && this.строки.length))
        {
            return;
        }
        var тут = this;
        for (var номер in this.строки)
        {
            const номерСтроки = номер;
            $(`#${id}-${номер}`).click(function() {
                if (тут.выбор)
                {
                    тут.выбор(номерСтроки);
                }
            });
        }
    };

};