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

回答

相關問題