【问题标题】:Can I split a pre-sliced string in javascript?我可以在 javascript 中拆分预切片的字符串吗?
【发布时间】:2016-02-16 14:49:14
【问题描述】:

您好,我有一个技术测试,要求我将 180 个字符分成 6 个组,然后将它们放入 6 个表中。

感谢我几天前来到这里的帮助,我已经拆分了字符,但意识到我需要再次拆分新形成的数组;因为一旦创建了表,这 6 个组只需将自己登录到 6 个表中第一个表的第一行。

我需要将这些组成对记录到 9 col x 3 行表中,但我似乎无法让它们工作。这是我的代码:

 <script>

 var ticketString ="011722475204365360702637497481233455758302154058881928446789061241507324334876840738576186051132437816395663800818206590104559628214294664710935667287132130687703253151692742547985".match(/.{1,2}/g);

 function loadTickets () {

 var ticket = [];

 for (var i = 0; i < ticketString.length / 15; i++) {

     ticket[i] = ticketString.slice(i * 15, (i + 1) * 15).sort();

     var table = document.createElement("TABLE")

     table.border='1'

     table.setAttribute("id","ticketTable" + i)

     var tableBody = document.createElement("TBODY")

          tableBody.setAttribute("id","ticketBody")

          table.appendChild(tableBody); 

                 for (b=0;b<=2;b++) {

                 var row = document.createElement("TR")

                 row.setAttribute("id", "ticketRow" + b)

                 tableBody.appendChild(row)

                     for (c=0; c<=8;c++) {

                     var cell = document.createElement("TD")

                     cell.setAttribute("id","ticket-number" + c)

                     cell.bgColor = 'red';

                     row.appendChild(cell)

                     document.body.appendChild(table)

                      document.getElementById('ticket-number' + i).innerHTML = ticket[i];


     }

 }

 }

 console.log(tableBody);

 console.log(row);

 console.log(cell);

 };

 </script>

【问题讨论】:

  • 为什么要将表格附加到循环内的正文中?
  • 真的没有意义。您在循环 i、b 和 c 中将票号 + i 设置为票 [i] - 除了用于 id 之外,您从未真正使用过这些变量。无论如何,都是关于奇怪的。
  • 嗨,抱歉,我是 Javascript 新手 - 附加是将表格附加到某些东西上,并且 b 和 c 的使用不会与使用 i 的变量冲突 - 所以这是不正确的?我可以很容易地改变这些。票号 + i 是为了确保票号单元会随着 6 个数组的增加而增加。
  • 也很抱歉,但我很难理解你在做什么。你能提供一些东西(图片、链接)来显示你想要的结果吗?
  • 您好,这是我想要实现的目标:bensegni.co.uk/result.png

标签: javascript arrays split slice


【解决方案1】:

我不确定您是如何确定空框的,但这是 6 个表格,每行有 3 行和 5 个数字,就像您的图片中一样。本质上它做了以下事情:

  1. 将字符串拆分为 18 个数组,每个数组包含 5 个数字。
  2. 创建一个多维数组,其中包含 3 个在 #1 中创建的上述数组。
  3. 根据确定数字是否属于该索引的算法检查每个位置。
  4. 为每个外部数组创建一个表,为该表中的每个内部数组创建一行,为该表中每一行中的每个数字创建一个列。

在视觉上你可以把它想象成堆叠多维数组。

 var ticketString = "011722475204365360702637497481233455758302154058881928446789061241507324334876840738576186051132437816395663800818206590104559628214294664710935667287132130687703253151692742547985".match(/.{1,2}/g);

 function loadTickets() {
     var ticketTables = [];
     var ticketGroups = [];
     var numberOfNumbers = 5; // per row
     var inc = 0;
     for (var i = 0; i < ticketString.length / numberOfNumbers; i++) {
         var start = i * numberOfNumbers;
         var end = start + numberOfNumbers;
         ticketGroups[i] = ticketString.slice(start, end);

         ticketTables[inc] = ticketTables[inc] || [];
         ticketTables[inc].push(ticketGroups[i]);

         if ((i + 1) % 3 === 0) {
             inc += 1;
         }
     }

     for (var i = 0, max = ticketTables.length; i < max; i += 1) {
         var table = ticketTables[i];
         for (var j = 0, jmax = table.length; j < jmax; j += 1) {
             var row = table[j];
             var newRow = [];
             for (var k = 0, kmax = 9; k < kmax; k += 1) {
                 newRow[k] = '';
                 for (var l = 0, lmax = row.length; l < lmax; l += 1) {
                     var number = parseInt(row[l]);

                     if (number >= (k) * 10 && number < (k + 1) * 10) {
                         newRow[k] = number;
                     }

                     if (number >= (kmax * 10) && k === kmax - 1) {
                         newRow[k] = number
                     }
                 }

             }
             ticketTables[i][j] = newRow;

         }
     }

     console.log(ticketTables);

     for (var i = 0, max = ticketTables.length; i < max; i += 1) {
         var table = ticketTables[i];
         var $table = document.createElement('table');
         for (var j = 0, jmax = ticketTables[i].length; j < jmax; j += 1) {
             var row = table[j];
             var $row = document.createElement('tr');
             $table.appendChild($row);

             for (var k = 0, kmax = row.length; k < kmax; k += 1) {
                 var cell = row[k];
                 var $cell = document.createElement('td');
                 $row.appendChild($cell);
                 $cell.innerHTML = cell;
             }

         }
         document.body.appendChild($table);
     }
 };

 loadTickets();
input {
    width: 100%;
}
table, tr, td {
    border: 1px solid grey;
}
table tr td {
    min-width: 20px;
}

【讨论】:

  • 非常感谢您在这里的帮助。看起来你花了很多时间来制定这个。我会尝试一下,了解这里发生的事情。谢谢。
  • 不客气,@Ben。如果您需要其他指导,您当然可以发表评论,或者我可以开始聊天。同时,如果有帮助,请随意选择正确的答案。
  • 我只是在给我的笔记本电脑充电,但我会的。我真的不知道我应该如何将数字放置在图像所示的随机位置。
  • 我实际上看到了一个模式,我会更新空白框的答案:)
  • 真的吗?我错过了一些东西。看到这个我会很高兴。如果我注释掉你发给我的代码以表明我理解它,你介意吗?我是 JavaScript 新手,我不熟悉的语法元素很少。我有兴趣看看这种模式。 :)
猜你喜欢
  • 1970-01-01
  • 2011-02-10
  • 2017-12-09
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2011-01-13
  • 1970-01-01
相关资源
最近更新 更多