ASCII 表,其中字段可以有换行符
ASCII table where field can have newlines
我有以下显示 ASCII 表的函数
function ascii_table(array, header) {
if (!array.length) {
return '';
}
var lengths = array[0].map(function(_, i) {
var col = array.map(function(row) {
if (row[i] != undefined) {
return row[i].length;
} else {
return 0;
}
});
return Math.max.apply(Math, col);
});
array = array.map(function(row) {
return '| ' + row.map(function(item, i) {
var size = item.length;
if (size < lengths[i]) {
item += new Array(lengths[i]-size+1).join(' ');
}
return item;
}).join(' | ') + ' |';
});
var sep = '+' + lengths.map(function(length) {
return new Array(length+3).join('-');
}).join('+') + '+';
if (header) {
return sep + ''n' + array[0] + ''n' + sep + ''n' +
array.slice(1).join(''n') + ''n' + sep;
} else {
return sep + ''n' + array.join(''n') + ''n' + sep;
}
}
问题是当单元格包含新行时,我最终会得到这样的东西:
+---------------------+--------+-------+-----+-------------------------------+------------+---------------------+
| date | nick | email | www | comment | ip | avatar |
+---------------------+--------+-------+-----+-------------------------------+------------+---------------------+
| 2016-01-27 21:11:10 | stefan | kanev | | dsfdsfsd
sdfsdf
sdfsdf
sdfdsf | 1308240552 | avatars/default.png |
+---------------------+--------+-------+-----+-------------------------------+------------+---------------------+
我应该在我的函数中更改什么才能产生这样的结果:
+---------------------+--------+-------+-----+----------+------------+---------------------+
| date | nick | email | www | comment | ip | avatar |
+---------------------+--------+-------+-----+----------+------------+---------------------+
| 2016-01-27 21:11:10 | stefan | kanev | | dsfdsfsd | 1308240552 | avatars/default.png |
| | | | | sdfsdf | | |
| | | | | sdfsdf | | |
| | | | | sdfdsf | | |
+---------------------+--------+-------+-----+----------+------------+---------------------+
在呈现表之前,您可以修改表并将新行添加到表中:
function ascii_table(array, header) {
if (!array.length) {
return '';
}
//added
for (var i = array.length - 1; i >= 0; i--) {
var row = array[i];
var stacks = [];
for (var j = 0; j < row.length; j++) {
var newLines = row[j].split("'n");
row[j] = newLines.shift();
stacks.push(newLines);
}
var newRowsCount = stacks.reduce(function(a, b) {
return a.length > b.length ? a : b;
}).length;
for (var k = newRowsCount - 1; k >= 0; k--) {
array.splice(i + 1, 0, stacks.map(function(stackColumn) {
return stackColumn[k] || "";
}));
}
}
//added
var lengths = array[0].map(function(_, i) {
var col = array.map(function(row) {
if (row[i] != undefined) {
return row[i].length;
} else {
return 0;
}
});
return Math.max.apply(Math, col);
});
array = array.map(function(row) {
return '| ' + row.map(function(item, i) {
var size = item.length;
if (size < lengths[i]) {
item += new Array(lengths[i] - size + 1).join(' ');
}
return item;
}).join(' | ') + ' |';
});
var sep = '+' + lengths.map(function(length) {
return new Array(length + 3).join('-');
}).join('+') + '+';
if (header) {
return sep + ''n' + array[0] + ''n' + sep + ''n' +
array.slice(1).join(''n') + ''n' + sep;
} else {
return sep + ''n' + array.join(''n') + ''n' + sep;
}
}
输出:
+---------------------+------+--------+-----+------------------+------------+---------------------+
| date | nick | email | www | comment | ip | avatar |
+---------------------+------+--------+-----+------------------+------------+---------------------+
| 2016-01-28 11:40:59 | lol | lol@lo | | nocomment | 1844311719 | avatars/default.png |
| | | l.fr | | lol | | |
| | | | | lol | | |
| | | | | lol | | |
| 2016-01-10 15:13:59 | ehs | what | | ente rm comment. | 1423172924 | avatars/default.png |
+---------------------+------+--------+-----+------------------+------------+---------------------+
(在一个电子邮件单元格中添加了新行,以测试多列中的新行)。
这可以通过扩展array
来不修改代码来完成 - 为注释的每一行添加一个新行。第一行将与之前相同 - 只是注释单元格仅包含注释的第一行。每个额外的行都将包含空单元格 - 除了注释单元格,它将包含该注释行。
为了可读性,我会分解大多数函数,但为了与您的编码风格保持一致,它可能看起来像这样:
array = array.reduce(function (carry, originalRow) {
var commentLines = originalRow[4].split(/'n/g);
var rows = commentLines.map(function (commentLine, rowIndex) {
var newRow = originalRow.map(function (originalCellContent, columnIndex) {
var cellContent = '';
if (rowIndex === 0) {
cellContent = originalCellContent;
}
if (columnIndex === 4) {
cellContent = commentLine;
}
return cellContent;
});
carry.push(newRow);
});
return carry;
}, []);
你的小提琴的分叉在这里,添加了这个代码。
这里是: https://jsfiddle.net/zww557sh/1/
function ascii_table(array, header) {
if (!array.length) {
return '';
}
var lengths = array[0].map(function(_, i) {
var col = array.map(function(row) {
if (row[i] != undefined) {
return row[i].length;
} else {
return 0;
}
});
return Math.max.apply(Math, col);
});
array = array.map(function(row, r) {
// let's split the table cells to lines
var cols = row.map(function(item, i){
return item.split("'n")
});
// and calculate the max column-height in this row
var maxH = (cols.reduce(function(i,j){return i.length > j.length ? i : j})).length;
// here we manually build the string that will represent
// this row of the table, including the "multi-line" cells
var rowStr = "";
// loop until the maximum cell height in this row
for (h=0;h<maxH;h++) {
rowStr += "| ";
// loop on all the cells
for (c=0;c<cols.length;c++) {
if (c>0) rowStr += " | ";
// item is the h'th in column c, but it might
// be non existing, then we use ""
var item = cols[c][h] || "";
var size = item.length;
// here we use the same padding
if (size < lengths[c]) {
item += new Array(lengths[c]-size+1).join(' ');
}
rowStr += item;
}
rowStr += " |";
if (h<maxH-1) rowStr += "'n";
}
return rowStr;
});
var sep = '+' + lengths.map(function(length) {
return new Array(length+3).join('-');
}).join('+') + '+';
if (header) {
return sep + ''n' + array[0] + ''n' + sep + ''n' +
array.slice(1).join(''n') + ''n' + sep;
} else {
return sep + ''n' + array.join(''n') + ''n' + sep;
}
}
输出:
+---------------------+------+------------+-----+-----------------------+------------+---------------------+
| date | nick | email | www | comment | ip | avatar |
+---------------------+------+------------+-----+-----------------------+------------+---------------------+
| 2016-01-28 11:40:59 | lol | lol@lol.fr | | nocomment | 1844311719 | avatars/default.png |
| | | | | lol | | |
| | | | | lol | | |
| | | | | lol | | |
| 2016-01-10 15:13:59 | ehs | what | | ente rm comment. | 1423172924 | avatars/default.png |
+---------------------+------+------------+-----+-----------------------+------------+---------------------+
相关文章:
- 如何在映射数组中添加换行符
- JQuery:向多个匹配结果添加换行符的最简单方法
- 在文本区域中使用jQuery.text()保持换行符
- javascript替换换行符和特殊字符
- 换行符拆分返回“”;未定义”;
- 如何使用web浏览器在NoSQL数据中呈现换行符
- 换行符插入jquery选择器
- jquery使用val()复制值似乎可以删除换行符
- 文本区域-获取每一行,找到换行符
- 处理字段中带有换行符的csv文件-node.js
- KnockoutJS更新行和字段
- 使用jquery将单个换行符替换为span元素
- javascript/jQuery:在title中添加换行符——在IE9中有效,但在IE8中无效
- 咖啡脚本意外换行符
- 在文本区域中保留换行符.value
- 捕捉文本中的换行符
- 如何使用JavaScript解析字段中包含换行符的CSV数据
- ASCII 表,其中字段可以有换行符
- 添加换行符 JavaScript pdf 表单时的文本字段空白
- Javascript正则表达式,使删除单段换行符