بما أنّ JSON مشتقة من لغة JavaScript البرمجية، فمن الطبيعي إذًا أن تُستخدم كتنسيق للبيانات في هذه اللغة. JSON هي اختصار لـ JavaScript Object Notation (تنويت كائنات JavaScript) وتلفظ غالبًا كما يلفظ اسم (Jason).
يمكن استخدام JSON في:
- تخزين البيانات.
- إنشاء بنى المعلومات من خلال المعلومات التي يدخلها المستخدم.
- نقل البيانات من الخادوم إلى العميل، ومن العميل إلى الخادوم، ومن العميل إلى العميل.
- ترتيب البيانات والتحقق منها.
يمثّل هذا المقال مقدّمة للعمل على JSON من خلال لغة JavaScript، ويجب أن تكون مطّلعًا على هذه اللغة لتحصل على الفائدة المرجوة من المقال.
صيغة JSON
صيغة JSON مشتقة من صيغة الكائنات في JavaScript، ولكنّها صيغة نصّية بالكامل، وهي عبارة عن أزواج من المفاتيح والقيم التي تحاط عادة بأقواس معقوفة.
عادة ما تخزّن كائنات JSON في ملف بامتداد .json
ولكن يمكن أن تجد هذه الكائنات ضمن سياق البرنامج.
تكون ملفات .json
بالصيغة التالية:
{ "first_name" : "Sammy", "last_name" : "Shark", "online" : true }
إما إن كانت كائنات JSON موجودة في ملف بامتداد .js
أو .html
فستكون على اﻷغلب مسندة إلى متغير وبالصورة التالية:
var sammy = {
"first_name" : "Sammy",
"last_name" : "Shark",
"online" : true
}
إضافة إلى ذلك، يمكن أن ترى JSON على هيئة سلسلة نصية لا عنصر وذلك ضمن شيفرة JavaScript، ويمكن كتابة الصيغة في سطر واحد كما يلي:
var sammy = '{"first_name" : "Sammy", "last_name" : "Shark", "location" : "Ocean"}';
تحويل كائنات JSON إلى سلاسل نصّية مفيد في نقل البيانات بصورة سريعة.
مقارنة JSON مع كائنات JavaScript
من المهمّ جدًّا الانتباه إلى أنّ JSON قد طُوّرت لكي تستخدم من قبل أي لغة برمجية، في حين أن التعامل مع كائنات JavaScript يكون بواسطة هذه اللغة حصرًا.
أما بالنسبة إلى الصياغة، فإن كائنات JavaScript مشابهة لـ JSON، ولكن الفرق هو أنّ المفاتيح في كائنات JavaScript ليست سلاسل نصّية ضمن علامات اقتباس، إضافة إلى أنّه يمكن استخدام الدوال كقيم في هذه الكائنات.
لنأخذ المثال التالي لكائن JavaScript الخاص بالمستخدم Sammy Shark والمتّصل حاليًا بالإنترنت:
var user = {
first_name: "Sammy",
last_name : "Shark",
online : true,
full_name : function() {
return this.first_name + " " + this.last_name;
}
};
من الواضح جدًّا أن هذا الكائن مشابه جدًّا لكائن JSON، ولكن لا وجود لعلامات الاقتباس حول أيٍّ من المفاتيح (first_name
, last_name
, online
, أو full_name
)، إضافة إلى أنّ قيمة المفتاح الأخير عبارة عن دالّة.
يمكن استخدام التنويت النقطي للوصول إلى البيانات الموجودة في كائن JavaScript السابق، فلاستدعاء قيمة الاسم الأول نستخدم الصيغة: user.first_name
وسنحصل على سلسلة نصّية، أما لو أردنا الوصول إلى الاسم الكامل، ونظرًا لكون القيمة دالّة، فستكون صيغة الاستدعاء بالصورة التالية: user.full_name()
.
كائنات JavaScript موجودة فقط ضمن هذه اللغة، لذا إن كنت بحاجة للوصول إلى البيانات عن طريق لغات برمجية أخرى، فعليك حينئذ استخدام JSON لتخزين البيانات.
الوصول إلى بيانات JSON
يمكن الوصول إلى بيانات JSON بنفس الطريقة المتّبعة في كائنات JavaScript، ولتوضيح ذلك لاحظ المثال التالي:
var sammy = {
"first_name" : "Sammy",
"last_name" : "Shark",
"online" : true
}
لتتمكن من الوصول إلى أيّ من القيم السابقة يمكن استخدام التنويت النقطي بالصورة التالية:
sammy.first_name
sammy.last_name
sammy.online
يأتي اسم المتغير sammy
في البداية متبوعًا بنقطة متبوعة بالمفتاح الذي ترغب في الوصول إليه.
فمثلًا، لإطلاق مربع تنبيه يعرض القيمة المرتبطة بالمفتاح first_name
يمكن استدعاء دالّة alert()
في JavaScript بالشكل التالي:
alert(sammy.first_name);
Output
Sammy
كذلك يمكن استخدام الأقواس المربعة []
للوصول إلى البيانات في JSON، وذلك بكتابة اسم المفتاح ضمن علامتي اقتباس محاطًا بقوسين مربعين. فيصبح المثال السابق بالشكل التالي:
alert(sammy["online"]);
Output
true
وفي حال استخدام المصفوفات المتشعبة Nested Arrays يجب حينئذ استدعاء رقم العنصر ضمن المصفوفة. لنأخذ المثال التالي:
var user_profile = {
"username" : "SammyShark",
"social_media" : [
{
"description" : "twitter",
"link" : "https://twitter.com/digitalocean"
},
{
"description" : "facebook",
"link" : "https://www.facebook.com/DigitalOceanCloudHosting"
},
{
"description" : "github",
"link" : "https://github.com/digitalocean"
}
]
}
لتتمكن من الوصول إلى السلسلة النصية facebook
يجب عليك استدعاء العنصر ضمن المصفوفة مع استخدام النقطة وبالصورة التالية:
alert(user_profile.social_media[1].description);
Output
facebook
لاحظ أنّنا نستخدم نقطة إضافية للوصول إلى العنصر المتشعّب ضمن المصفوفة.
بعض الدوال التي تساعد في التعامل مع JSON
سنستعرض دالّتين مهمّتين في التعامل مع بيانات JSON، الأولى تعمل على تحويل البيانات إلى سلاسل نصية والأخرى تقوم بتحليلها. إن إمكانية تحويل JSON من كائن إلى سلسلة نصّية مفيد جدًّا في تحويل البيانات وتخزينها.
JSON.stringify()
تحوّل هذه الدالة الكائن إلى سلسلة JSON نصية.
يمكن الاستفادة من السلاسل النصّية لتحويل البيانات من العميل إلى الخادوم وذلك من خلال خزن المعلومات أو تمريرها بصورة سهلة وسريعة. فعلى سبيل المثال، يمكنك مثلًا الحصول على الإعدادات الخاصّة بالمستخدم من طرف العميل ثم إرسالها إلى الخادوم، وفي وقت لاحق يمكنك قراءة تلك المعلومات وتحليلها بواسطة دالّة JSON.parse()
واستخدام البيانات حسب الحاجة.
في المثال التالي نسند كائن JSON إلى المتغير obj
، ثم نحوّله إلى سلسلة نصية من خلال تمريره إلى الدالة JSON.stringify()
وإسناد القيمة إلى المتغيّر s
:
var obj = {"first_name" : "Sammy", "last_name" : "Shark", "location" : "Ocean"}
var s = JSON.stringify(obj)
والآن يمكن التعامل مع المتغيّر s
والذي يضمّ معلومات JSON على هيئة سلسلة نصّية.
'{"first_name" : "Sammy", "last_name" : "Shark", "location" : "Ocean"}'
JSON.parse()
قلنا أنّ السلاسل النصية مفيدة في نقل المعلومات، ولكن يجب أن تتوفّر إمكانية تحويل هذه السلاسل مرّة أخرى إلى كائنات JSON سواء من طرف العميل أو الخادوم. يمكن تحويل السلال النصّية إلى كائنات باستخدام الدالة eval()
ولكن هذه الطريقة غير آمنة، لذا سنستخدم الدالة JSON.parse()
بدلًا عنها.
لتحويل السلسلة النصّية في المثال السابق إلى كائن JSON نقوم بتمرير المتغيّر s
إلى الدالّة وإسناد القيمة المستحصلة إلى متغيّر جديد:
var o = JSON.parse(s)
أصبح لدينا الآن الكائن o
وهو مطابق تمامًا للعنصر obj
.
لتوضيح الفكرة بشكل أكبر سنأخذ المثال التالي والذي نستخدم فيه دالة JSON.parse()
في ملف HMTL.
<p id="user">Name: Sammy Shark<br>Location: Ocean</p>
<script>
var s = '{"first_name" : "Sammy", "last_name" : "Shark", "location" : "Ocean"}';
var obj = JSON.parse(s);
document.getElementById("user").innerHTML =
"Name: " + obj.first_name + " " + obj.last_name + "<br>" +
"Location: " + obj.location;
</script>
Output
Name: Sammy Shark
Location: Ocean
لاحظ كيف حوّلنا السلسلة النصّية s
إلى كائن JSON يمكن استدعاء القيم التي يتضمّنها وتصييرها على صفحة الإنترنت.
الخلاصة
JSON هي الصيغة الافتراضية التي تستخدم في JavaScript ويمكن تضمين هذه الصيغة في العديد من اللغات البرمجية الشائعة. ويمكنك الاطلاع على اللغات التي تدعم هذه الصيغة من خلال الموقع الإلكتروني الخاص بهذه الصيغة.
ونظرًا لصغر حجم JSON وسهولة نقل المعلومات بين لغات البرمجة والأنظمة المختلفة، تستخدم هذه الصيغة بصورة واسعة في الواجهات البرمجية APIs، مثل واجهة Twitter البرمجية.
تجدر الإشارة إلى أنّك لن تنشئ ملفات .json
بنفسك على الأغلب بل ستحصل عليها من مصادر أخرى، مثل ملفات CSV التي تستخدم لتخزين البيانات المجدولة، أو ملفات XML أو غيرها.
وسواء أكتبت JSON بنفسك أو حصلت عليها من مصدر آخر، يمكن التأكد من صحّة الصيغة التي كتبتها باستخدام الأداة JSONLint.
ترجمة - وبتصرّف - للمقال How To Work with JSON in JavaScript لصاحبته Lisa Tagliaferri.
- 1
- 1
أفضل التعليقات
لا توجد أية تعليقات بعد
انضم إلى النقاش
يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.