آموزش ویژگی localStorage در BOM جاوااسکریپت

سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش ویژگی localStorage در BOM جاوااسکریپت با من همراه باشید.

ویژگی localStorage در BOM جاوااسکریپت

Free-Learn

ویژگی localStorage در BOM جاوااسکریپت

با استفاده از ویژگی localStorage میتونیم داده ها ( داده های کوچک ) رو درون مرورگر ذخیره کنیم و همچنین میتونیم به داده های ذخیره شده در مرورگر دسترسی پیدا نماییم.

یه ویژگی دیگه بنام sessionStorage داریم که اونم کارش ذخیره سازی داده ها در مرورگر می باشد.

وقتی داده ها در حافظه مرورگر ذخیره بشن دیگه در دفعات بعدی بازم در دسترس هستند، یعنی اگه صفحه رو رفرش ( دوباره بارگذاری ) کنید یا اگه کلا صفحه رو ببندید و دوباره باز کنید بازم داده ها در دسترس هستند.

تفاوت localStorage با sessionStorage : ویژگی localStorage داده هارو در مرورگر بصورت دائمی ذخیره میکنه، یعنی اگه مرورگر رو ببندید و دوباره باز کنید بازم داده ها سرجاشونن ولی sessionStorage با بسته شدن مرورگر تمامی داده ها حذف خواهد شد.

برای نگهداری داده های بزرگ ( یا اطلاعات حساس ) اصلا نباید از این روش استفاده نمایید، و باید از پایگاه داده ها ( مثه MySql ) استفاده نمایید.

Free-Learn

مثال از این ویژگی

در ادامه میتوانید یک مثال از این ویژگی را در زبان جاوا اسکریپت مشاهده نمایید.

مثال شماره ۱ : ست کردن داده ( مثلا یک نام ) درون حافظه مرورگر

امتحان کنید

مثال شماره ۲ : گرفتن داده ( همون نام ) از حافظه مرورگر

امتحان کنید

مثال شماره ۳ : حذف داده ( همون نام ) از حافظه مرورگر

امتحان کنید

Free-Learn

پشتیبانی مرورگرها

در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از این ویژگی در جاوااسکریپت پشتیبانی میکنند یا خیر.

نام ویژگی Chrome Firefox Opera Safari IE
localStorage ۴ ۳٫۵ ۱۱٫۵ ۴ ۸

Free-Learn

شکل نوشتاری

نحوه نوشتن یا استفاده یا سینتَکس (Syntax) این ویژگی در جاوااسکریپت بصورت زیر می باشد.

  • ست کردن کلید جدید : ( روش اول )

  • ست کردن کلید جدید : ( روش دوم ) ( مثال )

  • ست کردن کلید جدید : ( روش سوم ) ( مثال )

  • گرفتن / دریافت کلید :

  • حذف کردن کلید :

  • حذف تمامی کلیدهای موجود در حافظه :

Free-Learn

نکات و توضیحات

  • ویژگی localStorage داده هارو بصورت دائمی و تازمانی که توسط خودمون حذف نشده اند نگهداری میکنه ولی sessionStorage به محض بسته شدن مرورگر تمامی داده هاش حذف میشن.

Free-Learn

مثال های بیشتر

مثال شماره ۱ : دریافت یک نام از کاربر با استفاده از جعبه پیغام Prompt و ذخیره در حافظه مرورگر و نمایش در دفعات بعدی

امتحان کنید

مثال شماره ۲ : تنظیم رنگ زمینه و رنگ متن و ذخیره در حافظه مرورگر

امتحان کنید

Free-Learn

دریافت PDF یا پرینت این مطلب