JavaScript和PHP的結合是網站前端開發人員必備技能之一，PHP處理網站后端邏輯，JavaScript則用于網站前端展示。而JSON便是PHP和JavaScript數據交互的最佳方式，因為它的易讀性和可編程性。本篇文章會針對如何在JavaScript中讀取由PHP返回的JSON數據進行一一介紹。

首先，我們需要了解PHP如何生成JSON數據，如下所示。

"John", "age"=>30, "city"=>"New York");
echo json_encode($data);
?>

上述代碼使用了json_encode()函數將一個數組轉換成JSON格式。現在，我們假設我們有一個名為"data.php"的PHP文件，用于向JavaScript傳遞JSON數據，我們可以使用AJAX將其抓取下來。

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
var data = JSON.parse(this.responseText);
console.log(data);
}
};
xhttp.open("GET", "data.php", true);
xhttp.send();

上述代碼用于使用JavaScript中的AJAX技術將PHP文件"data.php"返回的JSON數據抓取下來，并將其存儲在一個名為"data"的變量中，以便日后在代碼中調用。在AJAX請求返回時，我們使用JSON.parse()函數將JSON字符串轉換成JavaScript對象。

如果我們需要將JSON數據傳遞到另一個PHP腳本，我們可以使用以下代碼：

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
var data = JSON.parse(this.responseText);
var postData = "name=" + data.name + "&age=" + data.age + "&city=" + data.city;
var xhr = new XMLHttpRequest();
xhr.open('POST', 'postData.php', true);
xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
xhr.onreadystatechange = function() {
if(xhr.readyState == 4 && xhr.status == 200) {
console.log(xhr.responseText);
}
}
xhr.send(postData);
}
};
xhttp.open("GET", "data.php", true);
xhttp.send();

在上述代碼中，我們首先從"data.php"獲取JSON數據，然后將其存儲在"data"變量中。然后，我們使用這些數據來構建一個包含"name"、"age"和"city"鍵/值對的查詢字符串。隨后，我們使用另一個AJAX請求將此字符串提交到“postData.php”文件，用于在服務器端調用。

總之，使用PHP和JavaScript來創建動態交互性的網站是一件有趣又有價值的事情。JSON是一個非常有用的格式，可以簡化PHP和JavaScript之間數據傳輸的過程。這個過程需要您對JavaScript和PHP具備一定的熟悉度，并且有實際的項目經驗。但是，一旦您充分掌握了應用，就能提升您作為開發人員的能力和價值。