JavaScript对象中对象的数组，不同使用的console.log

我的代码：JavaScript对象中对象的数组，不同使用的console.log

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>Test</title> 
</head> 

<body> 
    <script> 
     var students = []; 
     var student = {}; 
     var scores = []; 
     var final = []; 

     function setStudent(name , score) { 
      student = {"Name": name, "Score": score}; 
      //student.Name = name; 
      //student.Score = score; 
      document.write(student.Name + " scored " + student.Score + ".<br>"); 
      final.push(student); 
      return student; 

     } 


     for (var i=0; i<4; i++) { 
      students.push(prompt("Please Enter student name")); 
     } 

     for (var i=0; i<4; i++) { 
      scores.push(prompt("Please Enter "+ students[i] +"'s score")) 
     } 
     for (var i=0; i<4; i++) { 
      setStudent(students[i],scores[i]); 

     } 

     console.log(final); 
    </script> 
</body> 
</html>

这是工作的，控制台输出这个样子的第一个版本： Image can be found at http://i.imgur.com/HnEHX5J.png

虽然第二个版本是：

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>Test</title> 
</head> 

<body> 
    <script> 
     var students = []; 
     var student = {}; 
     var scores = []; 
     var final = []; 

     function setStudent(name , score) { 
      //student = {"Name": name, "Score": score}; 
      student.Name = name; 
      student.Score = score; 
      document.write(student.Name + " scored " + student.Score + ".<br>"); 
      final.push(student); 
      return student; 

     } 


     for (var i=0; i<4; i++) { 
      students.push(prompt("Please Enter student name")); 
     } 

     for (var i=0; i<4; i++) { 
      scores.push(prompt("Please Enter "+ students[i] +"'s score")) 
     } 
     for (var i=0; i<4; i++) { 
      setStudent(students[i],scores[i]); 

     } 

     console.log(final); 
    </script> 
</body> 
</html>

该版本的输出是： You can find image at https://i.stack.imgur.com/0mQFz.png

以防万一你不知道发生了什么变化看看对象分配的功能我的问题是，为什么输出不同。

来源

2017-05-30 alanx0401

您不是在setStudent函数中声明变量student。因此，the variable student is defined on the global object window。当你运行这个方法时，你每次都使用同一个指针，这样就改变了同一个指针的值，并将相同的对象重新添加到数组中。

要修正这个错误，只是声明了一个student到一个空的对象字面{}

我的问题是，为什么输出不同

为什么输出不同的是，因为document.write将转换的原因对象在当前点时间到string。在console.log中，在展开console.log中的箭头时抓取子对象的子属性。如果您在每次分配后克隆了对象或使用了JSON.stringify，然后console.log通过了这些对象，那么console.log的输出将如预期那样。

var students = []; 
 
var student = {}; 
 
var scores = []; 
 
var final = []; 
 

 
function setStudent(name, score) { 
 
    //student = {"Name": name, "Score": score}; 
 
    // ERROR HERE 
 
    // you're not declaring the variable `student` therefore, the variable `student` is defined on the global object `window`. When you run this method, you're using the same pointer every time and thus changing the pointer and readding it to the array. 
 
    var student = {}; // this is the fix 
 
    student.Name = name; 
 
    student.Score = score; 
 
    document.write(student.Name + " scored " + student.Score + ".<br>"); 
 
    final.push(student); 
 
    return student; 
 

 
} 
 

 

 
for (var i = 0; i < 4; i++) { 
 
    students.push(prompt("Please Enter student name")); 
 
} 
 

 
for (var i = 0; i < 4; i++) { 
 
    scores.push(prompt("Please Enter " + students[i] + "'s score")) 
 
} 
 
for (var i = 0; i < 4; i++) { 
 
    setStudent(students[i], scores[i]); 
 

 
} 
 

 
console.log(final);

来源

2017-05-30 03:27:07

谢谢！所以我的错误是误解了变量的范围。 – alanx0401

JavaScript对象中对象的数组，不同使用的console.log

回答

相关问题