آموزش برنامه نویسی ، پایگاه داده sql server
آموزشگاه برنامه نویسی تحلیل داده : دوره های آموزشی برنامه نویسی و طراحی وب ASP.Net , C# , HTML , CSS , SQL Server


آموزشگاه برنامه نویسی مجتمع فنی تهران میرداماد : دوره های آموزشی برنامه نویسی و طراحی وب ASP.Net , C# , HTML , CSS , SQL Server

آموزش JSON > کدنویسی آموزش JSON
تبدیل یک متغیر متنی JSON به یک شی جاوا اسکرپیت و خواندن و نمایش آن در صفحات وب

مقدمه - متد JSON.parse و کاربرد آن در جاوا اسکرپیت :

همانطور که طی آموزش های ارائه شده تا این مرحله ، متوجه شده اید ، یکی از اصلی ترین کاربردهای JSON ، دریافت و خواندن اطلاعات از یک وب سرور و سپس نمایش آنها به صورت ساختار یافته درون صفحات وب می باشد .
برای مثال ، یک سرور وب اطلاعات گروهی از افراد ، شامل نام ( firstName ) و نام خانوادگی ( lastName ) را توسط یک متغیر JSON به صورت زیر ارسال می کند :

Example
    var text = '{ "employees" : [' +
                              '{ "firstName":"John" , "lastName":"Doe" },' +
                              '{ "firstName":"Anna" , "lastName":"Smith" },' +,
                              '{ "firstName":"Peter" , "lastName":"Jones" } ]}';
کد

سپس در صفحه وب ، بایستی به وسیله JSON و جاوا اسکریپت ، این اطلاعات را خوانده و پس از پردازش ، آنها را بر روی صفحه نمایش دهیم .
متد ( نام متغیر ) JSON.parse ، یک متغیر متنی  JSON را گرفته و آن را درون یک شی جاوا اسکریپت ، که دارای فیلدهای داده ای متناظر با خواص موجود در شی JSON می باشد ، ذخیره می کند .

Example
var obj = JSON.parse ( text ) ; کد

در مرحله بعد ، می توانیم اطلاعات هر یک از افراد موجود در لیست را به وسیله کد زیر و با اشاره به شماره اندیس آن نمایش دهیم :

Example
<!DOCTYPE html>
<html>
   <body>
       <h2>  به یک شی جاوا اسکرپیت و خواندن و نمایش آن در صفحات وب JSON  تبدیل یک متغیر متنی </h2>
       <p id="demo"></p>

       <script>
            var text = '{ "employees" : [' +
                              '{ "firstName":"John" , "lastName":"Doe" },' +
                              '{ "firstName":"Anna" , "lastName":"Smith" },' +
                              '{ "firstName":"Peter" , "lastName":"Jones" } ]}';

            obj = JSON.parse(text);  //  به شی جاوا اسکریپت JSON  تبدیل متن
            document.getElementById("demo").innerHTML =  obj.employees[1].firstName + " " + obj.employees[1].lastName;     //   خواندن و ریختن مقادیر عضو دوم آرایه در یک پاراگراف
        </script>

</body>
</html>
کد

به یک شی جاوا اسکرپیت و خواندن و نمایش آن در صفحات وب JSON  تبدیل یک متغیر متنی

کد

استفاده از متد ( ) eval :

در مرورگرهای قدیمی که از متد ( ) JSON.parse پشتیانی نمی کنند ، می توانید از متد ( ) eval ، به صورت زیر برای خواندن یک متغیر JSON ذخیره آن در یک شی جاوا اسکریپت استفاده کنید .
مثال : کد مثال فوق را با استفاده از متد ( ) eval بازسازی کرده و خروجی را مجددا نمایش داده ایم . به اختلاف های دو کد دقت نمایید :

Example
<!DOCTYPE html>
<html>
   <body>
       <h2>  به یک شی جاوا اسکرپیت و خواندن و نمایش آن در صفحات وب JSON  تبدیل یک متغیر متنی </h2>
       <p id="demo2"></p>

       <script>
            var txt = '{ "employees" : [' +
                              '{ "firstName":"John" , "lastName":"Doe" },' +
                              '{ "firstName":"Anna" , "lastName":"Smith" },' +
                              '{ "firstName":"Peter" , "lastName":"Jones" } ]}';

            var obj = eval ("( " + txt + ")");                 // به شی جاوا اسکریپت JSON  روش دوم تبدیل متن
            document.getElementById("demo2").innerHTML =  obj.employees[1].firstName + " " + obj.employees[1].lastName;
        </script>

</body>
</html>
کد

به یک شی جاوا اسکرپیت و خواندن و نمایش آن در صفحات وب JSON  تبدیل یک متغیر متنی

کد

نکات مهم در استفاده از متد ( ) eval :

  • متد ( ) eval ، می تواند هر دستور یا اسکریپت را به صورت ورودی دریافت کرده و آن را اجرا کند . از این لحاظ ، متد ( ) eval ، دارای یک حفره امنیتی خطرناک بوده و بهتر است از آن استفاده نشود .
  • متد ( )JSON.parse ، هوشمند بوده و فقط متون JSON را پردازش کرده و از این لحاظ دارای امنیت بالایی است .
  • JSON و متد های آن در مرورگرهای زیر و ورژن های بالاتر آنها به صورت کامل پشتیبانی می شوند :
    • Firefox 3.5 .
    • Internet Explorer 8 .
    • Chrome .
    • Opera 10 .
  • برای مرورگرهای قدیمی یک کتابخانه جاوا اسکرپیت جهت JSON در آدرس زیر قرار داده شده است :
    https://github.com/douglascrockford/JSON-js


راجع این مطلب سوال یا اشکالی دارید ؟! آن را در انجمن سایت مطرح نمایید ...         >>>>>  ورود به انجمن تخصصی


نطر خودتان درباره این صفحه را با ما در میان گذاشته و در صورت تمایل از Developer1 حمایت نمایید :

آیا مطالب این صفحه برای شما مناسب و مفید بوده است :

نام :                 
آدرس Email :    
 
نظر شما :  
 
سوال امنیتی : پایتخت ایران ؟      
حمایت از سایت Developer1