如何document.write javascript对象 [英] How to document.write javascript object

问题描述

这是我的JavaScript对象

here is my javascript object

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，但是它只写未定义的.

What I should do for document.write variable students? I have created for in loop but it writes only undefined.

for ( var studentsList in students ) {
    document.write(studentsList[students]);
}

目标是为此写文件

名称:"Pavel Ravel"， 曲目:"CSS，HTML5，jQUery"， 成就:"145"， 点:"353"

name: "Pavel Ravel", track: "CSS, HTML5, jQUery", achievements: "145", points: "353"

以此类推

推荐答案

不要对数组使用for/in循环，因为它们将字符串用作枚举器，并将枚举数组的所有属性(仅包含索引元素).使用传统的计数for循环或forEach().

Don't use for/in loops with arrays as they use strings as the enumerator and will enumerate all properties of the array (beyond just the indexed elements). Use a traditional counting for loop or forEach().

此外，除非您要动态地将新页面内容构建到新的window中，否则请不要使用document.write()，因为它需要按顺序构建页面.否则，请使用console.log()进行测试和DOM注入.

Also, unless you are dynamically building new page content into a new window, don't use document.write() as it requires the page to be built sequentially. Use console.log() for testing and DOM injection otherwise.

解决方案1 ​​(获取您所说的确切输出-有关详细信息，请参见内联注释):

Solution 1 (gets the exact output you said you wanted - see comments inline for details):

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 (显示如何提取对象属性名称和值，以便您可以使用

Solution 2 (shows how to extract the object property names and the values so you can do whatever you want with them using Array.forEach() - see comments inline for details):

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] + '"'); 
  }
 
});

这篇关于如何document.write javascript对象的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！