迭代来自PHP的回显json编码数组的javascript对象

I'm trying to get values from a PHP array in Javascript and populate a chart.

我试图从Javascript的PHP数组中获取值并填充图表。

The problem is I believe that the javascript variable is not receiving the values.

问题是，我认为javascript变量没有接收值。

I tried printing out the values, but nothing happens. Also it shows as object instead of an array, i don't know if it's suppose to be like that.

我试着打印出这些值，但什么都没发生。它也显示为对象而不是数组，我不知道它是不是这样。

Any help will be greatful.

任何帮助都是非常好的。

The PHP array when printed out:

PHP数组打印出来时:

print_r("<pre>"); 
print_r($exam_grades);
print_r("</pre>");

Array
(
    [History] => 70
    [Sociology] => 40
    [Psychology] => 32
    [Criminology] => 64
)

JS:

var exam_grades = <?php echo json_encode($exam_grades );?>;
alert(exam_grades.length); // this shows as undefined
for (var i = 0; i < exam_grades.length; i++) {

    // do something      
}

4 个解决方案

#1

As an alternative, you could also use for in to iterate thru the object:

作为替代方案，您还可以使用in对对象进行迭代:

<?php $exam_grades = array('History' => 70, 'Sociology' => 40, 'Psychology' => 32, 'Criminology' => 64); ?>
<script type="text/javascript">
var exam_grades = <?php echo json_encode($exam_grades); ?>;
for(var key in exam_grades) {
    var value = exam_grades[key];
    console.log(key + ': ' + value);
}
</script>

Sample Output

样例输出

#2

Your problem is that the JS Array haven't associative indexes, so your PHP array turns into a JS object. You could try to rewrite your PHP array like this:

你的问题是JS数组没有关联索引，所以你的PHP数组变成了一个JS对象。您可以尝试重写PHP数组，如下所示:

$grades = [
    ['exam' => 'History', 'grade' => 70],
    ['exam' => 'Sociology', 'grade'  => 40],
    ['exam' => 'Psychology', 'grade'  => 32],
    ['exam' => 'Criminology', 'grade'  => 64]
];

Then you can iterate fine on JS, after the json_encode.

然后可以在json_encode之后对JS进行精细的迭代。

#3

A php associative array will json encode into a javascript object, because javascript does not have true associative arrays as php does. The length is undefined because javascript objects do not have a native length property. To loop thru the object you can do:

php关联数组将json编码到javascript对象中，因为javascript不像php那样具有真正的关联数组。长度没有定义，因为javascript对象没有本机长度属性。循环遍历你可以做的对象:

for (var key in exam_grades) 
{ if (exam_grades.hasOwnProperty(key)) { 
    console.log(key + " -> " + exam_grades[key]);
    }
}

#4

The variable is an object (because the array in PHP has string keys), which you can iterate over using Object.keys():

变量是一个对象(因为PHP中的数组有字符串键)，您可以使用object .keys()对其进行迭代:

Object.keys(exam_grades).forEach(function(key) {
    console.log(key + ': ' + exam_grades[key]);
});

Do note that object properties in JavaScript aren't ordered by definition, so if that's important, you should consider creating a numerically indexed array in PHP.

请注意，JavaScript中的对象属性不是按定义排序的，所以如果这很重要，您应该考虑在PHP中创建一个数字索引数组。

#1