1. 程式人生 > >前臺JSON字串轉換為JSON物件

前臺JSON字串轉換為JSON物件

開發中我們常常會使用到JSON物件,那麼我們在前臺怎樣將一個JSON字串轉換為JSON物件呢。
在這裡我提供了兩種方法,當然這兩種方法網上都是已經有的,我也只是整理一下更方便各位檢視而已。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<!-- 
	在前天如何將JSON字串變為JSON物件
 -->
<script type="text/javascript">
	var jsonStr = '[{cityId:"101",cellId:"1011",cellName:"綠色家園0"},'+
			'{cityId:"101",cellId:"1014",cellName:"綠色家園1"},'+
			'{cityId:"101",cellId:"1015",cellName:"綠色家園2},'+
			'{cityId:"101",cellId:"1016",cellName:"綠色家園3"},'+
			'{cityId:"101",cellId:"1017",cellName:"綠色家園4"}]';
	console.log("json字串:"+jsonStr);
	// 方法一
	var jsonObj1 = eval('(' + jsonStr + ')');
	// 方法二
	var jsonObj2 = (new Function('return '+jsonStr +';'))();
	
	console.log("json物件1:"+ jsonObj1);
	console.log(jsonObj1[0].cellName);
	console.log("json物件2:"+ jsonObj2);
	console.log(jsonObj2[3].cellName);
</script>

</head>
<body>
<h3>在前臺將JSON字串轉換為JSON物件</h3>

</body>
</html>

這兩種方法的好處就是不用引用任何js,並且支援火狐、谷歌、IE7以上的(IE6沒有測試)。

在火狐中控制檯輸出資訊如下:


如果圖片看不清楚,請按著自己鍵盤的 "Ctrl" + “滑鼠滾動條”,也就是放大瀏覽器頁面即可看清圖片。