خانه تالار گفتگو دانلود خبرنامه سفارش سایت درباره ما ارتباط با ما حمایت از ما تبلیغات

آموزش کار با متد Parse در JSON

آمورزش کار با متد Parse() در جیسون JSON

یکی از استفاده رایج چهارچوب کاری JSON، دریافت اطلاعات از سرور و یا انتقال داده به آن است.
در هنگام دریافت اطلاعات از سرور، معمولا دیتا به صورت متنی (String) است.
برای استفاده از اطلاعات دریافتی، بایستی ابتدا توسط متد JSON.parse() آن را به متنی (object1) جاوا اسکریپت تبدیل کرده تا به بخش های مختلف دیتا، دسترسی داشته باشد
. مثال عملی : فرض کنید اطلاعات زیر را از سرور دریافت کرده اید :
syntax
کد
                                        '{ "name":"John", "age":30, "city":"New York"}'
                                    
همانند قطعه کد زیر، از متد Json.parse() برای تبدیل اطلاعات رشته ای فوق به یک شی جاوا اسکریپت object استفاده کنید :
syntax
کد
                                        var obj = JSON.parse('{ "name":"John", "age":30, "city":"New York"}');
                                    
در این حالت، اطلاعت درون شی obj ذخیره خواهند شد.
نکته نکته :

حتما توجه نمایید که متن نوشته شده برای دیتا، طبق فرمت استاندارد JSONباشد، در غیر اینصورت یک خطای ساختاری (Syntax error) دریافت خواهید کرد.

سپس می توانید همانند مثال عملی زیر، می توانید پس از ذخیره اطلاعات دریافتی در شی obj، خواص name و age آن را در یک تگ P در خروجی نمایش دهید :
syntax
کد
                                        

< script> document.getElementById("demo").innerHTML = obj.name + ", " + obj.age; </script>
خروجی

آموزش دریافت اطلاعات از سرور با JSON

می توانید اطلاعات مورد نظر خود را از سرور توسط Ajax و با استفاده از JSON دریافت نمایید.
مادامی که پاسخ ارسالی از سرور، در قالب JSON باشد، می توانید دیتا را از حالت String متنی به یک شی جاوا اسکریپت تبدیل کنید.
مثال عملی : در کد مثال عملی زیر، برنامه طی یک درخواست Ajax به سرور، فایل متنی json_demo.txt را خوانده و اطلاعات آن را درون یک شی جاوا اسکریپت به نام myObj پارس کرده است.
سپس مقدار خاصیت name شی myObj را توسط تگ با id برابر demo، در خروجی نمایش داده ایم :
syntax
کد
                                        var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        var myObj = JSON.parse(this.responseText);
        document.getElementById("demo").innerHTML = myObj.name;
    }
};
xmlhttp.open("GET", "json_demo.txt", true);
xmlhttp.send();
                                    
خروجی
syntax
کد
                                        {
    "name":"John",
    "age":31,
    "pets":[
        { "animal":"dog", "name":"Fido" },
        { "animal":"cat", "name":"Felix" },
        { "animal":"hamster", "name":"Lightning" }
    ]
}
                                    

آموزش دریافت اطلاعات از سرور به شکل آرایه در JSON

هنگامی که از متد JSON.parse() استفاده می کنید، اگر اطلاعات دریافتی از سرور، به صورت یک آرایه و نه متن ساده باشد، متد parse() اطلاعات را به صورت یک آرایه جاوا اسکریپت به جای یک شی جاوا اسکریپت بر می گرداند.
مثال عملی : در کد مثال عملی زیر، توسط یک درخواست Ajax، فایل متنی json_demo_array.txt را از سرور خوانده و آن را در متغیر myArr ، ذخیره کرده ایم.
سپس مقدار عضو اول آرایه دریافتی با اندیس 0 را در تگ P با id برابر demo نشان داده ایم :
syntax
کد
                                        var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        var myArr = JSON.parse(this.responseText);
        document.getElementById("demo").innerHTML = myArr[0];
    }
};
xmlhttp.open("GET", "json_demo_array.txt", true);
xmlhttp.send();
                                    
خروجی

بررسی استثنا ها در کار با داده JSON

آموزش نحوه تبدیل تاریخ Dates در JSON

همانطور که در بخش آموزش انواع داده ها (متغیر) در جیسون JSON اشاره کردیم، مقدار تاریخ یا Date در این چهارچوب کاری مجاز نیست.
اگر به تاریخ یا Date در کد خود نیاز دارید، بایستی آن را به صورت رشته متنی (string) نوشته و سپس در هنگام نیاز، مجدا آن را به شکل تاریخ، تغییر دهید.
مثال عملی : در کد مثال عملی زیر، نحوه تغییر یک مقدار متنی string به فرمت تاریخ (Date) در جیسون نشان داده است.
در این مثال، ابتدا متغیر text توسط متد json.parse() به یک شی جاوا اسکریپت به نام obj تبدیل شده است.
سپس خاصیت جدیدی به نام birtu برای شی obj تعریف شده و مقدار خاصیت birth در آن به فرمت date ذخیره شده و سپس در صفحه نمایش داده شده است :
syntax
کد
                                        var text = '{ "name":"John", "birth":"1986-12-14", "city":"New York"}';
var obj = JSON.parse(text);
obj.birth = new Date(obj.birth);

document.getElementById("demo").innerHTML = obj.name + ", " + obj.birth;
                                    
خروجی
در حالتی دیگر، می توانید از پارامتر دوم تابع JSON.parse() که یک تابع به نام reviver است استفاده کنید.
پارامتر reviver، تابعی است که هر خاصیت شی JSON را قبل از بازگشت مقدار آن، چک می کند.
مثال عملی : در کد مثال عملی زیر، یک مقدار متنی String را توسط تابع reviver به تاریخ (Date) تبدیل کرده ایم.
در مثال زیر، متغیر text را توسط متد JSON.parse() به یک شی جاوا اسکریپت به نام obj تبدیل کرده ایم. این متد توسط پارامتر دوم خود، تابع reviver()، هر یک از خاصیت های متغیر text را بررسی کرده و آن خاصیتی که مقدار key آن برابر با “birth” است را به صورت یک متغیر Date تبدیل کرده و بازگردانده است.
سپس مقدارهای دلخواه از شی obj را در خروجی نشان داده است :
syntax
کد
                                        var text = '{ "name":"John", "birth":"1986-12-14", "city":"New York"}';
var obj = JSON.parse(text, function (key, value) {
    if (key == "birth") {
        return new Date(value);
    } else {
        return value;
    }});

document.getElementById("demo").innerHTML = obj.name + ", " + obj.birth;
                                    
خروجی

آموزش نحوه تبدیل تابع function در JSON

همانطور که در بخش انواع متغیرهای جیسون اشاره کردیم، به کار بردن تابع (function) به عنوان داده در JSON مجاز نیست.
اگر نیاز دارید تا از یک تابع در کد خود استفاده کنید، ابتدا آن را به صورت متنی (string) نوشته و بعدا به تابع تبدیل کنید.
مثال عملی : در کد مثال عملی زیر، یک تابع را به صورت متنی و به عنوان مقدار (value) خاصیت age در متغیر text تعریف کرده ایم.
سپس متغیر text را با کمک تابع Parse() به یک شی جاوا اسکریپت تبدیل نموده، درون یک شی obj ریخته ایم.
در خط بعدی، با استفاده از تابع eval()، مقدار خاصیت age شی obj را که یک تابع است، اجرا نموده و دوباره در خودش ذخیره کرده ایم. سپس مقدار خروجی را بر روی صفحه نشان داده ایم :
syntax
کد
                                        var text = '{ "name":"John", "age":"function () {return 30;}", "city":"New York"}';
var obj = JSON.parse(text);
obj.age = eval("(" + obj.age + ")");

document.getElementById("demo").innerHTML = obj.name + ", " + obj.age();
                                    
خروجی
راهنمایی راهنمایی :

همانطور که اشاره کردیم، از کاربرد تابع (function) در JSON بایستی پرهیز نمایید، زیرا محدوده عملکرد (scope) خود را از دست می دهند.
برای استفاده از تابع در جیسون، بایستی آن ها را پس از دریافت به صورت متنی، به وسیله تابع eval() به نوع تابع، مجددا تبدیل کنید.


پشتیبانی از تابع JSON.parse() در انواع مرورگرها

تابع JSON.parse() بر طبق استاندارد جدید ECMAScript یا همان جاوا اسکریپت، در تمامی نسخه های جدید مرورگرهای مطرح اضافه شده و پشتیبانی می شود.
لیست مرورگرهای پشتیبانی کننده از این تابع به صورت زیر است :
  • Firefox 3.5
  • Internet Explorer 8
  • Chrome
  • Opera 10
  • Safari 4
در مرورگرهای قدیمی تر، می توانید از کتابخانه موجود در آدرس زیر استفاه کرده و آن را به پروژه الحاق کنید :