Question

我在理解字典中所选数组的返回方面有些麻烦。希望你能给我一个解释。顺便说一下，该语言是javascript。

我创建了一个带有一些数组作为值的字典。当使用正确的键选择值时，我的输出是一个包含我的数组值的数组。我期望直接拥有我的数组值。

编辑：创建字典似乎是问题所在。假设两个字典是相同的。这是日志的屏幕截图： chromelog

var dictionary1 = {"key1" : ["element10","element11"], "key2":["element20","element21"]};

$.each($(".select-filters"),function(i,v) { //select all filters 
        if (dic_results[$(this).attr("name")] == null) { // if the list don't exist create it
            dic_results[$(this).attr("name")] = []
        }
        dic_results[$(this).attr("name")].push($(this).val()); //push the value inside the array
    });

console.log(dictionary["key1"]); //return the correct value ["element10",element11"]

console.log(dic_results["key1"]);//return [Array(1)] expecting ["element10",element11"]
console.log(dic_results["key1"][0]);//return ["element10",element11"]

Answer 1

您需要像这样将字符串用作键：

var dictionary = {"key1" : ["element10","element11"], "key2":["element20","element21"]};
console.log(dictionary["key1"]); //returns ["element10",element11"]
console.log(dictionary["key1"][0]); //returns the correct value "element10"

Answer 2

如果您的HTML中有一个multi select元素，那么您会得到这个，因为$(this.val())将返回所有选定选项的数组：

var dic_results = {};
$.each($(".select-filters"), function(i, v) { //select all filters 
  if (dic_results[$(this).attr("name")] == null) { // if the list don't exist create it
    dic_results[$(this).attr("name")] = []
  }
  dic_results[$(this).attr("name")].push($(this).val()); //push the value inside the array
});

console.log(dic_results["key1"]); //return [Array(1)] expecting ["element10",element11"]
console.log(dic_results["key1"][0]); //return ["element10",element11"]

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select class="select-filters" name="key1" multiple>
  <option value="element10" selected>10</option>
  <option value="element11" selected>11</option>
  <option value="element12">12</option>
</select>

由于您不希望在数组中使用数组，因此只需使用spread syntax ...将结果的每个元素添加到数组中即可：

var dic_results = {};
$.each($(".select-filters"), function(i, v) {
  if (dic_results[$(this).attr("name")] == null) {
    dic_results[$(this).attr("name")] = []
  }
  dic_results[$(this).attr("name")].push(...$(this).val());
});

console.log(dic_results["key1"]); //returns ["element10",element11"]
console.log(dic_results["key1"][0]); //returns "element10"

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select class="select-filters" name="key1" multiple>
  <option value="element10" selected>10</option>
  <option value="element11" selected>11</option>
  <option value="element12">12</option>
</select>

或者，如果您不想使用ES6，可以在Array#push上使用Function#apply在ES5中执行以下操作：

var dic_results = {};
$.each($(".select-filters"), function(i, v) {
  if (dic_results[$(this).attr("name")] == null) {
    dic_results[$(this).attr("name")] = []
  }
  //make a local variable for convenience because we have to repeat it
  var arr = dic_results[$(this).attr("name")];
  arr.push.apply(arr, $(this).val());
});

console.log(dic_results["key1"]); //returns ["element10",element11"]
console.log(dic_results["key1"][0]); //returns "element10"

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select class="select-filters" name="key1" multiple>
  <option value="element10" selected>10</option>
  <option value="element11" selected>11</option>
  <option value="element12">12</option>
</select>

但是，如果混合使用多个选择元素和其他表单元素，则可能会遇到问题，因为单个项目将被视为整个数组和字符串，这意味着您将获得一个包含每个单独字符的数组：

var dic_results = {};
$.each($(".select-filters"), function(i, v) {
  if (dic_results[$(this).attr("name")] == null) {
    dic_results[$(this).attr("name")] = []
  }
  dic_results[$(this).attr("name")].push(...$(this).val());
});

console.log(dic_results); 
console.log(dic_results["key1"]); //returns ["element10", "element11"]
console.log(dic_results["key2"]); //returns ["e", "l", "e", "m", "e", "n", "t", "2", "0"]

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<select class="select-filters" name="key1" multiple>
  <option value="element10" selected>10</option>
  <option value="element11" selected>11</option>
  <option value="element12">12</option>
</select>

<input type="text" class="select-filters" name="key2" value="element20" />

因此，如果您想同时处理这两种情况，则可以使用Array#concat()-如果给定一个项目，它将创建一个包含该项目的新数组；如果给定一个数组，它将将该项目加入到当前项目中。。这在ES6和ES5中均适用：

var dic_results = {};
$.each($(".select-filters"), function(i, v) {
  if (dic_results[$(this).attr("name")] == null) {
    dic_results[$(this).attr("name")] = []
  }
  
  dic_results[$(this).attr("name")] = dic_results[$(this).attr("name")]
    .concat($(this).val());
});

console.log(dic_results); 
console.log(dic_results["key1"]); //returns ["element10", "element11"]
console.log(dic_results["key2"]); //returns ["element20"]

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<select class="select-filters" name="key1" multiple>
  <option value="element10" selected>10</option>
  <option value="element11" selected>11</option>
  <option value="element12">12</option>
</select>

<input type="text" class="select-filters" name="key2" value="element20" />

这有点冗长，但是您可以使用局部变量来缩短重复：

var dic_results = {};
$.each($(".select-filters"), function(i, v) {
  var key = $(this).attr("name");
  if (dic_results[key] == null) {
    dic_results[key] = []
  }
  
  dic_results[key] = dic_results[key]
    .concat($(this).val());
});

console.log(dic_results); 
console.log(dic_results["key1"]); //returns ["element10", "element11"]
console.log(dic_results["key2"]); //returns ["element20"]

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<select class="select-filters" name="key1" multiple>
  <option value="element10" selected>10</option>
  <option value="element11" selected>11</option>
  <option value="element12">12</option>
</select>

<input type="text" class="select-filters" name="key2" value="element20" />

Answer 3

“ key1”是变量吗？它不是字符串。

var dictionary = {"key1" : ["element10","element11"], "key2":["element20","element21"]};
console.log(dictionary["key1"]);

Answer 4

您正在使用括号表示法。您需要在[]中编写一个表达式。因此，key1中的[]将引用名称为key1的变量。

您应该使用字符串"key1"

var dictionary = {"key1" : ["element10","element11"], "key2":["element20","element21"]};
console.log(dictionary['key1'][0]);

知道属性名称后，最好使用点表示法。

var dictionary = {"key1" : ["element10","element11"], "key2":["element20","element21"]};
console.log(dictionary.key1[0]);

为什么我的数组在字典值的另一个数组内？

4 个答案: