Javascript：连接字符串中的额外字符阻止与对象键匹配

Question

我正在尝试使用对象键访问另一个对象中的一个对象。我正在连接一组 <select> 元素的值以构建与键匹配的字符串。不幸的是，这永远行不通。下面是代码：

    var valueKeyString = "";
    $(".keySelector").each(function(){
        valueKeyString += $(this).val();
    });
    if (geoAttrs[selectedGeoAttr].rowCol == "row") {
        mapData = rowValueGroups[valueKeyString];
    } else if (geoAttrs[selectedGeoAttr].rowCol == "col") {
        mapData = colValueGroups[valueKeyString];
    } 

在尝试了很多东西之后，我使用charCodeAt()逐个字符地测试了字符串：

    var test1 = valueKeyString;
    for (var i = 0, len = valueKeyString.length; i < len; i++) {
      test1 += valueKeyString.charCodeAt(i)+" ";
    }
    if (geoAttrs[selectedGeoAttr].rowCol == "row") {
        Object.keys(colValueGroups).forEach(function(group) {
            var test2 = group;
            for (var i = 0, len = group.length; i < len; i++) {
              test2 += group.charCodeAt(i)+" ";
            }
            console.log(test1);
            console.log(test2)                
        })

        mapData = colValueGroups[valueKeyString];
    } 

我的连接字符串在连接点都有一个额外的字符，charCode 为 0。无法弄清楚它为什么存在或如何使用正则表达式或str.replace() 摆脱它。最后得到了一个丑陋但实用的解决方案，我只是测试对象键以查看它们是否包含来自 <select> 元素的值：

    var valueKeys = [];
    $(".keySelector").each(function(){
        valueKeys.push($(this).val());
    });
    if (geoAttrs[selectedGeoAttr].rowCol == "row") {
        Object.keys(colValueGroups).forEach(function(group) {
            var groupHasAllKeys = true;
                valueKeys.forEach(function(key) {
                    if (group.indexOf(key) == -1 ) {
                        groupHasAllKeys = false;
                    }
                });
            if(groupHasAllKeys) {
                mapData = colValueGroups[group];
            }  
        });
    } else if (geoAttrs[selectedGeoAttr].rowCol == "col") {
        Object.keys(rowValueGroups).forEach(function(group) {
            var groupHasAllKeys = true;
                valueKeys.forEach(function(key) {
                    if (group.indexOf(key) == -1 ) {
                        groupHasAllKeys = false;
                    }
                });
            if(groupHasAllKeys) {
                mapData = rowValueGroups[group];
            }  
        });
    } 

一定有更好的方法，对吧？这到底是怎么回事？

编辑：rowValueGroups 可能看起来像这样：

{
  "35_to_44_yearsMale": {
    "4654387684": {
      "value": 215
    },
    "4654387685": {
      "value": 175
    },
    "4654387686": {
      "value": 687
    },
    "4654387687": {
      "value": 172
    }
  },
  "45_to_54_yearsMale": {
    "4654387684": {
      "value": 516
    },
    "4654387685": {
      "value": 223
    },
    "4654387686": {
      "value": 54
    },
    "4654387687": {
      "value": 164
    }
  }
}

valueKeyString 应该是 "45_to_54_yearsMale" 或类似的。

这是调查数据。我正在从 nicolaskruchten/pivottable 自定义渲染器的输出中提取 rowValueGroups 数据。 （如果你好奇的话，特别是来自pivotData.tree 对象）。我不想改变可枢转核心来改变这些键的格式，所以我只是想我会从一个选择元素中连接几个值以使其工作。

以下是上述测试的部分控制台输出：

35_to_44_yearsMale51 53 95 116 111 95 52 52 95 121 101 97 114 115 0 77 97 108 101
35_to_44_yearsMale51 53 95 116 111 95 52 52 95 121 101 97 114 115 77 97 108 101

第一行是对 valueKeyString 进行的测试，第二行是对来自rowValueGroups 的一个键进行的测试。请注意，初始字符串看起来相同，（Firefox 控制台实际上在“years”和“Male”之间为valueKeyString 输出了一个未找到的小方块）但charCodeAt() 出现了那个奇怪的 0 字符连接点。

Answer 1

您的字符串中有null 个字符。此正则表达式将删除它们：

valueKeyString = valueKeyString.replace( /\0/g, '' )

参考：Removing null characters from a string in JavaScript

Answer 2

如果您识别出字符代码，您可以尝试使用其代码替换它：

var valueKeyString = "";
$(".keySelector").each(function(){
    valueKeyString += $(this).val();
});
valueKeyString = valueKeyString.replace(new RegExp(String.fromCharCode(0),"g"),'');

或者假设字符串已经直接来自 jquery $(this).val() 的 \0-terminated 您可以尝试另一种方法：

var valueKeyString = "";
$(".keySelector").each(function(){
    s = $(this).val();
    if ( s.charCodeAt(s.length - 1) == 0 )
        s = s.substring(0, s.length - 1);
    valueKeyString += s;
});

上面的 sn-p 检查从$(this).val() 新获得的每个字符串的最后一个字符是否为空终止（只是为了确定），并用substring() 删除最后一个字符。

Answer 3

由于你使用的是 jQuery，你可以试试trim():

var valueKeyString = "";
$(".keySelector").each(function(){
    valueKeyString += $(this).val().trim();
});