SON ဆိုတာ JavaScript Object Notation ကုိေခၚတာပါ ။ JSON ကုိ Web applications ေတြမွာ အဓိကသံုးပါတယ္။
စာသားအခ်က္အလက္ေတြကုိ User ဆီမွာ ျမန္ျမန္ဆန္ဆန္Out put ေဖာ္ျပေပးႏိုင္ဖို႕အတြက္ အဓိကသံုးပါတယ္ ။
ဒီလိုေဖာ္ျပ တဲ့ေနရာမွာ JSON မသံုးပဲတစ္ျခား WebTechnology တစ္ခုခုသံုးမယ္ဆုိ လည္းရပါတယ္ ။
ဒါေပမယ့္လည္း ေရးဖို႕လြယ္ကူတာ၊ Light weight ျဖစ္တာ ၊ Lenguage Strong
ျဖစ္တာ စတဲ့အားသာခ်က္ေတြေၾကာင့္ JSON ဟာ Web နည္းပညာနယ္ပယ္မွာေရပန္းစားလာခဲ့တာျဖစ္ပါတယ္။
စတင္မယ့္ Beginner ေတြအတြက္ JSON တစ္ခုဘယ္လိုေရးရမလဲ ဆိုတာ ရွင္းျပပါမယ္။ Language ေတြရဲ႕ထံုးစံအတိုင္း
var ဆိုတဲ့Keyword သံုးၿပီးvariable ေၾကျငာရပါတယ္။ သူက String အေနနဲ႕အလုပ္လုပ္တာျဖစ္လို႕ Data type
ထည့္ေပးဖို႕မလိုပါဘူး ။variable ကုိ ' abe' (or) "abc" ဆိုၿပီးဆင္ေျပသလိုေရးလို႕ရပါတယ္ ။ေၾကျငာၿပီးတာနဲ႕ အဲဒီ data ကုိ
Object အေနနဲ႕တန္းသံုးလို႕ရပါၿပီ ။JSON string ေတြမွာObject ေတြကို name : value ပါတဲ့စံုတြဲေလးေတြအျဖစ္ ေၾကျငာေပး
ရပါတယ္။ array ပံုစံမ်ိဳးသံုးမယ္ဆိုရင္ ေထာင့္ကြင္း [ ႏွင့္ ] ေဖာ္ျပရပါတယ္။ var အစုအေ၀းကုိ Scope { နဲ႕ } ပိတ္ေပးရပါတယ္။
Value တစ္ခုနဲ႕တစ္ခုၾကားမွာေတာ့ (,) ေလးနဲ႕ခြဲထားေပးရပါတယ္။
နားရွင္းသြားေအာင္ေအာက္ကပံုေလးကုိၾကည့္ၾကည့္ပါ။
var jobject= {
"name": "Jhon",
"age": "33",
"phone": "09-33046955",
"movies":['Spiderman','Batman','Superman']
};
name နဲ ့ value ေလးကိုေတာ့ (:) နဲ ့ခြဲထားပါတယ္..။
"movies":['Spiderman','Batman','Superman'] ဆိုတာက array ပါ ။
value ေတြေနရာမွာ ဘာေတြ ျဖစ္ႏိုင္လဲဆိုေတာ့ number,
string, boolean , တစ္ျခား array တစ္ခု ဒါမွ မဟုတ္ တစ္ျခား object တစ္ခုခု ပါ၀င္ႏိုင္ပါတယ္။
လက္ေတြ႕ Web form တစ္ခုအစမ္းေလးေရးၾကည့္ရေအာင္ ။ Simple Html form တစ္ခုေလာက္ဆြဲလိုက္ပါ ။
အဲဒီမွာ 'name','age','phone' ဆိုၿပီး label သံုးခုနဲ႕ go ဆိုတဲ့ button တစ္ခုထည့္ပါမယ္။
<html>
<head>
<script type ="text/javascript">
...............
</script>
</head>
<body>
Name : <div id="name"></div> <br/>
Age : <div id="age"></div> <br/>
Phone: <div id="phone"></div> <br/>
<input type="button" value="Go" onclick = "show()" />
</body>
</html>
ခုေန browser မွာ run ၾကည့္ရင္ဘာမွေဖာ္ျပဦးမွာမဟုတ္ပါဘူး။ အခု formမွာ
go button ကုိႏွိပ္ရင္ show() method ကုိသြားအလုပ္လုပ္ခိုင္းထားပါ တယ္။
အဲဒီေနရာမွာ name ,age ,phone အတြက္ JSON နဲ႕data ေလးေတြထည့္ေပးၾကည့္ရေအာင္။
ေအာက္မွာေရးျပထားတာေလးၾကည့္ၾကည့္ပါ။
<html>
<head>
<script type ="text/javascript">
function show(){
var jobject= {
"name": "Jhon",
"age": "33",
"phone": "09-33046955",
};
document.getElementById('name').innerHTML=jobject.name;
document.getElementById('age').innerHTML=jobject.age;
document.getElementById('phone').innerHTML=jobject.phone;
}
</script>
</head>
<body>
Name : <div id="name"></div> <br/>
Age : <div id="age"></div> <br/>
Phone: <div id="phone"></div> <br/>
<input type="button" value="Go" onclick = "show()" />
</body>
</html>
အရင္ဆံုး variables မွာ name ,age ,phone အတြက္ data ေတြေၾကျငာလိုက္မယ္။ၿပီးရင္
div tag ထဲက id ေပးထားတဲ့ name ,age ,phone နဲ႕ JSON var ထဲက name ,age ,phone ကုိ
ခ်ိတ္ဆက္ေပးရမယ္။ အဲလိုခ်ိတ္ေပးႏိုင္ဖို႕ document.getElementById( ) ကုိသံုးလို႕ရပါတယ္။
အေပၚက ဥပမာေလးကုိ json.html extension နဲ႕သိမ္းၿပီး Browser မွာ Run ၾကည့္ပါ ။
go button ေလးကုိႏွိပ္တဲ့အခါ သက္ဆိုင္ရာ data ကုိ ခ်က္ခ်င္း Output ျပေပးတာေတြ႕ရပါလိမ့္မယ္။
<script> ႏွစ္ခု ၾကားထဲ attribute မွာ "text/javascript" ကိုပဲသံုးၿပီးေရးသြားတာေလးကုိသတိျပဳပါ ။
ေအာက္မွာေနာက္ထပ္ေဖာ္ျပထားေပးတာေလးကေတာ့ Online card ဥပမာေလးပါ..။
{
"orderID": 12345,
"shopperName": "John Smith",
"shopperEmail": "johnsmith@example.com",
"contents": [
{
"productID": 34,
"productName": "SuperWidget",
"quantity": 1
},
{
"productID": 56,
"productName": "WonderWidget",
"quantity": 3
}
],
"orderCompleted": true
}
အဲဒီမွာသတိထားၾကည့္ရမွာက
"contents": [
{
CODE:VALUE;
},
{
CODE:VALUE;
}
],
ဆိုတဲ့အပိုင္းေလးပါ ။ ဒါေလးကုိၾကည့္ျခင္းအားျဖင့္ object (name:value) ရဲ့ တန္ဖိုးေနရာမွာ array
တစ္ခုအျဖစ္ေရးလို႕ရသလို အဲဒီ array ထဲမွာလဲ object ေတြ ထည့္သြင္းေရးသားလို႕ရတယ္ဆိုတာ ကုိ
သိႏိုင္ပါတယ္။
အခု အထိ ေဖာ္ျပထားတာေတြက Clinent သပ္သပ္ ေရးထားတာပါ ။ ဒါကုိပဲ PHP ထဲမွာ ဆိုဘယ္လို ဖန္
တီးၿပီးဘယ္လို ဖတ္လို႕ရႏိုင္မလဲ ?တကယ္တမ္း PHP က Lauguage သပ္သပ္ Javascript က
Language သပ္သပ္ပါ ။ ဒါေၾကာင့္မို႕ Javascript ကုိ PHP ကတိုက္ရိုက္မသိသလို PHP ကုိလည္း
Javascript ကတိုက္ရိုက္မသိပါဘူး ။ အဲဒါကုိ သိဖို႕ ၾကားခံ method သံုးၿပီး encode လုပ္ရပါတယ္ ။
JSON အတြက္ ကေတာ့ PHP မွာ json_encode() ဆိုတဲ့ functionေလး ရွိပါတယ္ ။
ဒီ function ေလးထဲထည့္ေပးလိုက္တာနဲ႕ Json string အျဖစ္ return ျပန္ေပးပါတယ္ ။
အေပၚက ဥပမာကုိ ပဲ PHP နဲ႕ျပန္ေရးၾကည့္ၾကည့္ရေအာင္
<?php
$cart = array(
"orderID" => 12345,
"shopperName" => "John Smith",
"shopperEmail" => "johnsmith@example.com",
"contents" => array(
array(
"productID" => 34,
"productName" => "SuperWidget",
"quantity" => 1
),
array(
"productID" => 56,
"productName" => "WonderWidget",
"quantity" => 3
)
),
"orderCompleted" => true
);
echo json_encode( $cart );
?>
ဒါေလးကုိ php_json.php လို႕နာမည္ေပးၿပီး ။ wamp (or) xampp server တစ္ခုခုကေန Run
ၾကည့္ၾကည့္မယ္ဆိုရင္ -
{"orderID":12345,"shopperName":"John Smith","shopperEmail":"johnsmith@example.com",
"contents":[{"productID":34,"productName":"SuperWidget","quantity":1},{"productID":56,
"productName":"WonderWidget","quantity":3}],"orderCompleted":true}
ဆိုၿပီး တစ္တန္းတည္း Output ေဖာ္ျပေပးသြားမွာျဖစ္ပါတယ္ ။
json_encode() function ေလးအေၾကာင္းအေသးစိတ္သိခ်င္ရင္
http://www.php.net/manual/en/function.json-encode.php လင့္ေလးမွာသြားေရာက္ေလ့လာႏိုင္
ပါတယ္ ။
ဒီေလာက္ဆိုရင္ JSON နဲ႕ပတ္သတ္လို႕ အေျခခံေလးကုိ နည္းနည္းေတာ့တီးမိေခါက္မိရွိသြားလိမ့္မယ္လို႕
ေမွ်ာ္လင့္ပါတယ္ ။ ေလ့လာဆဲလူတစ္ေယာက္မို႕လို႕အမွားပါခဲ့ရင္လည္းေထာက္ျပေဆြးေႏြးႏိုင္ပါတယ္။
စာသားအခ်က္အလက္ေတြကုိ User ဆီမွာ ျမန္ျမန္ဆန္ဆန္Out put ေဖာ္ျပေပးႏိုင္ဖို႕အတြက္ အဓိကသံုးပါတယ္ ။
ဒီလိုေဖာ္ျပ တဲ့ေနရာမွာ JSON မသံုးပဲတစ္ျခား WebTechnology တစ္ခုခုသံုးမယ္ဆုိ လည္းရပါတယ္ ။
ဒါေပမယ့္လည္း ေရးဖို႕လြယ္ကူတာ၊ Light weight ျဖစ္တာ ၊ Lenguage Strong
ျဖစ္တာ စတဲ့အားသာခ်က္ေတြေၾကာင့္ JSON ဟာ Web နည္းပညာနယ္ပယ္မွာေရပန္းစားလာခဲ့တာျဖစ္ပါတယ္။
စတင္မယ့္ Beginner ေတြအတြက္ JSON တစ္ခုဘယ္လိုေရးရမလဲ ဆိုတာ ရွင္းျပပါမယ္။ Language ေတြရဲ႕ထံုးစံအတိုင္း
var ဆိုတဲ့Keyword သံုးၿပီးvariable ေၾကျငာရပါတယ္။ သူက String အေနနဲ႕အလုပ္လုပ္တာျဖစ္လို႕ Data type
ထည့္ေပးဖို႕မလိုပါဘူး ။variable ကုိ ' abe' (or) "abc" ဆိုၿပီးဆင္ေျပသလိုေရးလို႕ရပါတယ္ ။ေၾကျငာၿပီးတာနဲ႕ အဲဒီ data ကုိ
Object အေနနဲ႕တန္းသံုးလို႕ရပါၿပီ ။JSON string ေတြမွာObject ေတြကို name : value ပါတဲ့စံုတြဲေလးေတြအျဖစ္ ေၾကျငာေပး
ရပါတယ္။ array ပံုစံမ်ိဳးသံုးမယ္ဆိုရင္ ေထာင့္ကြင္း [ ႏွင့္ ] ေဖာ္ျပရပါတယ္။ var အစုအေ၀းကုိ Scope { နဲ႕ } ပိတ္ေပးရပါတယ္။
Value တစ္ခုနဲ႕တစ္ခုၾကားမွာေတာ့ (,) ေလးနဲ႕ခြဲထားေပးရပါတယ္။
နားရွင္းသြားေအာင္ေအာက္ကပံုေလးကုိၾကည့္ၾကည့္ပါ။
var jobject= {
"name": "Jhon",
"age": "33",
"phone": "09-33046955",
"movies":['Spiderman','Batman','Superman']
};
name နဲ ့ value ေလးကိုေတာ့ (:) နဲ ့ခြဲထားပါတယ္..။
"movies":['Spiderman','Batman','Superman'] ဆိုတာက array ပါ ။
value ေတြေနရာမွာ ဘာေတြ ျဖစ္ႏိုင္လဲဆိုေတာ့ number,
string, boolean , တစ္ျခား array တစ္ခု ဒါမွ မဟုတ္ တစ္ျခား object တစ္ခုခု ပါ၀င္ႏိုင္ပါတယ္။
လက္ေတြ႕ Web form တစ္ခုအစမ္းေလးေရးၾကည့္ရေအာင္ ။ Simple Html form တစ္ခုေလာက္ဆြဲလိုက္ပါ ။
အဲဒီမွာ 'name','age','phone' ဆိုၿပီး label သံုးခုနဲ႕ go ဆိုတဲ့ button တစ္ခုထည့္ပါမယ္။
<html>
<head>
<script type ="text/javascript">
...............
</script>
</head>
<body>
Name : <div id="name"></div> <br/>
Age : <div id="age"></div> <br/>
Phone: <div id="phone"></div> <br/>
<input type="button" value="Go" onclick = "show()" />
</body>
</html>
ခုေန browser မွာ run ၾကည့္ရင္ဘာမွေဖာ္ျပဦးမွာမဟုတ္ပါဘူး။ အခု formမွာ
go button ကုိႏွိပ္ရင္ show() method ကုိသြားအလုပ္လုပ္ခိုင္းထားပါ တယ္။
အဲဒီေနရာမွာ name ,age ,phone အတြက္ JSON နဲ႕data ေလးေတြထည့္ေပးၾကည့္ရေအာင္။
ေအာက္မွာေရးျပထားတာေလးၾကည့္ၾကည့္ပါ။
<html>
<head>
<script type ="text/javascript">
function show(){
var jobject= {
"name": "Jhon",
"age": "33",
"phone": "09-33046955",
};
document.getElementById('name').innerHTML=jobject.name;
document.getElementById('age').innerHTML=jobject.age;
document.getElementById('phone').innerHTML=jobject.phone;
}
</script>
</head>
<body>
Name : <div id="name"></div> <br/>
Age : <div id="age"></div> <br/>
Phone: <div id="phone"></div> <br/>
<input type="button" value="Go" onclick = "show()" />
</body>
</html>
အရင္ဆံုး variables မွာ name ,age ,phone အတြက္ data ေတြေၾကျငာလိုက္မယ္။ၿပီးရင္
div tag ထဲက id ေပးထားတဲ့ name ,age ,phone နဲ႕ JSON var ထဲက name ,age ,phone ကုိ
ခ်ိတ္ဆက္ေပးရမယ္။ အဲလိုခ်ိတ္ေပးႏိုင္ဖို႕ document.getElementById( ) ကုိသံုးလို႕ရပါတယ္။
အေပၚက ဥပမာေလးကုိ json.html extension နဲ႕သိမ္းၿပီး Browser မွာ Run ၾကည့္ပါ ။
go button ေလးကုိႏွိပ္တဲ့အခါ သက္ဆိုင္ရာ data ကုိ ခ်က္ခ်င္း Output ျပေပးတာေတြ႕ရပါလိမ့္မယ္။
<script> ႏွစ္ခု ၾကားထဲ attribute မွာ "text/javascript" ကိုပဲသံုးၿပီးေရးသြားတာေလးကုိသတိျပဳပါ ။
ေအာက္မွာေနာက္ထပ္ေဖာ္ျပထားေပးတာေလးကေတာ့ Online card ဥပမာေလးပါ..။
{
"orderID": 12345,
"shopperName": "John Smith",
"shopperEmail": "johnsmith@example.com",
"contents": [
{
"productID": 34,
"productName": "SuperWidget",
"quantity": 1
},
{
"productID": 56,
"productName": "WonderWidget",
"quantity": 3
}
],
"orderCompleted": true
}
အဲဒီမွာသတိထားၾကည့္ရမွာက
"contents": [
{
CODE:VALUE;
},
{
CODE:VALUE;
}
],
ဆိုတဲ့အပိုင္းေလးပါ ။ ဒါေလးကုိၾကည့္ျခင္းအားျဖင့္ object (name:value) ရဲ့ တန္ဖိုးေနရာမွာ array
တစ္ခုအျဖစ္ေရးလို႕ရသလို အဲဒီ array ထဲမွာလဲ object ေတြ ထည့္သြင္းေရးသားလို႕ရတယ္ဆိုတာ ကုိ
သိႏိုင္ပါတယ္။
အခု အထိ ေဖာ္ျပထားတာေတြက Clinent သပ္သပ္ ေရးထားတာပါ ။ ဒါကုိပဲ PHP ထဲမွာ ဆိုဘယ္လို ဖန္
တီးၿပီးဘယ္လို ဖတ္လို႕ရႏိုင္မလဲ ?တကယ္တမ္း PHP က Lauguage သပ္သပ္ Javascript က
Language သပ္သပ္ပါ ။ ဒါေၾကာင့္မို႕ Javascript ကုိ PHP ကတိုက္ရိုက္မသိသလို PHP ကုိလည္း
Javascript ကတိုက္ရိုက္မသိပါဘူး ။ အဲဒါကုိ သိဖို႕ ၾကားခံ method သံုးၿပီး encode လုပ္ရပါတယ္ ။
JSON အတြက္ ကေတာ့ PHP မွာ json_encode() ဆိုတဲ့ functionေလး ရွိပါတယ္ ။
ဒီ function ေလးထဲထည့္ေပးလိုက္တာနဲ႕ Json string အျဖစ္ return ျပန္ေပးပါတယ္ ။
အေပၚက ဥပမာကုိ ပဲ PHP နဲ႕ျပန္ေရးၾကည့္ၾကည့္ရေအာင္
<?php
$cart = array(
"orderID" => 12345,
"shopperName" => "John Smith",
"shopperEmail" => "johnsmith@example.com",
"contents" => array(
array(
"productID" => 34,
"productName" => "SuperWidget",
"quantity" => 1
),
array(
"productID" => 56,
"productName" => "WonderWidget",
"quantity" => 3
)
),
"orderCompleted" => true
);
echo json_encode( $cart );
?>
ဒါေလးကုိ php_json.php လို႕နာမည္ေပးၿပီး ။ wamp (or) xampp server တစ္ခုခုကေန Run
ၾကည့္ၾကည့္မယ္ဆိုရင္ -
{"orderID":12345,"shopperName":"John Smith","shopperEmail":"johnsmith@example.com",
"contents":[{"productID":34,"productName":"SuperWidget","quantity":1},{"productID":56,
"productName":"WonderWidget","quantity":3}],"orderCompleted":true}
ဆိုၿပီး တစ္တန္းတည္း Output ေဖာ္ျပေပးသြားမွာျဖစ္ပါတယ္ ။
json_encode() function ေလးအေၾကာင္းအေသးစိတ္သိခ်င္ရင္
http://www.php.net/manual/en/function.json-encode.php လင့္ေလးမွာသြားေရာက္ေလ့လာႏိုင္
ပါတယ္ ။
ဒီေလာက္ဆိုရင္ JSON နဲ႕ပတ္သတ္လို႕ အေျခခံေလးကုိ နည္းနည္းေတာ့တီးမိေခါက္မိရွိသြားလိမ့္မယ္လို႕
ေမွ်ာ္လင့္ပါတယ္ ။ ေလ့လာဆဲလူတစ္ေယာက္မို႕လို႕အမွားပါခဲ့ရင္လည္းေထာက္ျပေဆြးေႏြးႏိုင္ပါတယ္။
No comments:
Post a Comment