这是我的javascript对象
var students = [
{
name: "Pavel Ravel",
track: "CSS, HTML5, jQUery",
achievements: "145",
points: "353"
},
{
name: "Steve Jobs",
track: "MacOS, iOS",
achievements: "3958735",
points: "09854"
},
{
name: "Bill Gates",
track: "Windows",
achievements: "358798",
points: "37593"
},
{
name: "Gabe Newel",
track: "Steam",
achievements: "5302",
points: "3052"
},
{
name: "Steve Wozniak",
track: "Apple 1 and 2",
achievements: "23562",
points: "3525632"
}
];
我应该为document.write变量学生做些什么？我已经创建了for循环，但它只写了undefined。
for ( var studentsList in students ) {
document.write(studentsList[students]);
}
目标是写入此文档
名称：“Pavel Ravel”， track：“CSS，HTML5，jQUery”， 成就：“145”， 要点：“353”
等等
答案 0 :(得分：2)
不要对数组使用for/in循环，因为它们使用字符串作为枚举器，并将枚举数组的所有属性（不仅仅是索引元素）。使用传统的计数for循环或forEach()。
此外，除非您将新的网页内容动态构建为新的window，否则请不要使用document.write()，因为它需要按顺序构建网页。否则使用console.log()进行测试和DOM注入。
解决方案1 （获取您想要的确切输出 - 请参阅内联评论以获取详细信息）：
var students = [
{
name: "Pavel Ravel",
track: "CSS, HTML5, jQUery",
achievements: "145",
points: "353"
},
{
name: "Steve Jobs",
track: "MacOS, iOS",
achievements: "3958735",
points: "09854"
},
{
name: "Bill Gates",
track: "Windows",
achievements: "358798",
points: "37593"
},
{
name: "Gabe Newel",
track: "Steam",
achievements: "5302",
points: "3052"
},
{
name: "Steve Wozniak",
track: "Apple 1 and 2",
achievements: "23562",
points: "3525632"
}
];
var output = []; // Used to hold extracted data
// Loop through the array of objects
for ( var i = 0; i < students.length; ++i ) {
// Loop over the current object use for/in for this
for(var student in students[i]){
// In this loop, student will be the property names we enumerate over
// To get the property name, just use the enumerator (student)
// To get the value of the property, pass that property name to the object
// which, in this case, is the array element we are already looping over.
// Note: This string is put together exactly as your question asked:
output.push(student + ":" + '"' + students[i][student] + '"');
}
}
// To join all the new array values with a comma
console.log(output.join(","));
解决方案2 （显示了如何提取对象属性名称和值，以便您可以使用 Array.forEach() 对其执行任何操作 - 请参阅内联注释详情）：
var students = [
{
name: "Pavel Ravel",
track: "CSS, HTML5, jQUery",
achievements: "145",
points: "353"
},
{
name: "Steve Jobs",
track: "MacOS, iOS",
achievements: "3958735",
points: "09854"
},
{
name: "Bill Gates",
track: "Windows",
achievements: "358798",
points: "37593"
},
{
name: "Gabe Newel",
track: "Steam",
achievements: "5302",
points: "3052"
},
{
name: "Steve Wozniak",
track: "Apple 1 and 2",
achievements: "23562",
points: "3525632"
}
];
// Loop through the array of objects executing the supplied
// function for each one encountered (the "student" argument
// of the supplied function will refer to each element in the
// array that is enumerated - individual student objects in
// this case, hence the name "student")
students.forEach(function(student) {
// Loop over the current object. Use for/in or Object.keys() for this
for(var prop in student){
// In this loop, student will be the property names we enumerate over
// To get the property name, just use the enumerator (prop)
// To get the value of the property, pass that property name to the object
// which, in this case, is the array element we are already looping over.
console.log(prop + ":" + '"' + student[prop] + '"');
}
});
答案 1 :(得分：1)
您可以使用JSON.strinify()：
var students = [
{
name: "Pavel Ravel",
track: "CSS, HTML5, jQUery",
achievements: "145",
points: "353"
},
{
name: "Steve Jobs",
track: "MacOS, iOS",
achievements: "3958735",
points: "09854"
},
{
name: "Bill Gates",
track: "Windows",
achievements: "358798",
points: "37593"
},
{
name: "Gabe Newel",
track: "Steam",
achievements: "5302",
points: "3052"
},
{
name: "Steve Wozniak",
track: "Apple 1 and 2",
achievements: "23562",
points: "3525632"
}
];
document.write(JSON.stringify(students));
答案 2 :(得分：1)
您可以使用<div>作为输出，并附加文字和换行符<br>。
var students = [{ name: "Pavel Ravel", track: "CSS, HTML5, jQUery", achievements: "145", points: "353" }, { name: "Steve Jobs", track: "MacOS, iOS", achievements: "3958735", points: "09854" }, { name: "Bill Gates", track: "Windows", achievements: "358798", points: "37593" }, { name: "Gabe Newel", track: "Steam", achievements: "5302", points: "3052" }, { name: "Steve Wozniak", track: "Apple 1 and 2", achievements: "23562", points: "3525632" }];
students.forEach(function (o) {
this.appendChild(document.createTextNode(Object.keys(o).map(function (k) {
return k + ': ' + JSON.stringify(o[k]);
}).join(', ')));
this.appendChild(document.createElement('br'));
}, document.getElementById('out'));<div id="out"></div>
答案 3 :(得分：0)
尝试
students.map(x=>document.write(Object.keys(x).map(y=>` ${y}: "${x[y]}"`)+"<br>"));
var students = [
{
name: "Pavel Ravel",
track: "CSS, HTML5, jQUery",
achievements: "145",
points: "353"
},
{
name: "Steve Jobs",
track: "MacOS, iOS",
achievements: "3958735",
points: "09854"
},
{
name: "Bill Gates",
track: "Windows",
achievements: "358798",
points: "37593"
},
{
name: "Gabe Newel",
track: "Steam",
achievements: "5302",
points: "3052"
},
{
name: "Steve Wozniak",
track: "Apple 1 and 2",
achievements: "23562",
points: "3525632"
}
];
students.map(x=>document.write(Object.keys(x).map(y=>` ${y}: "${x[y]}"`)+"<br>"));