ما سبب الخطأ "Uncaught SyntaxError: Unexpected token o in JSON at position 1"

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

window.localStorage.user = JSON.stringify({ // لاحظ
    name : 'mohammed',
    age : 14
});

ثم سيمكنك استدعاءه او طباعته بشكل عادي: 

console.log(typeof JSON.parse(localStorage.user));

الناتج: 

object

كيف تستخدم JSON في JavaScript.

الكائن localStorage يقوم بتخزين النصوص Strings فقط، ولكن ما تحاول أن تقوم به هو تخزين كائن Object، ولحل المشكل يجب أن تحول القيمة التي تريد تخزينها إلى نص String، ولذلك نستخدم التابع JSON.stringify للقيام بهذه المهمة:

// نحول الكائن إلى نص
var data = JSON.stringify({
    name : 'mohammed',
    age : 14
});
console.log(data);	// '{"name":"mohammed","age":14}'

localStorage.setItem('user', data);

ولكي نحول قيمة النص string إلى كائن مرة أخرى نستعمل التابع JSON.parse، على النحو التالي:
 

var data = JSON.parse(localStorage.getItem('user'));
console.log(data);
/**
* Output:
 {
   name: 'mohammed',
   age: 14
 }
*/

لاحظ أنني إستعملت التوابع getItem و setItem ، ولذلك لأنهم أفضل من إضافة الخاصية user إلى الكائن localStorage مباشرة `localStorage.user` ، ومن الأفضل القيام بهذا الأمر دائمًا لكي لا يحدث تعارض مع خصائص الكائن localStorage الأصلية والخصائص التي تضيفها، مثال:

// هنا أحاول تخزين خاصية length 
localStorage.length = "many items";

// الخاصية length من ضمن الخصائص الأصلية للكائن localStorage
// وترجع عدد العناصر الموجودة في localStorage
console.log(localStorage.length); // 8

على الجانب الآخر عند إستعمال التوابع getItem و setItem لا تحدث هذه المشكلة:

localStorage.setItem('length', "many items");
console.log(localStorage.getItem('length'));	// "many items"