লোকালস্টোরেজ.জেট আইটেম ('আইটেম') কি লোকালস্টোরেজ.ইটিম বা লোকাল স্টোরেজ ['আইটেম'] এর চেয়ে ভাল?

Question

আমি সম্প্রতি লোকালস্টোরেজ সম্পর্কে একটি প্রশ্ন জিজ্ঞাসা করেছি । আইটেমটি এখনও সেট না করা অবস্থায় ব্যবহার করে JSON.parse(localStorage.item)এবং JSON.parse(localStorage['item'])ফিরে NULLআসার জন্য কাজ করছিল না ।

তবে, JSON.parse(localStorage.getItem('item')কাজ করেছেন। এবং এটি দেখা যাচ্ছে, JSON.parse(localStorage.testObject || null)কাজ করে।

একটি মন্তব্য মূলত বলেছিল localStorage.getItem()এবং localStorage.setItem()সর্বদা পছন্দ করা উচিত:

গেটর এবং সেটার এলএস এপিআইয়ের সাথে কাজ করার জন্য একটি সামঞ্জস্যপূর্ণ, প্রমিত এবং ক্রসব্রোজার সুসংগত উপায় সরবরাহ করে এবং সর্বদা অন্যান্য উপায়ে পছন্দ করা উচিত। - ক্রিস্টোফ

আমি লোকালস্টোরেজের জন্য শর্টহ্যান্ড ডট এবং ব্র্যাকেট স্বরলিপি ব্যবহার করতে পছন্দ করেছি, তবে আমি অন্যদের এ সম্পর্কে জানতে আগ্রহী। লোকালস্টোরেজ.জেট আইটেম ('আইটেম') লোকালস্টোরেজ.ইটিম বা লোকালস্টোরেজ ['আইটেম'] এর চেয়ে ভাল নাকি তারা যতক্ষণ কাজ করে শর্টহ্যান্ডের স্বরলিপিগুলি ঠিক আছে?

Comments

আমি বিশ্বাস করি ক্রিস্টোফ তাঁর যুক্তি বেশ পরিষ্কার করে দিয়েছেন। getItemএবং জিনিসগুলি setItemকরার মানসম্মত উপায়।

— ফ্যাব্রিসিও ম্যাট

আমি দেখি. Recommendations সুপারিশগুলির মধ্যে এড়াতে খুব কম ঘুমানো, তবে এই ওয়েবস্টোরেজ এপিআই তুলনামূলকভাবে নতুন হ'ল, আমি ব্যক্তিগতভাবে সঠিকভাবে নথিভুক্ত getItem/ setItemপদ্ধতিগুলির সাথে লেগে থাকি । আমি পরে আবার চশমা পড়ব, তবে আপনার প্রশ্নের উত্তর দেওয়ার একমাত্র ব্যর্থ-প্রুফ উপায়টি সমস্ত বড় ব্রাউজারগুলিতে পরীক্ষার সময় চলছে।

— ফ্যাব্রিসিও ম্যাট

স্পেসিফিকেশন বলছে "স্টোরেজ অবজেক্টের সমর্থিত সম্পত্তির নাম হ'ল বস্তুর সাথে সম্পর্কিত তালিকায় বর্তমানে উপস্থিত প্রতিটি কী / মান জোড়ার কীগুলি" " করুন যে না localStorage.itemআদর্শায়িত, বাড়ছে কি?

— বার্মার

@ বার্মার কিছুটা দেরি করে জবাব দিলেন, কিন্তু এই প্রশ্নটির অনেকগুলি ফল দেখে এবং এখানে ফিরে আসার পরে আমি উত্তর দেব যে আপনি একেবারে ঠিক বলেছেন। তবে, আমি আবার ব্যবহার করার পরামর্শ দিচ্ছি getItem/ setItemকারণ এই পদ্ধতিগুলি localStorageবস্তুর বিদ্যমান বৈশিষ্ট্যগুলির সাথে বিরোধ নয় conflict উদাহরণ: localStorage.setItem('getItem', 'blah'); console.log(localStorage.getItem('getItem'));কাজ করে, যখন localStorage.getItem = 'blah';লোকালস্টোরেজের getItemপদ্ধতিটি ওভাররাইট করে । jsfiddle.net/DrquY

— Fabrício Matté

আমার এখনও জয়লাভের যে কোনও পদ্ধতির পক্ষে আমি এখনও কোনও যুক্তি দেখিনি। নাম / মান জোড়া যেমন বরাবর ছিল তেমন একটি করে। অন্যটি যখন আমাদের পেতে / সেট পদ্ধতি ব্যবহার করে তখন আমাদের নালাগুলি দেয়। আমি মনে করি যদি আমি অন্য মানের সাথে তালিকার তুলনা করছিলাম যা alচ্ছিক মানগুলির জন্য অপ্রয়োজনীয় মানগুলি একে অপরের চেয়ে বেশি বোঝায় তবে একটিতে বা অন্যটিকে 'পছন্দসই' বলা হয় যখন তারা উভয়ই অনুমিত হয়, আইএমও। উভয় পন্থা একটি কারণে উপলব্ধ করা হয়েছিল।

— এরিক রেপেন

Answer 1

সরাসরি সম্পত্তি অ্যাক্সেস ( localStorage.itemবা localStorage['item']) এবং কার্যকরী ইন্টারফেস ( localStorage.getItem('item')) ব্যবহার করে উভয়ই সূক্ষ্মভাবে কাজ করে। উভয়ই স্ট্যান্ডার্ড এবং ক্রস ব্রাউজারের সাথে সামঞ্জস্যপূর্ণ। ^* অনুমান অনুসারে :

স্টোরেজ অবজেক্টে সমর্থিত সম্পত্তির নাম হ'ল বস্তুর সাথে সম্পর্কিত তালিকায় বর্তমানে উপস্থিত প্রতিটি কী / মান জোড়ার কীগুলি ক্রম অনুসারে স্টোরেজ অঞ্চলে কীগুলি সর্বশেষ যুক্ত করা হয়েছিল।

অনুরোধকৃত নামের সাথে কোনও কী / মান জুটি না পাওয়া গেলে তারা কেবল আলাদা আচরণ করে। উদাহরণস্বরূপ, যদি চাবি 'item'বিদ্যমান নয়, var a = localStorage.item;পরিণাম ডেকে আনবে aহচ্ছে undefined, যখন var a = localStorage.getItem('item');পরিণাম ডেকে আনবে aমান null। আপনি আবিষ্কৃত হয়েছে হিসেবে undefinedএবং nullজাভাস্ক্রিপ্ট / ECMAScript মধ্যে যোগ্য নয়। :)

সম্পাদনা: ক্রিস্টোফ তার উত্তরে যেমন উল্লেখ করেছেন , কার্যকরী ইন্টারফেসই পূর্বনির্ধারিত বৈশিষ্ট্যের সমান চাবিতে নির্ভরযোগ্যতার সাথে মানগুলি সংরক্ষণ এবং পুনরুদ্ধার করার একমাত্র উপায় localStorage। (এসব ছয় আছেন: length, key, setItem, getItem, removeItem, এবং clear।) সুতরাং, উদাহরণস্বরূপ, নিম্নলিখিত সবসময় কাজের:

localStorage.setItem('length', 2);
console.log(localStorage.getItem('length'));

বিশেষত দ্রষ্টব্য যে প্রথম বিবৃতিটি সম্পত্তিটিকে প্রভাবিত করবে না localStorage.length(সম্ভবত যদি 'length'ইতিমধ্যে কোনও কী না থাকে তবে এটি বাড়ানো ব্যতীত localStorage)। এই ক্ষেত্রে, অনুমানটি অভ্যন্তরীণভাবে বেমানান বলে মনে হচ্ছে।

তবে নিম্নলিখিতগুলি সম্ভবত আপনি যা চান তা করবে না:

localStorage.length = 2;
console.log(localStorage.length);

মজার বিষয় হল, প্রথমটি ক্রোমের কোনও অপ-অপশন, তবে ফায়ারফক্সের কার্যকরী কলটির সমার্থক। দ্বিতীয়টি সর্বদা উপস্থিত কীগুলির সংখ্যা লগ করবে localStorage।

^* _{এটি ব্রাউজারগুলির ক্ষেত্রে সত্য যা প্রথম স্থানে ওয়েব স্টোরেজ সমর্থন করে। (এটিতে আধুনিক সমস্ত ডেস্কটপ এবং মোবাইল ব্রাউজারগুলি অন্তর্ভুক্ত রয়েছে)) কুকি বা অন্যান্য কৌশল ব্যবহার করে স্থানীয় স্টোরেজ অনুকরণকারী পরিবেশগুলির জন্য, ব্যবহারটি ব্যবহার করা শিমের উপর নির্ভর করে। এর জন্য বেশ কয়েকটি পলিফিল localStorageপাওয়া যাবে ।}

Answer 2

প্রশ্নটি ইতিমধ্যে বেশ পুরানো, তবে যেহেতু প্রশ্নে আমার উদ্ধৃতি দেওয়া হয়েছে, তাই আমার বক্তব্য সম্পর্কে আমার দুটি কথা বলা উচিত বলে আমি মনে করি।

স্টোরেজ অবজেক্টটি বরং বিশেষ, এটি একটি অবজেক্ট, যা কী / মান জোড়ার তালিকায় অ্যাক্সেস সরবরাহ করে। সুতরাং এটি কোনও সাধারণ বস্তু বা অ্যারে নয়।

উদাহরণস্বরূপ এটির দৈর্ঘ্য বৈশিষ্ট্য রয়েছে যা অ্যারের দৈর্ঘ্যের বৈশিষ্ট্যটি কেবলমাত্র পঠনযোগ্য এবং স্টোরেজটিতে কীগুলির সংখ্যা দেয়।

একটি অ্যারে দিয়ে আপনি এটি করতে পারেন:

var a = [1,2,3,4];
a.length // => 4
a.length = 2;
a // => [1,2]

এখানে গেটার / সেটার ব্যবহার করার প্রথম কারণ রয়েছে। আপনি যদি একটি আইটেম সেট করতে চান length?

localStorage.length = "foo";
localStorage.length  // => 0
localStorage.setItem("length","foo");
// the "length" key is now only accessable via the getter method:
localStorage.length  // => 1
localStorage.getItem("length") // => "foo"

স্টোরেজ অবজেক্টের অন্যান্য সদস্যদের সাথে এটি আরও বেশি সমালোচিত, যেহেতু সেগুলি লেখার যোগ্য এবং আপনি ঘটনাক্রমে এই জাতীয় পদ্ধতিতে ওভাররাইট করতে পারেন getItem। এপিআই পদ্ধতি ব্যবহার করা এই যে কোনও সম্ভাব্য সমস্যা প্রতিরোধ করে এবং একটি সামঞ্জস্যপূর্ণ ইন্টারফেস সরবরাহ করে।

আকর্ষণীয় বিষয়টি হল অনুচ্ছেদে নিম্নলিখিত অনুচ্ছেদ (আমার দ্বারা জোর দেওয়া):

সেটআইটেম () এবং অপসারণ আইটেম () পদ্ধতিগুলি ব্যর্থতার ক্ষেত্রে অবশ্যই পারমাণবিক হতে হবে। ব্যর্থতার ক্ষেত্রে, পদ্ধতিটি কিছুই করে না। এটি হ'ল, ডেটা স্টোরেজ এরিয়ায় পরিবর্তনগুলি সফল হতে হবে, বা ডেটা স্টোরেজ এরিয়াটি একেবারেই পরিবর্তন করা উচিত নয়।

তাত্ত্বিকভাবে getters / setters এবং []অ্যাক্সেস মধ্যে কোন পার্থক্য থাকা উচিত , কিন্তু আপনি কখনও জানেন না ...

Comments

প্রথম পয়েন্টে, জাভাস্ক্রিপ্টের সমস্ত কিছুর কাছে অভিশাপ লিখনযোগ্য এবং লোকালস্টোরেজ এপিআইতে কেবলমাত্র তিনটি বৈশিষ্ট্যই আমি অবগত রয়েছি। দ্বিতীয়ত, বিন্দু বা বন্ধনী স্বরলিপি ব্যবহার করে আপনি এখনও কিছু ধরণের দেশীয় সেটার প্রয়োগ বাস্তবায়ন করছেন যেহেতু মানগুলি আপনি কীভাবে সেট করেন তা নির্ধারণ করে না কেন এটির মতো একই সুরক্ষা পাওয়া উচিত। এর আগে আমি কখনই ক্লায়েন্ট-সাইড ব্রাউজারের দৃশ্যে একটি অবিরাম মান দূষিত হওয়ার কথা শুনিনি। আমার সন্দেহ হয় এমনকি ভ্যানিলা অ্যাক্সেসরগুলিরও সাধারণত একরকম সুরক্ষা থাকে।

— এরিক রেপেন

নামের সংঘর্ষের বিষয়টি দুর্দান্ত। lengthসম্পত্তি পরিবর্তন হবে না (যেমন, Chrome এবং Firefox অন্তত [*]) যদি আপনি কল localStorage.setItem("length", something);, কিন্তু আপনি উদ্ধার করতে পারেন somethingসঙ্গে localStorage.getItem("length");। মজার বিষয় হচ্ছে, localStorage.length = something;ক্রোমে অ্যাসাইনিং করা কোনও বিকল্প নয়, তবে ফায়ারফক্সে এটি somethingকী এর অধীনে সংরক্ষণ করবে "length"(যা আপনি কেবল কার্যকরী ইন্টারফেস ব্যবহার করে পুনরুদ্ধার করতে পারেন)। [*] বাস্তবিক, ফায়ারফক্স এ, lengthসম্পত্তি যদি চাবি পরিবর্তন করতে হবে "length"আগে থেকেই নয় localStorage।

— টেড হপ

@ErikReppen - মতে বৈশিষ্ট , localStorageছয় পূর্বনির্ধারিত বৈশিষ্ট্য আছে: length, key, getItem, setItem, removeItem, এবং clear।

— টেড হপ

Answer 3

আমি জানি এটি একটি পুরানো পোস্ট তবে যেহেতু কেউই প্রকৃতপক্ষে পারফরম্যান্সের কথা উল্লেখ করেনি আমি এটিকে মাপদণ্ডের জন্য কিছু জেএসফিউর পরীক্ষা করেছিলাম এবং পাশাপাশি একটি সুসংগত ইন্টারফেস getItemএবংsetItem ডট নোটেশন বা বন্ধনী ব্যবহারের পাশাপাশি পড়ার পক্ষে আরও সহজ করার চেয়ে ধারাবাহিকভাবে ।

জেএসপুরে আমার পরীক্ষা এখানে Perf

Comments

ur jscreen এর পরীক্ষায় বন্ধনী অন্তর্ভুক্ত করেনি। আমি সেগুলি যুক্ত করেছি এবং কিছু পরীক্ষা চালিয়েছি, পারফরম্যান্সটি ব্রাউজার-ভিত্তিক। ক্রোম এবং Firefox উভয়েই getItemএবং setItemপ্রতিটি শ্রেণীতে ধীরতম, বিন্দু ক্রোম দ্রুততম হচ্ছে এবং বন্ধনী ফায়ারফক্স দ্রুততম হচ্ছে ছিলেন। আমি আরও মনে করি যে 'পড়তে অনেক সহজ হওয়া' সম্পূর্ণ বিষয়গত ... হ্যাঁ এতে ফাংশনটি সম্পাদন করার কথা বলা হয়েছে, তবে যে কেউ কখনও বস্তু বা অ্যারে ভেরিয়েবলের সাথে কাজ করেছে সেগুলি ডট / ব্র্যাকেটের সাথে কী ঘটবে তা আধ সেকেন্ডে জানতে পারে।

— প্ল্যান্টইদিয়া

আপনি ঠিক বলেছেন, এই পরীক্ষাগুলি লেখার সময় পরীক্ষকগণ এবং সেটটারগুলি ডট নোটেশনের চেয়ে ধারাবাহিকভাবে দ্রুত ছিল। কেস আর হয় না। আমি যখন 5 মিনিট পাই তখন আমি ফিরে এসে এই উত্তরটি আপডেট করব। যে ইশারা জন্য ধন্যবাদ।

— ডেভ ম্যাকিনটোস

Answer 4

যেমনটি উল্লেখ করা হয়েছিল, অস্তিত্বহীন কী বাদে প্রায় কোনও পার্থক্য নেই। কর্মক্ষমতা পার্থক্য পরিবর্তিত হয় কি ব্রাউজার / অপারেটিং সিস্টেম আপনি ব্যবহার করছেন নির্ভর করে। তবে এটি আসলে আলাদা নয়।

আমি আপনাকে স্ট্যান্ডার্ড ইন্টারফেস ব্যবহার করার পরামর্শ দিচ্ছি, কারণ এটি এটির ব্যবহারের একটি প্রস্তাবিত উপায়।

Comments

"আমি আপনাকে স্ট্যান্ডার্ড ইন্টারফেস ব্যবহার করার পরামর্শ দিই" - উভয় ইন্টারফেস স্ট্যান্ডার্ডে নির্দিষ্ট করা হয়েছে।

— টেড হপ্প

@ টেডহপ্প আমি মনে করি যে কেবল সেটআইটেম এবং গেটআইটিম স্ট্যান্ডার্ডে নির্দিষ্ট করা আছে ।

— সালভাদোর ডালি

অপরদিকে. স্ট্যান্ডার্ড থেকে: "স্টোরেজ অবজেক্টে সমর্থিত সম্পত্তির নাম হ'ল অবজেক্টের সাথে সম্পর্কিত তালিকায় বর্তমানে উপস্থিত প্রতিটি কী / মান জোড়ার কীগুলি ক্রম অনুসারে স্টোরেজ অঞ্চলে কীগুলি সর্বশেষ যুক্ত করা হয়েছিল।"

— টেড হপ্প