Skip to main content

React Native + Javascript + Date Time + JSON.Stringify() + JSON.parse()

This page will capture all issues related to Date and React Native mobile app development. Will add more as I go through the development cycle. 

I will play around with Javascript for a bit before switching to TypeScript. 

Some of the information below might not be following the best practice as I just started the development process. Will update as I learn more about React Native + Javascript.

Storing Date object in AsyncStorage

You can store Date object directly into AsyncStorage. Generally in other programming language, you can store the Date object directly in a data storage. However, with React Native, you will get the the Debug Console warning on Expo Go if you do so. I recommend using JSON.stringify() command below to store the date object. Please follow the instruction below. 

On the side note, you can also store millisecond and use the date toString option but it is not recommended. I would recommend using stringify command as it will store using the toISOString() which is the ISO 8601 string format.

Prior to storing a date object in AsyncStorage, convert it to string first before you store it. Use JSON.stringify() command.


Example code:

await AsyncStorage.setItem('selectedDate', JSON.stringify(newDate));

Retrieve From AsyncStorage

retrieveDate = async () => {

    const stringifiedObject = await AsyncStorage.getItem('date'); 

    let newDate = new Date(Date.parse(JSON.parse(stringifiedObject)));

}; 

JSON.stringify() - Date double quote issue

When you use stringify on a date object, this command will add double quote (") around your date attribute. If you use the Date.parse(stringifiedObject) command here, you will get an Invalid Date error.

There are 2 options:

1. Before you use Date.parse command to change it back to a date object, make sure you remove the double quote; or,

2. The better option is to use the command: new Date(Date.parse(JSON.parse(stringifiedObject)))


So yes, I recommend the following option to create a date option out of a stringified date:

let sampleDate = new Date(Date.parse(JSON.parse(stringifiedObject)));

Comments

Popular posts from this blog

Checked! Task & Calendar Pro - Support Guide

Checked! Task & Calendar Pro - Support Guide Welcome to the support page for Checked! Task & Calendar Pro ! This guide will help you get the most out of your task and calendar management experience. Quick Links Getting Started View Modes Task Management Calendar Integration Categories & Organization Notes & Attachments Common Questions (FAQ) Tips & Tricks Preferences Guide Troubleshooting Getting Started Welcome to Checked! Checked! Task & Calendar Pro is a comprehensive task and calendar management app designed to help you stay organized and productive. The app seamlessly integrates your tasks with your calendar events, giving you a complete view of your day. Key Features at a Glance Multiple View Modes : Switch between List, Day Timeline, and Monthly views Calendar Integration : Sync with your existing Apple Calendar events Smart Task Creation : Create tasks with natural language date parsing Categories & Organization : Or...

Gentle Unscented Skin Care

Gentle Unscented Skin Care Guide ⚠️ IMPORTANT DISCLAIMER This is for my own tracking and usage. As of March 2025: This list is provided for informational purposes only. Product formulations can change, and items may be discontinued or recalled. ALWAYS verify product ingredients and consult with a dermatologist before use, especially if you have sensitive skin, allergies, or medical conditions. Use at your own risk. Table of Contents Body Soaps Hand Cleansers Facial Cleansers Body Moisturizers Hand Moisturizers Facial Moisturizers Deodorant/Antiperspirant Shaving Creams Shampoo Sunscreens Hair Sprays/Gels Laundry Detergents Fabric Softeners Hand Dermatitis Care Body Soaps Dove Sensitive Skin Bar Soap Neutrogena Bar Soap Aveeno Moisturizing Bar CeraVe Hydrating Cleanser or Cleansing Bar Lipikar Syndet Cetaphil Restoraderm Nourishing Body Wash Mother Dirt Cleanser...

Checked! Task Pro - Blackberry Instruction

  Checked Instruction I just started working on this page, please send me comments and suggestions that could improve this site. Please note that if you use the Android app, the instruction is similar to the BlackBerry app below. I will create a separate instruction page for Android app soon. Contents 1  Initial Set-up after Installation 2  SMART task system that combine the best of GTD (Getting Things Done) and MYN  3  Smart Add - natural language date parser 4  ***NEW*** Shortcuts 5  Back-up and Restore - How to Transfer data from one device to another 6  BES - Work Space - Add a public app from the BlackBerry World storefront 7  Settings options that will definitely increase your productivity 8  Automatically add email as task 9  Tips on improving performance 10  Add a category 11  Delete a category 12  Keep categories permanently 13  Add sub-task 14  Automatic Synchronize from remember 15  Sort opti...