0

以下代码片段执行以下操作：

给定一个类似: 的字符串 "key1=value1;key2=value2;key3=value3"，它将执行 key1 的查找并使用 jQuery 将 value 设置为 value1： 

$("#key1").val("value1");

我的目标是不假设字符串的格式正确，因此它可能没有 a ;，或者它可能没有=. 所以代码应该保护自己不崩溃。

如何使用正确的 javascript 样式/习语来改进这一点：

var myString = "key1=value1&key2=value2;key3=value3";
var kvp = myString.split(";");
if (kvp && kvp.length) {
    for (var x = 0; x < kvp.length; x++) {
        var parts = kvp[x];
        if (parts && parts.length && parts.indexOf("=") >= 0) {
           var kv = parts.split("=");
           $("#" + kv[0]).val(kv[1]);
        }
    }
}
4

1 回答 1

0

我会将其拆分为一个解析字符串的函数和一个执行 DOM 操作的函数。就像是：

function parseString (str, sep, eq) {
  sep = sep || ';';
  eq = eq || '=';

  var result = {};

  if(!str)
    return result;

  var pairs = str.split(sep);
  for (var i = 0, len = pairs.length; i < len; i++) {
    var pair = pairs[i].split(eq);

    // Disregard if we don't have a key
    if(!pair[0].length)
      continue;

    result[pair[0]] = pair[1];
  }

  return result;
}

function setValues(params) {
  for(id in params)
    $('#' + id).value(params[id]);
}

// Add values for ids as specified in myString

var myString = "key1=value1;key2=value2;key3=value3";
setValues(parseString(myString));

更新：

如果您知道代码将在现代 JS 引擎上运行，您可以使用Array.prototype.map和Array.prototype.reduce以获得更简洁的代码。这仅适用于符合 ES5 的引擎（即，不适用于 IE < 9）。

function parseString (str, sep, eq) {
  sep = sep || ';';
  eq = eq || '=';

  if(!str)
    return {};

  function splitPair (pair) { return pair.split(eq) }

  function addResult (result, pair) {
    if(pair[0].length)
      result[pair[0]] = pair[1];

    return result;
  }

  return str.split(sep)
    .map(splitPair)
    .reduce(addResult, {});
}

使用示例parseString：

console.log(parseString('key1=value1;key2=value2;key3=value3'));
{ key1: 'value1', key2: 'value2', key3: 'value3' }

console.log(parseString('=value1;key2=value2;key3=value3'));
{ key2: 'value2', key3: 'value3' }

console.log(parseString(';key1=value1;key2=value2;key3=value3'));
{ key1: 'value1', key2: 'value2', key3: 'value3' }

console.log(parseString('key1=value1;key2=value2;key3=value3;'));
{ key1: 'value1', key2: 'value2', key3: 'value3' }

console.log(parseString('key1=value1'));
{ key1: 'value1' }

console.log(parseString('key1='));
{ key1: '' }

console.log(parseString('key1'));
{ key1: undefined }

console.log(parseString(''));
{}

console.log(parseString());
{}
于 2012-08-22T14:38:16.543 回答