Up next in 10
localStorage & related methods _ JavaScript Tutorial in Hindi #69
29 views
Feb 10, 2024
In the 69th tutorial of our JavaScript series, presented in Hindi, delve into the realm of persistent data storage with localStorage and its related methods. Explore how localStorage provides a powerful mechanism to store key-value pairs on the client-side, offering a convenient way to retain user preferences and data between sessions. This session offers practical examples and step-by-step guidance in Hindi, ensuring that you grasp the intricacies of localStorage and related methods. Whether you're a web developer aiming to enhance user experiences or a JavaScript enthusiast eager to explore data storage capabilities, this tutorial is your key to mastering the art of localStorage. Join the session, unlock the potential of client-side data storage, and elevate your JavaScript projects!
View Video Transcript
0:00
आज का इन वीडियो डेटिकेट होने वाला है लोकल स्टोरेज प��
0:02
अब लोकल स्टोरेज के बारे में आप लोगों ने काफी सुना होगा लोकल स्टोरेज आपके ब्राउजर में डेटा क��
0:07
एक पर्टिकुलर डोमेइन के लिए स्टोर करने में यूज होता है cookies से किस तरह से different है ये भी बताऊंगा आप लोगों क��
0:14
और इसके कुछ amazing and straightforward methods को आप लोगों को बताऊंग��
0:18
चल दें computer screen में and let's get started so guys अब हम लोग बात करने वाले local storage के बारे मे��
0:30
मेरे दिल के बहुत ज़ादा करीब है local storage क्योंकि इतनी ज़्यादा use होती है और कभी भी मुझे अपने data store करना होता है तो मैं local storage में ही करता हूँ
0:38
जैसे कि अगर मुझे कोई एक, मानलो message store करना है और मुझे मानलो कोई भी ऐसी जी store करनी है
0:44
जो कि मैं चाहता हूँ कि browser में बनी रहे, मैं local storage में save करता हूँ, क्या है local storage इसके बारे मे��
0:49
आप लोग को बताता हूँ notes मैंने बना रखे है local storage is a web storage object
0:53
which are not sent to server with each request आपने अगर cookie सेट कर दिय��
0:58
तो browser आपकी cookie को send करेगा हर request के साथ आप नहीं चाहते क��
1:03
यार कभी कभी हर request के साथ send हो College जैसे कि मान लो आप चाहते हो क��
1:07
आप किसी भी client का या नहीं कि किसी भी browser पर जो भी इंसार आपकी website access कर रहा है उसका ए��
1:14
note आपको मालो save करना है browser में आप लोग चाहोगे कर दो क्योंकि मैं नहीं करना चाहोगा यार क्यो��
1:20
करना चाहूंगे क्योंकि मैं इसलिए नहीं करना चाहूंगे क्योंकि वह रिक्वेस्ट के साथ भेजा जाएगा आप नही��
1:25
चाहते हैं सर्मर पर जाए वह बार-बार ठीक है तो इसलिए आप लोग यूज करना चाहूंगे लोकल स्टोरेज कर देश डाइट��
1:31
पर वाइव फुल पीछ डिफरेशन इन अफ फुल ब्राउजर डिस्टार्ट अगर आपने कोई चीज लोकल स्टोरेज में सेव कर दी त��
1:38
चाहे आप अपने browser को restart कर लो, चाहे आप अपने page को refresh कर लो
1:43
आपका data कहीं नहीं जाने वाला, local storage में safe रहेगा, आप लोगों को दिखाता हूँ यार
1:48
बड़ी simple सी चीज, जब आप लोग यहाँ पर application में जाते हो
1:52
और इसके बाद यहाँ local storage में जाते हो, तो आपको आपके local storage का data देखने को मिलता ह��
1:57
यह database की तरह है key value pairs है और key और value
2:00
यहाँ पर string होती है ठीक है अब मैं आपलोगो एक code लिखक��
2:04
दिखाओंगा local storage dot और मैं आपलोगो लिखूँगा set item और इसके बा��
2:11
मैं लिखूँगा name और इसके बाद लिखूंगा Harry ठीक है enter मार दिया मैंन��
2:17
यह command चलाया अब यह command क्या है कैसे यह भी देखेंगे थोड़ी दिर मैं सारी commands बताऊंग��
2:21
local storage की एक बहुती basic सी command चलाई है और जो की बता रही है खुद क��
2:25
क्या करती है यह set कर रही है name को जो name key है मेर��
2:42
एडिट कर सकता हूं और भी बहुत सारी चीज़ें मैं कर सकता हूं बेसिकली ये स्टोर हो चुकी ह��
2:47
क्या मैं इसको रिफ्रेश करूँगा अगर तू मुझे मिलेगी नेम हैरी दी आंसर इस येस मिलेग��
2:51
URL URL URL
3:23
मैं यहां पर लिखूं लेट की इस एकॉल टू मान लो मैं लिखो और मैं यहां पर लिख दूं प्रॉम्ट और लिखो��
3:31
एंटर की यू वांट टू सेट ठीक है और मान लो मैं चाहता हूं कि वैल्यू भी यूजर दे मुझे एंटर वैल्यू यू वां��
3:43
सेट ठीक है एंड की वान सेट एंड वैल्यू वान सेट ठीक है और मैं यहां पर लिखूंगा लोकल स्टोरेज डॉट सेट आइट��
3:51
और की वाल्यू ठीक है कुछ इस तरह से लोकल स्टोरेज डॉट सेट आइटम की वाल्यू जो की होगी वह सेट हो जाएगी टू वाल्य��
4:13
जो भी आपने की एंटर करिए और मैं आप इसको कंसोल डॉट लॉग करूंगा और मैं आप पर जो इसकी वाल्यू है उसक��
4:21
मैं लिखता हूं दिवाइल्यू आट और मैं आप बैक टिक्स का इस्तेमाल करने वाला हूं दोस्तों देखते जाना आप मै��
4:30
टाइप राटिक्स का इस्तेमाल करने वाला हूं जहां जहां जावास्क्रिप्ट होती है वहां वहां आप क्या करते ह��
4:36
वहां वहां आप लोग एक बार मैसेज कंट्रोल एक्स करके पहले यहां पर डॉलर लगा लेता हूं और फिर कुछ इस तरह स��
4:44
लेता हूं इसको अंदर यहां पर ठीक है तो यह मैं कर सकता हूं ठीक है यह डेबलेट लिटरल सेंटेक्स है बड़��
4:49
बेसिक से जो यह हमने ऑलरेडी कवर कर लिया अगर उसे पर एंटर कि यू वांट टो सेट मान लो मैं यहां पर सिटी लिखत��
4:55
और मैं यहाँ पर लिखता हूं डेली और यहाँ पर देखो सिटी डेली आ गया और कंसोल खोलकर दिखाओ तो वैल्यू ए��
5:00
सिटी डेली मालों मैं इसको दोबारा से रिलोड करूं मालों मैं की लिखता हूं कलर और लिखता हूं रेड देखो वैल्य��
5:07
अपनी लोकल स्टोरेज दिखाऊं तो यह सारी चीजें से परसेस्ट करते हैं परसेस्ट करते हैं क्या मतलब ह��
5:14
परसेस्ट का मतलब कि रहती है डिलीट नहीं हुई चाहिए आप पेज को रिलोड कर लो ठीक है तो यह चीजें यहां प��
5:21
Set item क्या करता है Set कर देता है यह हमने देख लिया Get item क्या करता ह��
5:24
Get item आप लोग को उस key पर क्या value है यह बताता है तो दो methods हमने देख��
5:29
Set item और Get item ठीक है local storage.get item जो भी key दोगे उसकी value आपको दे देग��
5:33
Get the value by key Remove item क्या करेगा Remove कर देगा उस item क��
5:39
ठीक है, अब माल लो, मैं आपर लिखता हूँ, एक बड़ा silly सा if statement
5:45
silly सा क्यों बोला मैंने, जो कि ऐसा कभी आप practically शायद करना ना चाहूँ, बट अभी आप लोगों को सिखाने के लिहास से बता रहा हूँ
5:52
if key is less than is equal to red skype
6:22
को ना ऊपर डाल दूंगा ऐसा मैंने क्यों किया ऐसा इसलिए किया देखो होगा क्या या पर आपसे पहले कि और वैल्य��
6:29
पूछी जाएगी इस प्रोग्राम को समझो क्या होगा आपसे कि और वैल्यू पूछी जाएगी उसके बाद आपकी लोकल स्टोरे��
6:35
सेट कर दिया जाएगा ठीक है इसकी value पेर को इसके बाद आप लोग को console.log करवाया जा रहा ह��
6:42
the value at key is this ठीक है और यह तो होगा लेकिन यह local storage से remove हो जाएगी अगर red
6:50
या blue है तो यह नहीं कि अगर आपने key को red लिखा या blue लिखा तो यह local storage से remove हो जाएग��
6:55
लेकिन कभी सेट नहीं होगी इस प्रोग्राम के थ्रू एट लिस्ट ठीक है तो देखते हैं सबसे नॉर्मल किसी की को से��
7:01
कर लेते हैं एक को बी करके देखते हो जाएगी यहां पर देखो एबी आ गया लेकिन अगर मैं यहां पर रेड कर दूं औ��
7:07
यहां पर फेव कॉल कर दूं तो यहां पर देखो आया था एक बार के लिए विडियो पीछे करके देखो तो आया था ए��
7:13
फ्लैश ऑफ यह इसका फ्लैश आया इसको चला गया ठीक है और कंसोल में तो यह आए गई ठीक है कि हमने कंसोल प��
7:20
दिखा हुआ है तो क्या होता है रिमोव आइटम से आइटम से रिमोव हो जाते हैं ठीक है तो यह इस तरह से आप लोग क��
7:26
सकते हो अब क्लियर करोगे तो एकदम पूरी लोकल सोरेज क्लियर हो जाएगी ठीक है अब यहां पर अगर कि आपकी जीर��
7:32
मान लो मान लो मैं कुछ ऐसा करता हूं एफ की इस इक्वल्स टू सीरो तब आप क्या करो मैं डबल इक्वल टू लगाऊंगा क्योंक��
7:40
मेरी जी रोइस्ट्रिंग होगी मैं लोकल स्टोरेज टॉट लियर कर दूंगा ठीक है अपनी अरेक्ट मेथड होता है तो मैं ऐस��
7:47
कर दूंगा तो आप देखो यहां पर मैं इस प्रोग्राम में जो बंचाई लिखता रहूंगा बी को मान लो मैं सेवन कर देता हू��
7:53
ठीक है और द वैल्यू एड बी सेवन कर दिया हमारों में इस की के कर्सपॉर्णिंग वैल्यू चेंज करना चाहता हूं त��
8:00
वह भी कर सकता हूं मैं आपको दिखाता हूं कैसे आप इसको रिलोड करो मालों में बीच को इस बार टेन करना चाहत��
8:05
हूं ठीक है तो मैं टेन करो तो यह अपडेट हो जाएगी यह प्रति कि तो इस तरह से आप सेट एटम करके अपडेट भ��
8:09
कर सकते हैं ऐसा नहीं है कि आप अपडेट नहीं कर सकते तो यह सारे काम कर जा सकते हैं अब देखो जैसे मैं की क��
8:14
जीरो करूंगा मान लो मैं की को जीरो करता हूं वैल्यू को भी जीरो करता हूं आप देखना बिल्कुल स्टोरे��
8:19
लेर हो गई क्यों इसलिए क्लियर जो कि मैंने लिखा हुआ है कि अगर की जी रोट लोकल स्टोरेज क्लियर हो जाए जिस आपक��
8:25
डेमोंस्ट्रेट करने के लिए किया गया था यह आप शायद किसी नॉर्मल प्रोडाम में ना करें ठीक है मैं आपको दिखान��
8:30
आता था कि local storage.clear कैसे चलता है, local storage.remove item कैसे काम करेगा
8:35
local storage.set item और get item तो हमने देखा ही है, ठीक है, तो अब हम लोग यहाँ पर वाबा जाएंगे
8:41
और यहाँ पर मैं आपको बताता हूँ कि यह key क्या है, get the key on a given position, यह क्या चीज़ है
8:47
index key local storage number of stored items in local storage case local storage
9:01
अगर मैं local storage.length की बात करूँ, और यहाँ पर function की तरह आपको इसको run करने की ज़रूरत नहीं है
9:07
यह प्रॉपर्टी है तो आप dot length करोगे तो 0 आएगा लेकिन जैसे मैं इसको reload करूँगा मानलो मैं A को B set करता हू��
9:13
और मानलो मैं 56 को set करता हूँ as H ठीक है और अब मैं यहाँ local storage dot length run करो तो 2 आजाएग��
9:22
अब आपको दुबारा से रन करता हूँ और मैं आपको दुबारा से name harry डालता हूँ अब अगर मैं आपको लिखता हू��
9:28
local storage dot key और इसके बाद मैं आपको index डालता हूँ मानलो 0 तो ये मुझे 56 दे रहा ह��
9:36
फिर इसके बाद मैं डालता हूँ इसमें key 1 तो यह मुझे 6 दे रहा है फिर मैं key 2 डालता हूँ तो यह मुझे null दे रहा है क्योंकि सिर्फ यहाँ प��
9:43
दो items है मेरे local storage में नहीं null भी है local storage में null को delete कर देता हू��
9:48
actually 4 item है तो यह मेरी चलती रहेगी अगर मैं इसको यहाँ पर 2 करूँगा भी तो name आ गय��
9:53
3 करूँगा तो A आ गया 4 करूँगा अगर तो यहाँ प��
9:57
Null आ गया ठीक है अब Null आना शुरू हो जाएगा क्योंकि सिर्फ 4 keys हैं 0 से index
10:01
start हो रही है तो यहाँ पर total क्योंकि मेरी 4 keys है��
10:05
1, 2, 3, 4 तो इस तरह से काम कर रहा है ठीक है I hope कि आप लोग समझ गए कैस��
10:23
टो डोट वन इस एकल टो वन अगर मैंने कर दिया तो लोकल सोरेज टोट वन में वन सेट हो जाएगा ठीक है और ऑब्जेक्��
10:29
की दर्म इसमें डिलीट भी कर सकते हैं तो यह सेंटेक्स आप लोग शाय meno इसके ने पट काम करता है सेंटेक्��
10:34
ठीक है अब कुछ इंपोर्टेंट नोट्स के बारे में बात कर लेते हैं कीज एंड वैल्यूज दोनों स्ट्रिंग होनी चाहि��
10:40
लोकल स्टोरेज में ठीक है आप ऐसा नहीं कि अगर आप नंबर भी डालते हो ना अगर आप नंबर डालते तो प्रॉम टाप को ��
10:45
उसको स्ट्रिंग बना देगा ठीक है लेकिन जब यह स्टोर होती है तो यह की वाल्यू पेर जो है स्ट्रिंग होता ह��
10:52
वी केड यूज टू जेसन मेथड्स टो स्टोर ऑब्जेक्ट लोकल स्टोरेज अगर आपको ऑब्जेक्ट स्टोर करना है लोकल स्टोरे��
10:57
जेसन डोट स्ट्रिंग एफाई जो की convert करता है जेसन स्ट्रिंग में object क��
11:02
object को किस में convert करता है जेसन स्ट्रिंग में और जेसन डोट पार्��
11:05
जो की एक valid string जो की एक valid जेसन है उसको convert करता ह��
11:10
जावास्क्रिप्ट ओबजेक्ट में ठीक है यह एक वैलेट जेसन होनी चाहिए डबल कोट्स होने चाहिए इसमें सारे जेसन वाले रूल्स फॉलो करें तब ही यह पार्स होगी वरना पार्सिंग एरर आ जाएगा ठीक है तो यह चीज आपको पता होनी चाहिए अगले वीडियो में सेशन स्टोरिज के बारे में ��
11:41
प्रस्तुत प्रस्तु��
#Education
#Programming