jQuery-按值对数组进行分组并显示到textarea中

时间:2018-09-21 11:24:12

标签: javascript jquery arrays

我有一个通过API调用获得的数组列表。我正在通过该数组循环将列表显示到文本区域。

var fileString ="";

var filelist = [
    {"$/Release/branch1/xmlfiles/Checkout.xml"},
    {"$/Release/branch1/xmlfiles/list.xml"},
    {"$/Release/branch1/global/Policy.ascx.designer.cs"},
    {"$/Release/branch1/global/Policy.ascx.cs"},
    {"$/Release/branch1/global/Policy.cs"},
    {"$/Release/branch1/global/img/bgwhite.jpg"},
    {"$/Release/branch1/global/js/init.js"},
    {"$/Release/branch1/global/js/main.js"}
];

for(j=0; j<filelist.length; j++){
  fileString += filelist[j]+ "\n";
}

$('.list').empty().val(fileString);

现在我想按扩展名对文件列表进行分组,并打印到--p的文本区域中

UI Files
---------------------------------------
$/Release/branch1/xmlfiles/Checkout.xml
$/Release/branch1/xmlfiles/list.xml
$/Release/branch1/global/js/main.js
$/Release/branch1/global/js/init.js

Dot Net Files
-----------------------------------------
$/Release/branch1/global/Policy.ascx.designer.cs
$/Release/branch1/global/Policy.ascx.cs
$/Release/branch1/global/Policy.cs

2 个答案:

答案 0 :(得分:1)

您可以使用array#reduce根据扩展名对数组进行分组,然后再次使用array#reduce可以生成字符串。

var filelist = [ "$/Release/branch1/xmlfiles/Checkout.xml", "$/Release/branch1/xmlfiles/list.xml", "$/Release/branch1/global/Policy.ascx.designer.cs", "$/Release/branch1/global/Policy.ascx.cs", "$/Release/branch1/global/Policy.cs", "$/Release/branch1/global/img/bgwhite.jpg","$/Release/branch1/global/js/init.js", "$/Release/branch1/global/js/main.js" ],
    result = filelist.reduce((r,file) => {
      let extension = file.substr(file.lastIndexOf('.')+1);
      if(['cs','ascx'].includes(extension)) {
        'Dot Net Files' in r ? r['Dot Net Files'].push(file) : r['Dot Net Files'] = [file];
      } else {
        'UI Files' in r ? r['UI Files'].push(file) : r['UI Files'] = [file];
      }
      return r;
    },{});

let output = Object.keys(result).reduce((s,k,i) => {
              return s += (i ? '\n\n' : '') + k + '\n________________________________\n' + result[k].join('\n');
            },'');
console.log(output);

答案 1 :(得分:0)

此“文件列表”数组无效。每个javaScript对象必须包含一对键-值。我想您正在使用的API返回字符串数组。因此,最简单的解决方案如下所示:

var fileString = "";
var filelist = [
    "$/Release/branch1/xmlfiles/Checkout.xml",
    "$/Release/branch1/xmlfiles/list.xml",
    "$/Release/branch1/global/Policy.ascx.designer.cs",
    "$/Release/branch1/global/Policy.ascx.cs",
    "$/Release/branch1/global/Policy.cs",
    "$/Release/branch1/global/img/bgwhite.jpg",
    "$/Release/branch1/global/js/init.js",
    "$/Release/branch1/global/js/main.js"
];

let uiFiles = [];
let csFiles = [];

for (let file of filelist) {
    let extension = file.split(".").pop();

    if (extension === "cs"){ 
        csFiles.push(file);
    }
    else {
        uiFiles.push(file);
    }
}

fileString += "UI Files \n-----------------------------------------\n";
for (let ui of uiFiles) {
    fileString += ui + "\n";
}

fileString += "\nDot Net Files \n-----------------------------------------\n";
for (let cs of csFiles) {
    fileString += cs + "\n";
}

console.log(fileString);