為什么我的JavaScript代碼沒有通過document.write（）產生任何輸出？

Question

加載此簡單的Java腳本代碼時出現問題

<script type="text/javascript">
var customer={
     name:"Suresh"
     speak:function(){
       return "my name is" +this.name;
     }
     address:{
       street:"188 sector-5 MVP colony",
       city:"Visakhapatnam",
       state: "AP"
     }
};
document.write(customer.speak()+"<br/>");
document.write(customer.name+"lives at"+ customer.address.street+",<br/>");
</script>

Answer 1

歡迎使用堆棧溢出。 社區通常很樂意為這樣的問題提供幫助，但實際上，讓您更好地學習如何解決這些問題會更好。 畢竟，幾乎每次遇到錯誤時，您幾乎都無法發布到SO。

在這種情況下，找出此問題的最佳方法是什么？ 這類似於找出為什么烤面包機不工作的原因。 首先，檢查以確保已插入電源。然后，嘗試使用其他插座。 或者，嘗試將其他設備插入相同的插座以查看其是否有效。 等等。 這是稱為“故障隔離”的基本思想。

您可能認為您對document.write有問題（順便提一下，正如其他人所提到的，應避免使用－使用console.log ）。 要對此進行測試，請編寫一個單獨的小程序，該程序僅執行一個document.write("Hi, Sasi"); 。 它行得通嗎？ 然后，您知道document.write在工作，並且您在正確使用它。

現在回到越野車程序。 第一件事就是簡單地使用所有可用的工具來幫助您發現任何明顯的錯誤。 您應該使用編輯器或IDE，該編輯器可以使語法高亮顯示並可能指示語法錯誤-例如帶有紅色彎曲的下划線。 如果您不使用編輯器或IDE，請放棄正在執行的所有其他操作，找到一個不錯的工具，然后花時間學習和設置它。

另一個有用的工具稱為“ linter ”，它可以檢查您的JS代碼是否存在常見錯誤和潛在問題。 了解什么是短絨毛，以及如何使用它，然后選擇其中一種，例如“ eslint”。 要使用linter，您可能必須將JS放入單獨的JS文件中，並使用<script src="path/to/my/test.js">類的標簽將其引入HTML。 無論如何，您都應該這樣做。 現在做。

接下來，我們在Chrome瀏覽器中提供了非常有用的開發者控制台 。 如果您不知道這是什么或從未使用過，請再次放棄您正在做的所有其他事情，並詳細研究其文檔。 它具有許多方便的功能，但是在這種情況下，重要的是它將向您顯示代碼中的語法（和運行時錯誤）。 例如，當我剪切代碼並將其粘貼到控制台中時，它立即給我錯誤

Uncaught SyntaxError: Unexpected identifier

我馬上就知道，甚至在我需要擔心邏輯或document.write出現問題之前，我的程序中都存在語法錯誤。 此外，它將指出發生錯誤的確切行：以speak:開頭的行。 為什么speak “意外標識符”？ 如果您現在不能自行解決問題，則可以采用“分而治之”的方法。 例如，嘗試刪除整個speak方法。 但是我仍然在address成員上收到錯誤。 嗯 也許在上面有東西在后面的事情上引起了問題。 嘗試刪除name:"Suresh"上面一行，然后再試一次-你會看到在錯誤speak消失。 因此，您現在知道問題出在這兩行之間或之間。 最終，您應該能夠推斷出省略了對象文字中key: value對之間的逗號，希望通過閱讀諸如this這樣的文檔可以了解這一點 。

您只需標記一個鍵列表： 用逗號分隔的值對。

希望以上內容是在至少遇到真正需要發布到SO的更復雜問題之前，至少跟蹤代碼中大多數簡單錯誤的良好起點。

Answer 2

首先，對象缺少逗號，應使用逗號分隔對象的屬性。 而且正如@AndrewLi所建議的，不要使用document.write() 。 以下是工作代碼的演示。 請參閱使用document.write（）的缺點

 var customer={ name:"Suresh", speak:function(){ return "my name is " + this.name; }, address:{ street:"188 sector-5 MVP colony", city:"Visakhapatnam", state: "AP" } }; console.log(customer.speak()); console.log(customer.name+"lives at"+ customer.address.street);