Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Работа с Массивами (https://javascript.ru/forum/misc/79024-rabota-s-massivami.html)

vandalv 08.12.2019 08:36

Работа с Массивами
 
Доброе утро! Помогите разобраться с такой задачей. Задача сделать 100 фактур. На данный момент сделал это. На данный момент нужно чтобы из массива в каждую фактуру добавлялись по 10 товаров далее для этих товаров из массивов должны добавляться стоимость, количество и т.п
function randomDate(date1, date2) {
  function randomValueBetween(min, max) {
    return Math.random() * (max - min) + min;
  }
  var date1 = date1 || '01-01-2017'
  var date2 = date2 || new Date().toLocaleDateString()
  date1 = new Date(date1).getTime()
  date2 = new Date(date2).getTime()
  if (date1 > date2) {
    return new Date(randomValueBetween(date2, date1)).toLocaleDateString()
  } else {
    return new Date(randomValueBetween(date1, date2)).toLocaleDateString()

  }
}

var fakturaN = [];

for (var i = 1; i <= 100; i++) {
  fakturaN.push(i);
}

var sellern = "Dogserf";
var sellernip = "2254913384";
var selleradr = "2592  Davis Place";
var sellerpost = "87918997";
var selleracc = "85090922712148335820";

var firmString="Justsurf,DietyElephant,MetaHound,CuteOx,SweetFrank,PonyMice,BoarsAndInu,KrazyRat,GlumCats,ManedPie,ZipperPuppy,AKCStew,FoxFlock,NerdyLion,SnipeSkull,KittenFur,SilentRabbit,Pupski,BearSide,Mouse17C";
var firms = firmString.split(",");
var repeated = [].concat(... new Array(100).fill(["Justsurf", "DietyElephant", "MetaHound","CuteOx","SweetFrank","PonyMice","BoarsAndInu","KrazyRat","GlumCats","ManedPie","ZipperPuppy","AKCStew","FoxFlock","NerdyLion","SnipeSkull","KittenFur","SilentRabbit","Pupski","BearSide","Mouse17C"]))


var adressString="3118  Palmer Road,4996  Watson Lane,504  Hawks Nest Lane,3432  Glory Road,157  Crosswind Drive,3063  New York Avenue,997  Jadewood Drive,1630  Mulberry Lane,1710  Jehovah Drive,409  Monroe Street,3538  Hickman Street,68  Powder House Road,2449  Eagle Drive,1143  Collins Avenue,2848  Snyder Avenue,3797  Willis Avenue,4008  Alexander Avenue,3406  Wines Lane,1610  Gorby Lane";
var adress = adressString.split(",");
var repeated1 = [].concat(... new Array(100).fill(["3118  Palmer Road", "4996  Watson Lane", "Hawks Nest Lane","3432  Glory Road","157  Crosswind Drive","3063  New York Avenue","997  Jadewood Drive","1630  Mulberry Lane","1710  Jehovah Drive","409  Monroe Street","3538  Hickman Street","68  Powder House Road","2449  Eagle Drive","1143  Collins Avenue","2848  Snyder Avenue","3797  Willis Avenue","4008  Alexander Avenue","3406  Wines Lane","1610  Gorby Lane","2449  Eagle Drive"]))

var postGen = function(len) {
var arr=new Array();
for (var j=0;j<len;j++){
arr.push(Math.floor(Math.random()*10));
}
return arr.join("");
};

var accountGen = function(len) {
var arr=new Array();
for (var j=0;j<len;j++){
arr.push(Math.floor(Math.random()*10));
}
return arr.join("");
};

var vegString=["Apple","Apricots","Avocado","Banana","Blackberries"];

var randomAnswer = vegString[Math.floor(Math.random() * vegString.length)];


var bases = [];
for (var i = 0; i < fakturaN.length; i++) 
{
  var base = new Object();
  base.pref = fakturaN[i];
  base.sellern = sellern;
  base.sellernip = sellernip;
  base.selleradr = selleradr;
  base.sellerpost = sellerpost;
  base.selleracc = selleracc;
  base.repeated = repeated[i];
  base.repeated1 = repeated1[i];
  base.account=accountGen(20);
  base.postal=postGen(8);
  base.fullname=randomAnswer;
  bases.push(base);
}

for (var k = 0; k < bases.length; k++) 
{
  console.log("№ FAKTURY  000" + bases[k].pref + "  " + " ---------------------------------------------------------------------------------------------------------- " + "  " + randomDate() + "\n" + "SELLER:     " + base.sellern + "  " + "NIP:  " + base.sellernip + "     " + "ADRESS:  " + base.selleradr + "     " + "ACCOUNT:  " + base.selleracc + "     " + "POSTAL:  " + base.sellerpost + "\n" + "CUSTOMER:  " + bases[k].repeated+ "   ADRESS:  " + bases[k].repeated1+"  ACCOUNT№  "+": "+bases[k].account+"    POSTAL  "+": "+ bases[k].postal+ "\n"+"Produkt "+k+1+": "+bases[k].fullname+ "\n"+"Produkt "+k+5+": "+bases[k].fullname);
 

}

vandalv 08.12.2019 08:38

Все результаты просматриваются в консоли. Большего пока не нужно.

рони 08.12.2019 10:03

vandalv,
function randomValueBetween(min, max) {
    return Math.random() * (max - min) + min;
}
function randomDate(date1 = '01-01-2017', date2 = new Date().toLocaleDateString()) {
  date1 = new Date(date1).getTime();
  date2 = new Date(date2).getTime();
  return new Date(randomValueBetween(date2, date1)).toLocaleDateString()
}
function getElem(arr)
{
  return arr[randomValueBetween(0, arr.length)|0]
}
var sellern = "Dogserf";
var sellernip = "2254913384";
var selleradr = "2592  Davis Place";
var sellerpost = "87918997";
var selleracc = "85090922712148335820";
var firmString="Justsurf,DietyElephant,MetaHound,CuteOx,SweetFrank,PonyMice,BoarsAndInu,KrazyRat,GlumCats,ManedPie,ZipperPuppy,AKCStew,FoxFlock,NerdyLion,SnipeSkull,KittenFur,SilentRabbit,Pupski,BearSide,Mouse17C";
var firms = firmString.split(",");
var adressString="3118  Palmer Road,4996  Watson Lane,504  Hawks Nest Lane,3432  Glory Road,157  Crosswind Drive,3063  New York Avenue,997  Jadewood Drive,1630  Mulberry Lane,1710  Jehovah Drive,409  Monroe Street,3538  Hickman Street,68  Powder House Road,2449  Eagle Drive,1143  Collins Avenue,2848  Snyder Avenue,3797  Willis Avenue,4008  Alexander Avenue,3406  Wines Lane,1610  Gorby Lane";
var adress = adressString.split(",");
var numGen = function(length) {
return Array.from({length}, _=> Math.floor(Math.random()*10)).join("");
};
var vegString=["Apple","Apricots","Avocado","Banana","Blackberries"];
var bases = [];
for (var i = 0; i < 100; )
{
  var base = new Object();
  base.pref = (++i).toString().padStart(5, "0");
  base.sellern = sellern;
  base.sellernip = sellernip;
  base.selleradr = selleradr;
  base.sellerpost = sellerpost;
  base.selleracc = selleracc;
  base.repeated = getElem(firms);
  base.repeated1 = getElem(adress);
  base.account=numGen(20);
  base.postal=numGen(8);
  base.produkt = Array.from({length : 10}, _ => `Produkt ${randomValueBetween(100, 999)|0} ${getElem(vegString)} ${randomValueBetween(1, 100).toFixed(2)}$ ${randomValueBetween(1, 100)|0}p.`).join('\n')
  bases.push(base);
}
for (var k = 0; k < bases.length; k++)
{
  console.log("№ FAKTURY  " + bases[k].pref + "  " + " ---------------------------------------------------------------------------------------------------------- " + "  " + randomDate() + "\n" + "SELLER:     " + bases[k].sellern + "  " + "NIP:  " + bases[k].sellernip + "     " + "ADRESS:  " + bases[k].selleradr + "     " + "ACCOUNT:  " + bases[k].selleracc + "     " + "POSTAL:  " + bases[k].sellerpost + "\n" + "CUSTOMER:  " + bases[k].repeated+ "   ADRESS:  " + bases[k].repeated1+"  ACCOUNT№  "+": "+bases[k].account+"    POSTAL  "+": "+ bases[k].postal+ "\n"+bases[k].produkt);
}

vandalv 08.12.2019 20:46

Спасибо за код! Это по сути первая лаба. Я сделал по сути как смог. Единственный еще вопрос хотел уточнить. У нас задается цена и количество случайным образом. Если захотим написать общую стоимость цена*количество товара. Каким образом это будет выглядеть?

рони 08.12.2019 21:33

vandalv,
строку 40 заменить на
base.total = 0;
  base.produkt = Array.from({length : 10}, _ => {
  var num = randomValueBetween(100, 999)|0,
      name = getElem(vegString),
      price = randomValueBetween(1, 100).toFixed(2),
      count = randomValueBetween(1, 100)|0;
      base.total += price * count;
      return `${num} ${name} ${price}$ ${count}p.`
  }).join('\n') + `\ntotal: ${base.total.toFixed(2)}$` ;

рони 08.12.2019 21:51

vandalv,
пост #5, код выше исправлен.

vandalv 08.12.2019 21:54

Спасибо огромное! А есть ли какой-то аналог для randomValueBetween, чтобы значение бралось случайно из 3-х фиксированных значений? Как пример - это мы получаем цену брутто, для цены нетто в уравнении будет учавствовать ставка налога добавленная к цене. (23, 9, 5) соответственно.

рони 08.12.2019 21:56

Цитата:

Сообщение от vandalv
чтобы значение бралось случайно из 3-х фиксированных значений?

:-?
Цитата:

Сообщение от рони
function getElem(arr)


vandalv 08.12.2019 21:58

:)

vandalv 08.12.2019 23:14

Еще хотел уточнить, каким способом может проводиться сортировка такого рода фактур. Пример:
1) 30 фактур по найбольшей стоимости продажи отсортированных относительно даты.
2) Сортировка из заданного периода по стоимости продажи
3) Все фактуры в которых есть определенный продукт.
Спасибо!

рони 08.12.2019 23:47

Цитата:

Сообщение от vandalv
30 фактур по найбольшей стоимости продажи отсортированных относительно даты.

условно
bases.sort((a,b)=> a.total - b.total).slice(0,30)


Цитата:

Сообщение от vandalv
Сортировка из заданного периода по стоимости продажи

нужна дата
base.data = randomDate() и тогда
bases.filter(a => a.data < data2 && a.data > data1).sort((a,b)=> a.total - b.total)

Цитата:

Сообщение от vandalv
Все фактуры в которых есть определенный продукт.

base.produkt тогда нужен массив обьектов а не строка
bases.filter(base => base.produkt.some(el  => el.name == 'Banana')

рони 08.12.2019 23:50

Цитата:

Сообщение от рони
нужен массив обьектов

base.total = 0;
  base.produkt = Array.from({length : 10}, _ => {
  var num = randomValueBetween(100, 999)|0,
      name = getElem(vegString),
      price = randomValueBetween(1, 100).toFixed(2),
      count = randomValueBetween(1, 100)|0;
      base.total += price * count;
      return {num, name, price, count}
  });

vandalv 09.12.2019 00:41

Не могли бы вы показать это в коде? Очень туго идет. Заранее благодарен!

рони 09.12.2019 01:13

Цитата:

Сообщение от vandalv
Не могли бы вы показать это в коде?

???
что показать?

vandalv 09.12.2019 01:26

Ну допустим bases.sort() по какому полю сортировать будет?

рони 09.12.2019 01:31

vandalv,
ни по какому, так сортируют только строки, у вас обьекты, нужна функция, примеры выше пост#11.

рони 09.12.2019 02:03

vandalv,
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.3.0/lodash.js"></script>
    <style>
        table {
            border-collapse: collapse;
        }

        td {
            border: 1px solid gray;
            padding: 2px 5px;
            text-align: center;
        }
    </style>
</head>

<body>

    <div id="grid-holder"></div>

    <script type="text/template" id="grid-template">
        <table>
            <thead>
                <tr>
                    <th>№</th>
                    <th>сумма</th>
                    <th>продукты</th>
                </tr>
            </thead>
            <tbody>
                <% for(var i = 0; i < list.length; i++) { %>
                    <tr><td>
                            <%=i + 1%>
                        </td>
                        <td>
                            <%=list[i].total%>
                        </td>
                        <td><ul>
                        <% for(var k = 0; k < list[i].produkt.length; k++) { %>
                        <li>
                            <%=list[i].produkt[k].name%>
                         </li>
                        <% } %>
                            </ul>
                        </td>
                    </tr>
                    <% } %>
            </tbody>
        </table>
    </script>

    <script>
function randomValueBetween(min, max) {
        return Math.random() * (max - min) + min;
}
function randomDate(date1 = '01-01-2017', date2 = new Date().toLocaleDateString()) {
    date1 = new Date(date1).getTime();
    date2 = new Date(date2).getTime();
    return new Date(randomValueBetween(date2, date1)).toLocaleDateString()
}
function getElem(arr)
{
    return arr[randomValueBetween(0, arr.length)|0]
}
var vegString=["Apple","Apricots","Avocado","Banana","Blackberries"];
    var bases = Array.from({length : 10}, _ => {
    var total = 0,
    produkt = Array.from({length : 5}, _ => {
    var num = randomValueBetween(100, 999)|0,
            name = getElem(vegString),
            price = randomValueBetween(1, 100).toFixed(2),
            count = randomValueBetween(1, 100)|0;
            total += price * count;
            return {num, name, price, count}
    });
    total = total.toFixed(2);
    return {total, produkt}
    })




        var tmpl = document.getElementById('grid-template').innerHTML.trim();
        tmpl = _.template(tmpl);


        document.getElementById('grid-holder').insertAdjacentHTML('beforeEnd' ,tmpl({
            list: bases
        }));
        document.getElementById('grid-holder').insertAdjacentHTML('beforeEnd' , '<h1>5  фактур по найбольшей стоимости</h1>');
        var sortTotal = bases.sort((a,b)=> a.total - b.total).slice(-5);
        document.getElementById('grid-holder').insertAdjacentHTML('beforeEnd' ,tmpl({
            list: sortTotal
        }));
        document.getElementById('grid-holder').insertAdjacentHTML('beforeEnd' , '<h1>фактуры по возрастанию стоимости, в которых есть Avocado</h1>');
        var filterAvocadoSortTotal = bases.filter(base => base.produkt.some(el  => el.name == 'Avocado')).sort((a,b)=> a.total - b.total);
        document.getElementById('grid-holder').insertAdjacentHTML('beforeEnd' ,tmpl({
            list: filterAvocadoSortTotal
        }));

    </script>

</body>

</html>

vandalv 09.12.2019 02:32

Сортировка по стоимости отлично работает. Но с датой, если задавать randomDate() получается случайная одинаковая дата для всех фактур.

рони 09.12.2019 02:48

фильтрация сортировка и вывод данных
 
vandalv,
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.3.0/lodash.js"></script>
    <style>
        table {
            border-collapse: collapse;
        }

        td {
            border: 1px solid gray;
            padding: 2px 5px;
            text-align: center;
        }
    </style>
</head>

<body>

    <div id="grid-holder"></div>

    <script type="text/template" id="grid-template">
        <table>
            <thead>
                <tr>
                    <th>№</th>
                    <th>дата</th>
                    <th>сумма</th>
                    <th>продукты</th>
                </tr>
            </thead>
            <tbody>
                <% for(var i = 0; i < list.length; i++) { %>
                    <tr><td>
                            <%=i + 1%>
                        </td>
                        <td>
                            <%=new Date(list[i].data).toLocaleDateString()%>
                        </td>
                        <td>
                            <%=list[i].total%>
                        </td>
                        <td>
                        <ul>
                        <% for(var k = 0; k < list[i].produkt.length; k++) { %>
                        <li>
                            <%=list[i].produkt[k].name%>
                         </li>
                        <% } %>
                            </ul>
                        </td>
                    </tr>
                    <% } %>
            </tbody>
        </table>
    </script>

    <script>
function randomValueBetween(min, max) {
        return Math.random() * (max - min) + min;
}
function randomDate(date1 = '01-01-2017', date2 = new Date().toLocaleDateString()) {
    date1 = new Date(date1).getTime();
    date2 = new Date(date2).getTime();
    return randomValueBetween(date2, date1)
}
function getElem(arr)
{
    return arr[randomValueBetween(0, arr.length)|0]
}
var vegString=["Apple","Apricots","Avocado","Banana","Blackberries"];
    var bases = Array.from({length : 10}, _ => {
    var total = 0,
    produkt = Array.from({length : 5}, _ => {
    var num = randomValueBetween(100, 999)|0,
            name = getElem(vegString),
            price = randomValueBetween(1, 100).toFixed(2),
            count = randomValueBetween(1, 100)|0;
            total += price * count;
            return {num, name, price, count}
    }),
    data = randomDate();
    total = total.toFixed(2);
    return {data, total, produkt}
    })




        var tmpl = document.getElementById('grid-template').innerHTML.trim();
        tmpl = _.template(tmpl);


        document.getElementById('grid-holder').insertAdjacentHTML('beforeEnd' ,tmpl({
            list: bases
        }));
        document.getElementById('grid-holder').insertAdjacentHTML('beforeEnd' , '<h1>5  фактур по найбольшей стоимости</h1>');
        var sortTotal = bases.slice(0).sort((a,b)=> a.total - b.total).slice(-5);
        document.getElementById('grid-holder').insertAdjacentHTML('beforeEnd' ,tmpl({
            list: sortTotal
        }));
        document.getElementById('grid-holder').insertAdjacentHTML('beforeEnd' , '<h1>фактуры по возрастанию стоимости, в которых есть Avocado</h1>');
        var filterAvocadoSortTotal = bases.filter(base => base.produkt.some(el  => el.name == 'Avocado')).sort((a,b)=> a.total - b.total);
        document.getElementById('grid-holder').insertAdjacentHTML('beforeEnd' ,tmpl({
            list: filterAvocadoSortTotal
        }));
        document.getElementById('grid-holder').insertAdjacentHTML('beforeEnd' , '<h1>фактуры за 2018 год, по возрастанию даты</h1>');
        var filterDataSort = bases.filter(base => (new Date(base.data)).getFullYear() == 2018).sort((a,b)=> a.data - b.data);
        document.getElementById('grid-holder').insertAdjacentHTML('beforeEnd' ,tmpl({
            list: filterDataSort
        }));
        document.getElementById('grid-holder').insertAdjacentHTML('beforeEnd' , '<h1>фактуры за первые полгода 2019 год, по возрастанию даты</h1>');
        var dataStart = new Date(2019, 0, 1, 0, 0, 0, 0), dataEnd = new Date(2019, 6, 0, 0, 0, 0, 0);
        var filter2019Sort = bases.filter(base => base.data >= dataStart && base.data <= dataEnd).sort((a,b)=> a.data - b.data);
        document.getElementById('grid-holder').insertAdjacentHTML('beforeEnd' ,tmpl({
            list: filter2019Sort
        }));
    </script>

</body>

</html>

рони 09.12.2019 02:51

vandalv,
randomDate возвращает сейчас ms.

vandalv 09.12.2019 05:07

Спасибо, благодаря вам подвинулся с места. Запихал все в html. Единственное, не сообразил как цену, общую стоимость, количество, товары отдельными полями добавить. Сортировку пока не победил. Не все в один лень делается. Спасибо вы очень помогли!
<!doctype html>
<html lang="en">
<head>
	<title>JavaScript Tutorial - Arrays and Loops</title>
	<link rel="stylesheet" href="css/foundation.min.css"></link>
	<style>
    th
    {
      background: white;
      height:50px;
    }
    table,th,td
    {
      border:2px solid green;
    }
    table
    {
      width:40%;
      color:solid green;
      text-align:center;
    }
  </style>
</head>
<body>

	<!-- JAVASCRIPT -->
	<script type="text/javascript">
	function randomValueBetween(min, max) {
    return Math.random() * (max - min) + min;
}
function randomDate(date1 = '01-01-2017', date2 = new Date().toLocaleDateString()) {
  date1 = new Date(date1).getTime();
  date2 = new Date(date2).getTime();
  return new Date(randomValueBetween(date2, date1)).toLocaleDateString()
}
function getElem(arr)
{
  return arr[randomValueBetween(0, arr.length)|0]
}
var sellern = "Dogserf";
var sellernip = "2254913384";
var selleradr = "2592  Davis Place";
var sellerpost = "87918997";
var selleracc = "85090922712148335820";
var firmString="Justsurf,DietyElephant,MetaHound,CuteOx,SweetFrank,PonyMice,BoarsAndInu,KrazyRat,GlumCats,ManedPie,ZipperPuppy,AKCStew,FoxFlock,NerdyLion,SnipeSkull,KittenFur,SilentRabbit,Pupski,BearSide,Mouse17C";
var firms = firmString.split(",");
var adressString="3118  Palmer Road,4996  Watson Lane,504  Hawks Nest Lane,3432  Glory Road,157  Crosswind Drive,3063  New York Avenue,997  Jadewood Drive,1630  Mulberry Lane,1710  Jehovah Drive,409  Monroe Street,3538  Hickman Street,68  Powder House Road,2449  Eagle Drive,1143  Collins Avenue,2848  Snyder Avenue,3797  Willis Avenue,4008  Alexander Avenue,3406  Wines Lane,1610  Gorby Lane";
var adress = adressString.split(",");
var numGen = function(length) {
return Array.from({length}, _=> Math.floor(Math.random()*10)).join("");
};
var vegString=["Apple","Apricots","Avocado","Banana","Blackberries", "Blueberries","Cantaloupe","Carambola","Cherimoya","Cherries","Clementine","Coconut Meat","Durian","Grapefruit","Jackfruit","Lemon","Mango","Mangosteen","Peaches","Raspberries","Tangerine"];
var bases = [];
for (var i = 0; i < 10; )
{
  var base = new Object();
  base.pref = (++i).toString().padStart(5, "0");
  base.sellern = sellern;
  base.sellernip = sellernip;
  base.selleradr = selleradr;
  base.sellerpost = sellerpost;
  base.selleracc = selleracc;
  base.repeated = getElem(firms);
  base.repeated1 = getElem(adress);
  base.account=numGen(20);
  base.postal=numGen(8);
  base.total = 0;
  base.netto = 0;
  base.produkt = Array.from({length : 10}, _ => {
  var num = randomValueBetween(100, 999)|0,
      price = randomValueBetween(1, 100).toFixed(2),
      count = randomValueBetween(1, 100)|0;
      base.total += price * count;
      base.netto = base.total * 1.23;
      return `\nPRODUCT - ${getElem(vegString)}    PRICE - ${randomValueBetween(1, 100).toFixed(2)}$   QUANTITY - ${randomValueBetween(1, 100)|0} p.`
  }).join('\n') + `\nTOTAL BRUTTO PRICE: ${base.total.toFixed(2)}$ ` + `  \nTOTAL NETTO PRICE: ${base.netto.toFixed(2)}$ `;
  
  

  bases.push(base);
}

	document.write('<table>');
	document.write('<tr><th>Faktura№</th><th>Date</th><th>Client</th><th>Adress</th><th>Account№</th></tr>');
	for (var k = 0; k < bases.length; k++)
	{
		document.write("<tr><td>" + bases[k].pref +  "</td>" + "<td>" + randomDate() + "</td>" + "<td>" + bases[k].repeated +"</td>" + "<td>" + bases[k].repeated1 + "<td>" + bases[k].account +"</td></tr>");
	}
	
	document.write('</table>');
	</script>
	<!-- END JAVASCRIPT -->
</body>
</html>

рони 09.12.2019 09:11

Цитата:

Сообщение от vandalv
как цену, общую стоимость, количество, товары отдельными полями добавить

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.3.0/lodash.js"></script>
    <style>
      table {
        border-collapse: collapse;
        border: 1px solid gray;
      }

      td {
        border: 1px solid gray;
        padding: 2px 5px;
        text-align: center;
      }
      table td[colspan='2'] {
        padding: 0;
        box-sizing: border-box;
      }

      table table {
        width: 100%;
      }
      table table td:last-child {
        text-align: right;
      }
      table table tr:last-child td:last-child {
        color: #ff0000;
      }
    </style>
  </head>

  <body>
    <div id="grid-holder"></div>

    <script type="text/template" id="grid-template">
      <table>
          <thead>
              <tr>
                  <th>№</th>
                  <th>дата</th>
              </tr>
          </thead>
          <tbody>
              <% for(var i = 0; i < list.length; i++) { %>
                  <tr><td>
                          <%=i + 1%>
                      </td>
                      <td>
                          <%=new Date(list[i].data).toLocaleDateString()%>
                      </td>
                     </tr>
                     <tr><td colspan=2>
                       <table>
          <thead>
              <tr>
                  <th>артикул</th>
                  <th>название</th>
                  <th>цена</th>
                  <th>количество</th>
                  <th>сумма</th>
              </tr>
          </thead>
          <tbody>
                      <% for(var k = 0; k < list[i].produkt.length; k++) { %>
                       <tr>
                       <td>
                          <%=list[i].produkt[k].num%>
                       </td>
                       <td>
                          <%=list[i].produkt[k].name%>
                       </td>
                       <td>
                          <%=list[i].produkt[k].price%>
                       </td>
                       <td>
                          <%=list[i].produkt[k].count%>
                       </td>
                       <td>
                          <%=(list[i].produkt[k].price * list[i].produkt[k].count).toFixed(2)%>
                       </td>
                       </tr>
                      <% } %>
                           <tr>
                       <td colspan = 4>
                          всего
                       </td>
                       <td>
                          <%=list[i].total%>
                       </td>
                           </tr>
                           </tbody>
                         </table>
                      </td>
                  </tr>
                  <% } %>
                 </td></tr>
          </tbody>
      </table>
    </script>

    <script>
      function randomValueBetween(min, max) {
        return Math.random() * (max - min) + min;
      }
      function randomDate(
        date1 = '01-01-2017',
        date2 = new Date().toLocaleDateString()
      ) {
        date1 = new Date(date1).getTime();
        date2 = new Date(date2).getTime();
        return randomValueBetween(date2, date1);
      }
      function getElem(arr) {
        return arr[randomValueBetween(0, arr.length) | 0];
      }
      var vegString = [
        'Apple',
        'Apricots',
        'Avocado',
        'Banana',
        'Blackberries',
      ];
      var bases = Array.from({ length: 10 }, _ => {
        var total = 0,
          produkt = Array.from({ length: 5 }, _ => {
            var num = randomValueBetween(100, 999) | 0,
              name = getElem(vegString),
              price = randomValueBetween(1, 100).toFixed(2),
              count = randomValueBetween(1, 100) | 0;
            total += price * count;
            return { num, name, price, count };
          }),
          data = randomDate();
        total = total.toFixed(2);
        return { data, total, produkt };
      });

      var tmpl = document.getElementById('grid-template').innerHTML.trim();
      tmpl = _.template(tmpl);
      function appendTable(list) {
        document
          .getElementById('grid-holder')
          .insertAdjacentHTML('beforeEnd', tmpl({ list }));
      }

      function appendTitle(txt) {
        document
          .getElementById('grid-holder')
          .insertAdjacentHTML('beforeEnd', `<h1>${txt}</h1>`);
      }
      appendTitle('исходный массив фактур');
      appendTable(bases);

      appendTitle('5  фактур по найбольшей стоимости');
      var sortTotal = bases
        .slice(0)
        .sort((a, b) => a.total - b.total)
        .slice(-5);
      appendTable(sortTotal);

      appendTitle('фактуры по возрастанию стоимости, в которых есть Avocado');
      var filterAvocadoSortTotal = bases
        .filter(base => base.produkt.some(el => el.name == 'Avocado'))
        .sort((a, b) => a.total - b.total);
      appendTable(filterAvocadoSortTotal);

      appendTitle('фактуры за 2018 год, по возрастанию даты');
      var filterDataSort = bases
        .filter(base => new Date(base.data).getFullYear() == 2018)
        .sort((a, b) => a.data - b.data);
      appendTable(filterDataSort);

      appendTitle('фактуры за первые полгода 2019 год, по возрастанию даты');
      var dataStart = new Date(2019, 0, 1, 0, 0, 0, 0),
        dataEnd = new Date(2019, 6, 0, 0, 0, 0, 0);
      var filter2019Sort = bases
        .filter(base => base.data >= dataStart && base.data <= dataEnd)
        .sort((a, b) => a.data - b.data);
      appendTable(filter2019Sort);

      appendTitle(
        '3 фактуры с минимальной суммой и сортировкой товара по названию'
      );
      var filterMinSortName = bases
        .slice(0)
        .sort((a, b) => a.total - b.total)
        .slice(0, 3);
      var collator = new Intl.Collator(['en', 'ru'], { numeric: true });
      filterMinSortName.forEach(
        base =>
          (base.produkt = base.produkt
            .slice(0)
            .sort((a, b) => collator.compare(a.name, b.name)))
      );
      appendTable(filterMinSortName);

      appendTitle(
        '3 фактуры с минимальной общей суммой и сортировкой товара по сумме'
      );
      var filterMinSortAmount = bases
        .slice(0)
        .sort((a, b) => a.total - b.total)
        .slice(0, 3);
      filterMinSortAmount.forEach(
        base =>
          (base.produkt = base.produkt
            .slice(0)
            .sort((a, b) =>
              (a.price * a.count - b.price * b.count)
            ))
      );
      appendTable(filterMinSortAmount);
    </script>
  </body>
</html>

vandalv 11.12.2019 05:58

Подскажите, такой вопрос. Пытаюсь запихнуть js в внешний файл. ссылки проверил alert(1). Не выходит ничего

vandalv 11.12.2019 06:14

Основное тело удалось запустить из js файла. Скрипт с таблицей не завелся. Проблема была в размещении в теге <head>. Нужно было в конце файла размещать

рони 11.12.2019 08:39

Цитата:

Сообщение от vandalv
Нужно было в конце файла размещать

или обернуть код в DOMContentLoaded


Часовой пояс GMT +3, время: 07:50.