জাভাস্ক্রিপ্ট সম্পত্তি অ্যাক্সেস: ডট স্বীকৃতি বনাম বন্ধনী?


394

প্রথম ফর্মটি কেবল একটি স্ট্রিং আক্ষরিক নয়, একটি পরিবর্তনশীল ব্যবহার করতে পারে তার স্পষ্ট সত্যটি ব্যতীত অন্যগুলির মধ্যে একটির ব্যবহার করার কোনও কারণ আছে, এবং যদি তাই হয় তবে কোন ক্ষেত্রে?

কোডে:

// Given:
var foo = {'bar': 'baz'};

// Then
var x = foo['bar'];

// vs. 
var x = foo.bar;

প্রসঙ্গ: আমি একটি কোড জেনারেটর লিখেছি যা এই এক্সপ্রেশনগুলি উত্পাদন করে এবং আমি ভাবছি যা ভাল।


3
কেবল চিপ ইন করা, আপনার মূল প্রশ্নের উত্তর নয় (যেহেতু আপনার কাছে এতক্ষণ ভাল ব্যাখ্যা রয়েছে), কিন্তু গতি অনুসারে এখানে উল্লেখ করার মতো কোনও পার্থক্য নেই: jsperf.com/dot-vs-square-bracket । উপরের পরীক্ষাটি তাদের উভয়কেই সেরাভাবে 2% মার্জিন দেয়, তারা ঘাড় এবং ঘাড়।
অনিচ্ছাকৃত


এই প্রশ্ন / উত্তরটি ইউটিএফ -8 কীগুলির জন্যও ব্যবহার করা যেতে পারে।
পিটার ক্রাউস

উত্তর:


422

( এখান থেকে উত্সাহিত ।)

স্কোয়ার ব্র্যাকেট স্বরলিপিটি এমন অক্ষরগুলির ব্যবহারের অনুমতি দেয় যা বিন্দু চিহ্নিতকরণ সহ ব্যবহার করা যায় না:

var foo = myForm.foo[]; // incorrect syntax
var foo = myForm["foo[]"]; // correct syntax

myForm["ダ"]( আরও উদাহরণ ) হিসাবে নন-এএসসিআইআই (ইউটিএফ -8) অক্ষর সহ ।

দ্বিতীয়ত, সম্ভাব্য নামগুলির সাথে পৃথক হওয়া প্রপার্টি নামগুলির সাথে কাজ করার সময় বর্গাকার বন্ধনী চিহ্নিতকরণ কার্যকর হয়:

for (var i = 0; i < 10; i++) {
  someFunction(myForm["myControlNumber" + i]);
}

পরিক্রমা:

  • ডট স্বরলিখনটি দ্রুত লেখার জন্য এবং পড়ার জন্য আরও স্পষ্ট।
  • স্কোয়ার ব্র্যাকেট স্বরলিপি বিশেষ অক্ষরযুক্ত বৈশিষ্ট্যগুলিতে অ্যাক্সেস এবং ভেরিয়েবলগুলি ব্যবহার করে বৈশিষ্ট্য নির্বাচন করার অনুমতি দেয়

অক্ষরের আরও একটি উদাহরণ যা বিন্দু চিহ্নিতকরণের সাথে ব্যবহার করা যায় না সেগুলি হ'ল সম্পত্তির নাম যা তাদের মধ্যে বিন্দু রয়েছে

উদাহরণস্বরূপ, একটি জসন প্রতিক্রিয়াতে বলা সম্পত্তি থাকতে পারে bar.Baz

var foo = myResponse.bar.Baz; // incorrect syntax
var foo = myResponse["bar.Baz"]; // correct syntax

45
কোড উদাহরণ এবং সংক্ষিপ্তসার শব্দটি ভীষণ পরিচিত। dev-archive.net/articles/js-dot-notation
কোয়ান্টিন

61
চাকাটি পুনরায় উদ্ভাবনের দরকার নেই, আছে কি? এটি একটি রেফারেন্স হিসাবে উদ্ধৃত।
অ্যারন রোটভেল

13
ডট স্বরলিপিটি দ্রুততর (কমপক্ষে আমার জন্য) আপনার ব্রাউজারটি পরীক্ষা করুন jsperf.com/dot-notation-vs-bracket-notation/2
ডেভ চেন

4
ক্রোম 44 এ আমার মেশিন বন্ধনীর স্বরলিপিটি দ্রুত
অস্টিন ফ্রান্স

2
@ চেঙ্গুয়াং আপনি যখন কোনও বস্তুর যে কোনও কীতে কোনও ভেরিয়েবলের কী সংরক্ষণ করা হয় তার কোনও সম্পত্তিতে অ্যাক্সেস করতে চান, আপনি ডট নোটেশন দিয়ে পারবেন না।
আব্দুল

104

ব্র্যাকেট স্বরলিপি আপনাকে ভেরিয়েবলের মধ্যে সংরক্ষিত নাম অনুসারে বৈশিষ্ট্য অ্যাক্সেস করতে দেয়:

var obj = { "abc" : "hello" };
var x = "abc";
var y = obj[x];
console.log(y); //output - hello

obj.x এই ক্ষেত্রে কাজ করবে না।


12

জাভাস্ক্রিপ্টে বৈশিষ্ট্য অ্যাক্সেস করার দুটি সাধারণ উপায় হ'ল ডট এবং বর্গাকার বন্ধনী সহ। উভয়ই value.x and value[x]মূল্যে কোনও সম্পত্তি অ্যাক্সেস করে — তবে অগত্যা একই সম্পত্তি নয়। পার্থক্যটি কীভাবে এক্স এর ব্যাখ্যা করা হয়। বিন্দুটি ব্যবহার করার সময়, বিন্দুর পরে অংশটি অবশ্যই একটি বৈধ পরিবর্তনশীল নাম হওয়া উচিত এবং এটি সরাসরি সম্পত্তিটির নাম দেয়। বর্গাকার বন্ধনী ব্যবহার করার সময়, বন্ধকের মধ্যে প্রকাশের সম্পত্তিটির নাম পাওয়ার জন্য মূল্যায়ন করা হয়। যেখানে value.x "x" নামের মানটির সম্পত্তি নিয়ে আসে, মান [x] এক্স এক্সপ্রেশনটি মূল্যায়নের চেষ্টা করে এবং ফলাফলটিকে সম্পত্তি নাম হিসাবে ব্যবহার করে।

সুতরাং আপনি যদি জানেন যে যে সম্পত্তিটিতে আপনি আগ্রহী তাকে "দৈর্ঘ্য" বলা হয়, তবে আপনি বলবেন value.length। আপনি যদি ভেরিয়েবলের মধ্যে থাকা মান অনুসারে সম্পত্তিটি বের করতে চান তবে iআপনি বলবেন value[i]। আর অবস্থায় বৈশিষ্টগুলির নাম কোনো স্ট্রিং হতে কারণ পারে, আপনি একটি সম্পত্তি নামে অ্যাক্সেস করতে চান তাহলে “2”বা “John Doe”, আপনি বর্গাকার বন্ধনী ব্যবহার করতে হবে: value[2] or value["John Doe"]। আপনি সম্পত্তির সুনির্দিষ্ট নাম আগে থেকেই জানলেও এই কেসটি “2” nor “John Doe”হ'ল কারণ কোনওটিই একটি বৈধ পরিবর্তনশীল নাম নয় এবং তাই ডট নোটেশনের মাধ্যমে অ্যাক্সেস করা যায় না।

অ্যারে ক্ষেত্রে

একটি অ্যারের উপাদানগুলি বৈশিষ্ট্যে সঞ্চিত থাকে। কারণ এই বৈশিষ্ট্যগুলির নামগুলি সংখ্যা এবং আমাদের প্রায়শই একটি ভেরিয়েবলের কাছ থেকে তাদের নাম নেওয়া দরকার, সেগুলি অ্যাক্সেস করার জন্য আমাদের বন্ধনী বাক্য গঠন ব্যবহার করতে হবে। একটি অ্যারের দৈর্ঘ্যের বৈশিষ্ট্য আমাদের জানায় যে এতে কতগুলি উপাদান রয়েছে। এই সম্পত্তি নাম একটি বৈধ পরিবর্তনশীল নাম, এবং আমরা আগাম তার নাম জানি, তাই একটি অ্যারের দৈর্ঘ্য খোঁজার, আপনি সাধারণত লিখতে array.lengthকারণ যে এর চেয়ে লিখতে সহজ array["length"]


আপনি অ্যারে.এলনেথ সম্পর্কে আরও বিস্তারিত বলতে পারেন? আপনি বলছেন যে বিন্দু চিহ্নিতকরণ দ্বারা অ্যাক্সেসিত বৈশিষ্ট্যগুলি মূল্যায়ন করা হয় না তাই অ্যারের ক্ষেত্রে যদি দৈর্ঘ্যটি আমাদের মূল্যায়নের পরিবর্তে "দৈর্ঘ্য" স্ট্রিংটি দেয় না, এই ক্ষেত্রে অ্যারেতে আইটেমের সংখ্যা থাকে? The elements in an array are stored in propertiesএটাই আমাকে বিভ্রান্ত করে। বৈশিষ্ট্যে সঞ্চিত বলতে কী বোঝ? বৈশিষ্ট্য কি? আমার বোধগম্য বিন্যাসে বৈশিষ্ট্য ব্যতীত মানগুলির গুচ্ছ মাত্র। এটি যদি তারা সম্পত্তিগুলিতে সঞ্চিত থাকে তবে এটি কীভাবে আসবে না property: value/ এসোসিয়েটিভ অ্যারে?
লিম্পুলস

এই উত্তরটি বিশেষভাবে মূল্যবান কারণ এটি দুটি স্বীকৃতির মধ্যে পার্থক্য ব্যাখ্যা করে।
দাবাবী

11

ইন্টারনেট এক্সপ্লোরার 8-তে কিছু কীওয়ার্ড (যেমন newএবং class) দিয়ে ডট নোটেশন কাজ করে না ।

আমার এই কোডটি ছিল:

//app.users is a hash
app.users.new = {
  // some code
}

এবং এটি ভয়ঙ্কর "প্রত্যাশিত ইন্ডেন্টিফায়ার "টিকে ট্রিগার করে (উইন্ডোজ এক্সপি-তে অন্তত আই 8 এ, আমি অন্য পরিবেশের চেষ্টা করিনি)। এর সহজ সমাধান হ'ল বন্ধনী স্বরলিপিতে স্যুইচ করা:

app.users['new'] = {
  // some code
}

সহায়ক উত্তর। ধন্যবাদ.
ইলিয়াস করিম

ক্রোম 2019
ফণী ithতভিজ

8

এই স্বরলিপি ব্যবহার করার সময় সতর্কতা অবলম্বন করুন: যেমন যদি আমরা একটি উইন্ডোর প্যারেন্টে উপস্থিত একটি ফাংশন অ্যাক্সেস করতে চাই। আইই তে:

window['parent']['func']

এর সমতুল্য নয়

window.['parent.func']

আমরা হয় ব্যবহার করতে পারেন:

window['parent']['func'] 

অথবা

window.parent.func 

এটি অ্যাক্সেস করতে


6

সাধারণভাবে বলতে গেলে, তারা একই কাজ করে।
তবুও, বন্ধনী স্বরলিপি আপনাকে এমন স্টাফগুলি করার সুযোগ দেয় যা আপনি ডট নোটেশন দিয়ে যেমন করতে পারবেন না, যেমন

var x = elem["foo[]"]; // can't do elem.foo[];

এটি বিশেষ অক্ষরযুক্ত যে কোনও সম্পত্তিতে বাড়ানো যেতে পারে।


5

সম্পত্তির নামগুলিতে যদি বিশেষ অক্ষর থাকে তবে আপনাকে বন্ধনী ব্যবহার করতে হবে:

var foo = {
    "Hello, world!": true,
}
foo["Hello, world!"] = false;

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


3

ব্র্যাকেট স্বরলিপিটি ভেরিয়েবল ব্যবহার করতে পারে, সুতরাং এটি দুটি ক্ষেত্রে কার্যকর যেখানে ডট নোটেশন কাজ করবে না:

1) যখন সম্পত্তির নামগুলি গতিশীলভাবে নির্ধারিত হয় (যখন সঠিক নামগুলি রানটাইম পর্যন্ত জানা যায় না)।

২) কোনও অবজেক্টের সমস্ত বৈশিষ্ট্য অতিক্রম করার জন্য for..in লুপ ব্যবহার করার সময়।

উত্স: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects


3

আপনাকে যখন বর্গাকার বন্ধনী স্বরলিপি ব্যবহার করতে হবে -

  1. সম্পত্তির নাম নম্বর।

    var ob = {
      1: 'One',
      7 : 'Seven'
    }
    ob.7  // SyntaxError
    ob[7] // "Seven"
  2. সম্পত্তি নামের বিশেষ চরিত্র রয়েছে।

    var ob = {
      'This is one': 1,
      'This is seven': 7,
    }  
    ob.'This is one'  // SyntaxError
    ob['This is one'] // 1
  3. সম্পত্তির নামটি একটি ভেরিয়েবলের জন্য বরাদ্দ করা হয় এবং আপনি এই পরিবর্তনশীল দ্বারা সম্পত্তি মান অ্যাক্সেস করতে চান।

    var ob = {
      'One': 1,
      'Seven': 7,
    }
    
    var _Seven = 'Seven';
    ob._Seven  // undefined
    ob[_Seven] // 7

1

স্বীকৃতি []সহায়ক যেখানে ক্ষেত্রে :

আপনার বস্তুর গতিশীল এবং কিছু র্যান্ডম মান মত কী আছে হতে পারে যদি numberএবং [], বা অন্য কোন বিশেষ অক্ষর - উদাহরণস্বরূপ

var a = { 1 : 3 };

এখন আপনি যদি a.1এটির মতো অ্যাক্সেস করার চেষ্টা করেন তবে এটি একটি ত্রুটির মাধ্যমে ঘটবে, কারণ এটি সেখানে স্ট্রিংয়ের প্রত্যাশা করে।


1

ডট স্বরলিপি সর্বদা পছন্দসই। আপনি যদি কিছু "স্মার্ট" আইডিই বা পাঠ্য সম্পাদক ব্যবহার করছেন তবে এটি সেই অবজেক্ট থেকে অপরিবর্তিত নামগুলি দেখায়। যখন আপনার নাম যেমন ড্যাশ বা অনুরূপ কিছু অবৈধ সাথে নাম থাকে তখনই বন্ধনী নোটেশন ব্যবহার করুন। নামটি যদি কোনও ভেরিয়েবলে সঞ্চিত থাকে তবে।


এবং এমন পরিস্থিতি রয়েছে যেখানে ব্রাশকে চিহ্নিত করার কোনও সুযোগ নেই, এমনকি আপনার ড্যাশ না থাকলেও। উদাহরণস্বরূপ, আপনি লিখতে পারেন Math.sqrt(25), কিন্তু না Math['sqrt'](25)
মিস্টার লিস্টার

0

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


0

উদাহরণ যেখানে ডট স্বরলিপি ব্যর্থ হয়

json = { 
   "value:":4,
   'help"':2,
   "hello'":32,
   "data+":2,
   "😎":'😴',
   "a[]":[ 
      2,
      2
   ]
};

// correct
console.log(json['value:']);
console.log(json['help"']);
console.log(json["help\""]);
console.log(json['hello\'']);
console.log(json["hello'"]);
console.log(json["data+"]);
console.log(json["😎"]);
console.log(json["a[]"]);

// wrong
console.log(json.value:);
console.log(json.help");
console.log(json.hello');
console.log(json.data+);
console.log(json.😎);
console.log(json.a[]);

সম্পত্তির নামগুলি জাভাস্ক্রিপ্টের সিনট্যাক্স বিধিগুলিতে হস্তক্ষেপ করা উচিত নয় যাতে আপনি সেগুলি অ্যাক্সেস করতে সক্ষম হন json.property_name

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.