পরিবর্তনশীল ব্যবহার করে বস্তুগত সম্পত্তিতে গতিশীল অ্যাক্সেস করুন

Question

আমি গতিশীল নাম ব্যবহার করে কোনও বস্তুর সম্পত্তিতে অ্যাক্সেস করার চেষ্টা করছি। এটা কি সম্ভব?

const something = { bar: "Foobar!" };
const foo = 'bar';
something.foo; // The idea is to access something.bar, getting "Foobar!"

Comments

এছাড়াও সম্পত্তি অ্যাক্সেস দেখুন: ডট স্বীকৃতি বনাম বন্ধনী? এবং নাম হিসাবে একটি ভেরিয়েবল ব্যবহার করে আমি কীভাবে কোনও বস্তুর সাথে সম্পত্তি যুক্ত করব?

— বার্গি

Answer 1

আছে এক্সেস বৈশিষ্ট্য করার দুটি উপায় একটি বস্তুর:

• ডট স্বরলিপি: something.bar
• বন্ধনী স্বরলিপি: something['bar']

বন্ধনীগুলির মধ্যে মানটি কোনও অভিব্যক্তি হতে পারে। অতএব, সম্পত্তিটির নামটি যদি কোনও ভেরিয়েবলে সঞ্চিত থাকে তবে আপনাকে বন্ধনী স্বরলিপি ব্যবহার করতে হবে:

var foo = 'bar';
something[foo];
// both x = something[foo] and something[foo] = x work as expected

Comments

এটির সাথে সাবধান: জাভাস্ক্রিপ্ট

— সংকলকরা

কেন এটি সম্ভব তা নিয়ে আরও কিছু তথ্য: জেএস বস্তু হ'ল সংযুক্তিযুক্ত অ্যারে, সে কারণেই। আরও পঠন: quirksmode.org/js/associative.html stackoverflow.com/questions/14031368/...

— সুধাংশু মিশ্র

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

— পরাজিত ওমব্যাট

@ ভুক্তভোমব্যাট আপনার আপত্তিটি কীসের সাথে সম্পর্কিত তা নিশ্চিত নন? আমি বলিনি যে জেএস অবজেক্টস অ্যারে?

— সুধাংশু মিশ্র

এই উত্তরটি অতিমাত্রায় ভোট দেওয়া হয়েছে, এটি কিছুই স্পষ্ট করে না ...

— Aft3rL1f3

Answer 2

এটি আমার সমাধান:

function resolve(path, obj) {
    return path.split('.').reduce(function(prev, curr) {
        return prev ? prev[curr] : null
    }, obj || self)
}

ব্যবহারের উদাহরণ:

resolve("document.body.style.width")
// or
resolve("style.width", document.body)
// or even use array indexes
// (someObject has been defined in the question)
resolve("part.0.size", someObject) 
// returns null when intermediate properties are not defined:
resolve('properties.that.do.not.exist', {hello:'world'})

Comments

দুর্দান্ত উত্তর, এটিও দেখুন: stackoverflow.com/questions/37510640/…

— জুলিয়ান নাইট

আপনি আমাকে একটি বর্ধিত সংস্করণ তৈরি করতে অনুপ্রাণিত করেছেন যা ব্র্যাককেট স্বীকৃতি

— জুলিয়ান নাইট

আমি এই সমাধান ভালোবাসি। তবে আমি মূল অবজেক্টে মানগুলি সংশোধন করার চেষ্টা করছি, মনে হচ্ছে আপনার ফাংশনটি অবজেক্টের একটি সাব কপি প্রদান করে। এটি কি পরিবর্তন করা সম্ভব যাতে প্রত্যাবর্তিত বস্তুটি সংশোধন করে আসলটি পরিবর্তন করে?

— agগল 1

Answer 3

জাভাস্ক্রিপ্টে আমরা এর সাথে অ্যাক্সেস করতে পারি:

• বিন্দু চিহ্নিতকরণ - foo.bar
• বর্গাকার বন্ধনী - foo[someVar]বাfoo["string"]

তবে কেবলমাত্র দ্বিতীয় ক্ষেত্রে গতিশীলভাবে বৈশিষ্ট্য অ্যাক্সেস করতে দেয়:

var foo = { pName1 : 1, pName2 : [1, {foo : bar }, 3] , ...}

var name = "pName"
var num  = 1;

foo[name + num]; // 1

// -- 

var a = 2;
var b = 1;
var c = "foo";

foo[name + a][b][c]; // bar

Comments

আমি যদি বিবৃতিগুলির 2,000 লাইনগুলিতে তাকাচ্ছি কারণ পূর্ববর্তী দেব স্কোয়ার বন্ধনী ব্যবহার করেন নি, এবং বিন্দু চিহ্ন দ্বারা স্ট্যাটিকালি অ্যাক্সেসযুক্ত বস্তুর বৈশিষ্ট্যগুলি। এটি একটি অনুমোদনের প্রক্রিয়া অ্যাপ্লিকেশানের জন্য 7 টি পৃথক অনুমোদনকারী এবং পদক্ষেপগুলি সমস্ত একই all / রিপ

— চাদ

Answer 4

নীচে আপনি কীভাবে দুটি স্ট্রিং সংশ্লেষ করে গতিশীলভাবে উত্পাদিত একটি সম্পত্তি নাম ব্যবহার করে কোনও সামগ্রীর সম্পত্তি ব্যবহার করতে পারবেন তার একটি ES6 উদাহরণ রয়েছে।

var suffix = " name";

var person = {
    ["first" + suffix]: "Nicholas",
    ["last" + suffix]: "Zakas"
};

console.log(person["first name"]);      // "Nicholas"
console.log(person["last name"]);       // "Zakas"

এগুলিকে গণনা করা সম্পত্তির নাম বলা হয়

Answer 5

আপনি বেশ কয়েকটি ভিন্ন উপায়ে এটি অর্জন করতে পারেন।

let foo = {
    bar: 'Hello World'
};

foo.bar;
foo['bar'];

ব্র্যাকেট স্বরলিপিটি বিশেষভাবে শক্তিশালী কারণ এটি আপনাকে ভেরিয়েবলের উপর ভিত্তি করে কোনও সম্পত্তি অ্যাক্সেস করতে দেয়:

let foo = {
    bar: 'Hello World'
};

let prop = 'bar';

foo[prop];

এটি কোনও অবজেক্টের প্রতিটি সম্পত্তি জুড়ে লুপিং পর্যন্ত বাড়ানো যেতে পারে। এটি আরও ... এর ... এর মতো নতুন জাভাস্ক্রিপ্ট নির্মানের কারণে অপ্রয়োজনীয় বলে মনে হতে পারে তবে ব্যবহারের ক্ষেত্রে এটি চিত্রিত করতে সহায়তা করে:

let foo = {
    bar: 'Hello World',
    baz: 'How are you doing?',
    last: 'Quite alright'
};

for (let prop in foo.getOwnPropertyNames()) {
    console.log(foo[prop]);
}

বিন্দু এবং বন্ধনী উভয় চিহ্নই নেস্টেড বস্তুর জন্য প্রত্যাশা অনুযায়ী কাজ করে:

let foo = {
    bar: {
        baz: 'Hello World'
    }
};

foo.bar.baz;
foo['bar']['baz'];
foo.bar['baz'];
foo['bar'].baz;

অবজেক্ট ডেস্ট্রাকচারিং

আমরা কোনও বস্তুর কোনও সম্পত্তি অ্যাক্সেসের মাধ্যম হিসাবে অবজেক্ট ডেস্ট্রাকচারিংকেও বিবেচনা করতে পারি, তবে নিম্নরূপ:

let foo = {
    bar: 'Hello World',
    baz: 'How are you doing?',
    last: 'Quite alright'
};

let prop = 'last';
let { bar, baz, [prop]: customName } = foo;

// bar = 'Hello World'
// baz = 'How are you doing?'
// customName = 'Quite alright'

Answer 6

লোড্যাশ গেট ব্যবহার করে আপনি এটি এর মতো করতে পারেন

_.get(object, 'a[0].b.c');

Comments

অনেকগুলি পরিস্থিতি রয়েছে যেমন গভীর নেস্টেড অবজেক্ট লুকআপ, যেখানে এটিই একমাত্র বিকল্প।

— জোনাথন কেম্পফ

Answer 7

আপডেট

আমি নীচে মন্তব্যগুলি বিবেচনায় নিয়েছি এবং সম্মত হয়েছি। এভাল এড়ানো যায়।

অবজেক্টে মূল বৈশিষ্ট্য অ্যাক্সেস সহজেই অর্জন করা হয় obj[variable], কিন্তু নেস্টেড হওয়া জিনিস জটিল করে তোলে। ইতিমধ্যে লিখিত কোডটি ব্যবহার করার পরামর্শ দিচ্ছি না lodash.get।

উদাহরণ

// Accessing root property
var rootProp = 'rootPropert';
_.get(object, rootProp, defaultValue);

// Accessing nested property
var listOfNestedProperties = [var1, var2];
_.get(object, listOfNestedProperties);

লোড্যাশ গেটটি বিভিন্ন উপায়ে ব্যবহার করা যেতে পারে, এখানে ডকুমেন্টেশন লোডাশ.জেটের লিঙ্ক

Comments

evalযখনই সম্ভব এটি ব্যবহার করা এড়ানো ভাল । stackoverflow.com/questions/86513/…

— লুক

evalবৈশিষ্ট্য অ্যাক্সেস হিসাবে তুচ্ছ কিছু হিসাবে ব্যবহার করা সহজ ওভারকিল এবং যে কোনও পরিস্থিতিতে খুব কমই পরামর্শ দেওয়া হয়। "ঝামেলা" কি? obj['nested']['test']খুব ভাল কাজ করে এবং আপনার স্ট্রিংয়ে কোড এমবেড করার দরকার নেই।

— কিল

ইওল তিনবার ধীর বা তার চেয়ে তিনগুণ বেশি, আমি এটি নবজাতকদের কাছে সুপারিশ করব না কারণ এটি তাদের খারাপ অভ্যাসটি শিখতে পারে। আমি ব্যবহার করি obj['nested']['value']- বাচ্চাদের মনে রাখবেন, খারাপ খারাপ!

— জেগডসফট

@ লুক এখন তিনিই কেবল লোডাশকে _.getটেবিলে আনতে চান । আমি মনে করি এই উত্তরটি এখন ডাউনভোটের পরিবর্তে উর্ধ্বতনগুলির দাবিদার। এটি ওভারকিল হতে পারে তবে এটি বিদ্যমান তা জেনে রাখা ভাল।

— এমিল বার্গারন

এটির জন্য লোডাশ প্রবর্তনের জন্য আপনাকে ধন্যবাদ। আমি গুগলের মাধ্যমে এখানে কোনও অবজেক্টের গভীরে মান নির্ধারণের জন্য একটি পদ্ধতি অনুসন্ধান করে এখানে এসেছি এবং তাদের _.set পদ্ধতিটি ব্যবহার করেছি (যা উপরে বর্ণনার সাথে সমান তবে মূল্য নির্ধারণের জন্য অতিরিক্ত যুক্তি সহ)।

— টিপি হিউজেস

Answer 8

যখনই আপনার গতিশীলভাবে সম্পত্তি অ্যাক্সেস করার প্রয়োজন হবে তখন সম্পত্তি অ্যাক্সেস না করার জন্য আপনাকে স্কয়ার ব্র্যাকেট ব্যবহার করতে হবে ""। অপারেটর
সিনট্যাক্স: অবজেক্ট [যথাযথ}

const something = { bar: "Foobar!" };
const foo = 'bar';
// something.foo; -- not correct way at it is expecting foo as proprty in  something={ foo: "value"};
// correct way is  something[foo]
alert( something[foo])

Answer 9

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

আমি যে ভাষা থেকে ডেটা চেয়েছিলাম তার মতো একটি ভাষা ফাইলের সামগ্রীর নমুনা এখানে:

const locs = {
  "audioPlayer": {
    "controls": {
      "start": "start",
      "stop": "stop"
    },
    "heading": "Use controls to start and stop audio."
  }
}

আমি এই জাতীয় ভাষার পাঠ্য অ্যাক্সেস করতে যেমন: ["অডিওপ্লেয়ার", "নিয়ন্ত্রণ", "থামান"] যেমন একটি অ্যারে পাস করতে সক্ষম হতে চেয়েছিলাম।

আমি এই ছোট্ট ফাংশনটি তৈরি করেছি যা "সর্বনিম্ন নির্দিষ্ট" (প্রথম) ঠিকানা পরামিতিটি দেখায় এবং প্রত্যাবর্তিত অবজেক্টটিকে নিজের কাছে পুনরায় নিযুক্ত করে। তারপরে যদি এটি বিদ্যমান থাকে তবে পরবর্তী সর্বাধিক নির্দিষ্ট ঠিকানা পরামিতিটি সন্ধান করতে প্রস্তুত।

function getText(selectionArray, obj) {
  selectionArray.forEach(key => {
    obj = obj[key];
  });
  return obj;
}

ব্যবহার:

/* returns 'stop' */
console.log(getText(["audioPlayer", "controls", "stop"], locs)); 

/* returns 'use controls to start and stop audio.' */
console.log(getText(["audioPlayer", "heading"], locs)); 

Answer 10

এটি আকর্ষণীয় হয়ে ওঠে যখন আপনাকে এই ফাংশনেও পরামিতিগুলি পাস করতে হবে।

কোড jsfiddle

var obj = {method:function(p1,p2,p3){console.log("method:",arguments)}}

var str = "method('p1', 'p2', 'p3');"

var match = str.match(/^\s*(\S+)\((.*)\);\s*$/);

var func = match[1]
var parameters = match[2].split(',');
for(var i = 0; i < parameters.length; ++i) {
  // clean up param begninning
    parameters[i] = parameters[i].replace(/^\s*['"]?/,'');
  // clean up param end
  parameters[i] = parameters[i].replace(/['"]?\s*$/,'');
}

obj[func](parameters); // sends parameters as array
obj[func].apply(this, parameters); // sends parameters as individual values

Answer 11

ES5 // গভীরভাবে নেস্টেড ভেরিয়েবলগুলি পরীক্ষা করুন

এই সাধারণ টুকরো কোডটি প্রতিটি ভেরিয়েবলটি পরীক্ষা না করেই গভীরভাবে নেস্টেড ভেরিয়েবল / মান অস্তিত্বের জন্য যাচাই করতে পারে ...

var getValue = function( s, context ){
    return Function.call( context || null, 'return ' + s )();
}

যাত্রা। - অবজেক্টগুলির একটি গভীরভাবে নেস্টেড অ্যারে:

a = [ 
    {
      b : [
          {
             a : 1,
             b : [
                 {
                    c : 1,
                    d : 2   // we want to check for this
                 }
             ]
           }
      ]
    } 
]

পরিবর্তে :

if(a && a[0] && a[0].b && a[0].b[0] && a[0].b[0].b && a[0].b[0].b[0] && a[0].b[0].b[0].d && a[0].b[0].b[0].d == 2 )  // true

আমরা এখন করতে পারি:

if( getValue('a[0].b[0].b[0].d') == 2 ) // true

চিয়ার্স!

Comments

যদি সমাধানটি ইওল ব্যবহার করা হয় তবে আপনি কেবল এক মিলিয়ন অন্যান্য সমস্যা তৈরি করেছেন।

— রদ্রিগো লাইট

@ রডরিগো লাইট ঠিক আছে, তাই কমপক্ষে একটি দেওয়ার পক্ষে সমস্যা হবে না ...

আপনি এখানে যান :) বিকাশকারী.মোজিলা.আর.এন / ইউএস / ডকস / ওয়েব / জাভা স্ক্রিপ্ট / রেফারেন্স /… !

— রদ্রিগো লাইট

@ রডরিগোলিট আমি এটি পড়েছি এবং Functionপরিবর্তে ব্যবহারের সমাধানটি আপডেট করেছি

Answer 12

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

• প্রথমত আমি সম্বোধন করতে চাই যে কোনও সম্পত্তির মূল্য অর্জন এবং এটি একটি গতিশীল পরিবর্তনশীলে সঞ্চয় করার বিভিন্ন উপায় রয়েছে। আইএমএইচওর প্রথম সর্বাধিক জনপ্রিয় এবং সহজতম উপায় হ'ল:

let properyValue = element.style['enter-a-property'];

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

 let elem = document.getElementById('someDiv');
 let cssProp = elem.style['width'];

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

• এখন থেকে getComputesStyle () পদ্ধতি!

function getCssProp(){
  let ele = document.getElementById("test");
  let cssProp = window.getComputedStyle(ele,null).getPropertyValue("width");
}

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

• পার্শ্ব নোট হিসাবে, getComputedValue পদ্ধতিটি কেবল পায়, এটি সেট হয় না। এটি স্পষ্টতই একটি প্রধান নেতিবাচক দিক, তবে এমন একটি পদ্ধতি রয়েছে যা সিএসএস স্টাইল শিট থেকে পাওয়া যায়, পাশাপাশি মানগুলি নির্ধারণ করে, যদিও এটি স্ট্যান্ডার্ড জাভাস্ক্রিপ্ট নয়। JQuery পদ্ধতি ...

$(selector).css(property,value)

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

Answer 13

যে কোনও নেস্টেড ভেরিয়েবলের মান নির্ধারণ করতে চাইছেন, এটি কীভাবে করবেন তা এখানে:

const _ = require('lodash'); //import lodash module

var object = { 'a': [{ 'b': { 'c': 3 } }] };

_.set(object, 'a[0].b.c', 4);
console.log(object.a[0].b.c);
// => 4

ডকুমেন্টেশন: https://lodash.com/docs/4.17.15#set

এছাড়াও, কোনও মান পেতে চাইলে ডকুমেন্টেশন: https://lodash.com/docs/4.17.15#get

Answer 14

আপনার ব্যবহার করা উচিত JSON.parse, https://www.w3schools.com/js/js_json_parse.asp এ একবার দেখুন

const obj = JSON.parse('{ "name":"John", "age":30, "city":"New York"}')
console.log(obj.name)
console.log(obj.age)

Answer 15

const something = { bar: "Foobar!" };
const foo = 'bar';

something[\`${foo}\`];

Comments

তুমি পৃথিবীতে কেন এমন করবে? আপনার fooইতিমধ্যে একটি স্ট্রিং, `${foo}`ঠিক ঠিক একই foo। (এছাড়াও, আপনার

— কোডটিতে