কীভাবে অন্য কোনও অবজেক্টের অবজেক্টের বৈশিষ্ট্য নকল করবেন?


184

বস্তুটি দেওয়া:

var firstObject = {
    key1 : 'value1',
    key2 : 'value2'
};

আমি কীভাবে অন্য কোনও বস্তুর ( secondObject) এর মধ্যে এই বৈশিষ্ট্যগুলি অনুলিপি করতে পারি :

var secondObject = {
    key1 : 'value1',
    key2 : 'value2',
    key3 : 'value3',
    key4 : 'value4'
};

একটি রেফারেন্স ব্যবহার করে firstObject? এটার মতো কিছু:

var secondObject = {
    firstObject,
    key3 : 'value3',
    key4 : 'value4'
};

(এটি কাজ করে না ... আমি কোডটি কীভাবে গঠন করতে চাই তা কেবল বড় লাইনে দেখানোর জন্য রেখেছি)।

কোনও জাভাস্ক্রিপ্ট ফ্রেমওয়ার্ক ব্যবহার না করেই কি কোনও সমাধান সম্ভব ?


3
এখানে উত্তর দেওয়া হয়েছে: স্ট্যাকওভারফ্লো.com
ক্যালভিন

1
প্রশ্নটি হল, আপনি কি অগভীর বা একটি গভীর অনুলিপি চান? গভীর হলে কত গভীর?
জর্জি

5
এফডাব্লুআইডাব্লু, তাদের "বৈশিষ্ট্য," "গুণাবলী" বলা হয় না।
টিজে ক্রাউডার

এখানে এর সত্যিই কুশ্রী এমন কিছু বিষয় যা তা সত্ত্বেও কাজ করে (আসলে প্রস্তাবিত নয় শুধু একটি এক-লাইনের প্রমাণ-এর-ধারণা!):secondObject = JSON.parse('{' + JSON.stringify(firstObject).match(/^.(.*).$/)[1] + ',' + JSON.stringify(secondObject).match(/^.(.*).$/)[1] + '}');
বেন লি

@ টিজে ক্রাউডার: আমি প্রশ্নটি সংশোধন করেছি ... ধন্যবাদ।
ইগর পপভ

উত্তর:


213
for(var k in firstObject) secondObject[k]=firstObject[k];

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

1
@ মাইকেল ক্রেলিন-হ্যাকার, আপনি এখানে যে অনুপস্থিত তা হ'ল স্ট্যাকওভারফ্লো কেবল ওপি-র সুবিধার জন্য নয়। এটি ভবিষ্যতের দর্শকদের জন্য একটি রেফারেন্স হিসাবে ব্যবহৃত হয়েছে যাদের সামান্য পৃথক ব্যবহারের কেস থাকতে পারে , যেখানে সেই পয়েন্টারটি কার্যকর হতে পারে।
বেন লি

@ বেনলি, আমি ইগরপোপভ নই ;-) এবং ওপি না হওয়ায় আমি ইতিমধ্যে বলেছি যে আমি পয়েন্টারটি দরকারী এবং আপনার উত্তরটিও খুঁজে পেয়েছি, এটি আমার পছন্দ নয় এমন অংশটি "আপনার সত্যই ব্যবহার করা উচিত" is
মাইকেল ক্রেলিন - হ্যাকার

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

2
আমি মনে করি এই উত্তরটি নীচের লিঙ্ক বিকাশকারী হিসাবে অনুযায়ী আপডেট করা প্রয়োজন। মোজিলা.অর্গ /en-US/docs/Web/ জাভা স্ক্রিপ্ট / রেফারেন্স /… কনস্ট লক্ষ্য = {এ: 1, বি: 2}; কনস্ট উত্স = {বি: 4, সি: 5}; const retTarget = অবজেক্ট.সেসাইন (টার্গেট, উত্স); console.log (টার্গেট); // প্রত্যাশিত আউটপুট: অবজেক্ট {এ: 1, বি: 4, সি: 5} কনসোল.লগ (রিটার্নড টার্গেট); // প্রত্যাশিত আউটপুট: অবজেক্ট {এ: 1, বি: 4, সি: 5}
এলবাসেল

170

@ বার্ডজু'নির উত্তরটি থেকে এখানে একটি ইঙ্গিত নেওয়া, ES6 একটি দেশীয় সমাধান সরবরাহ করেছে: Object.assign()ফাংশন!

ব্যবহার সহজ:

Object.assign(secondObject, firstObject);

এটাই!

সমর্থন এখনই স্পষ্টত দরিদ্র; কেবল ফায়ারফক্স (34+) বক্স-এর বাইরে এটি সমর্থন করে, যখন ক্রোম (45+) এবং অপেরা (32+) 'পরীক্ষামূলক পতাকা' সেট করা দরকার।

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


4
+1, অন্য একটি দুর্দান্ত ES6 বৈশিষ্ট্য। অবশ্যই ব্রাউজার / এমনকি নোড.জেএস সমর্থন এখনই অভাবী, তবে আপনি যেমনটি উল্লেখ করেছেন, ট্রান্সপোর্টারগুলি উপলব্ধ। এবং যদি আপনি এগুলি পছন্দ করেন না - শিমস: github.com/paulmillr/es6-shim (বা স্বতন্ত্র, কেবলমাত্রObject.assign() শিম: github.com/ljharb/object.assign )।
bardzusny

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

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

এটি যদি প্রশ্নের সাথে সামঞ্জস্য হয় তবে ঠিক আছে।
মোস্তাফিজ রহমান


100

প্রতি ES6 - স্প্রেড সিনট্যাক্স :

আপনি কেবল ব্যবহার করতে পারেন:

const thirdObject = {
   ...firstObject,
   ...secondObject   
}

এটি রেফারেন্সের মাধ্যমে এই বিষয়গুলি পাস করার সমস্যা এড়ায়।

অতিরিক্তভাবে এটি গভীর বাসা বাঁধার জিনিসগুলির যত্ন নেয়।


2
বাহ, এটি সত্যিই দুর্দান্ত :) :) উত্তরের জন্য ধন্যবাদ। স্পষ্টতই, আমার আর এটির দরকার নেই (যেহেতু এটি কিছুক্ষণ আগে ছিল) তবে এটি অন্য কাউকে সাহায্য করতে পারে।
ইগোর পপভ 10

1
ইএস 6 এর আরও কুলার ব্যবহারের জন্য +1! উপরে বর্ণিত এমডিএন ডকসগুলি
ডিআইএমএম রিপার

1
@ জায়েজ - রেফারেন্সের জন্য ভাল মন্তব্য। একটি বস্তু (মূল প্রশ্ন প্রতি) সহজ সম্পত্তি নামের সাথে হয় iterable।
কিংপ্পি

1
Chrome এ কাজ করে, এটি ES6, আপনার বর্তমানে বাবেল বা কিছু ES6 ট্রান্সপোর্টার প্রয়োজন। ভবিষ্যতে সমস্ত ব্রাউজার এই সিনট্যাক্সটিকে সমর্থন করবে বলে আশা করা হচ্ছে।
কিংপ্পি 14'19

89

প্রথম বস্তুর বৈশিষ্ট্যগুলির মধ্য দিয়ে লুপ করুন এবং এটিকে দ্বিতীয় বস্তুতে নির্ধারণ করুন:

var firstObject = {
    key1 : 'value1',
    key2 : 'value2'
};

var secondObject = {
    key3 : 'value3',
    key4 : 'value4'
};

for (var prop in firstObject) {
    if (firstObject.hasOwnProperty(prop)) {
        secondObject[prop] = firstObject[prop];
    }
}

for- inলুপ যথেষ্ট নয়; আপনার যা দরকার তা hasOwnProperty। কেন তার বিশদ বিবরণের জন্য http://bonsaiden.github.com/JavaScript-Garden/#object.forinloop দেখুন ।


@ রবডাব্লু, আমি ভাবিনি যে ওপি referenceপ্রযুক্তিগত দিক থেকে ব্যবহার করছে। আমি মনে করি তিনি কেবল প্রাকৃতিক ভাষা "উল্লেখ করে" বোঝায়।
বেন লি

1
@ রবডাব্লু: ওপি আসলে "কপি" বলেছে।
টিজে ক্রাউডার

49

এখানে নেਕਰোমেন্সার বাজানো হচ্ছে, কারণ Object.keys()এই সমস্ত .hasOwnProperty()চেক থেকে আমাদের বাঁচানোর সম্ভাবনা সহ ES5 আমাদের এনেছে ।

Object.keys(firstObject).forEach(function(key) {
  secondObject[key] = firstObject[key];
});

অথবা, এটিকে কোনও ফাংশনে আবদ্ধ (লোড্যাশের "সীমাবদ্ধ" অনুলিপি _.assign()):

function assign(object, source) {
  Object.keys(source).forEach(function(key) {
    object[key] = source[key];
  });
}

assign(secondObject, firstObject); // assign firstObject properties to secondObject

Object.keys()তুলনামূলকভাবে নতুন পদ্ধতি, সবচেয়ে উল্লেখযোগ্য: আই <9 এ উপলব্ধ নয় The একইটি আসলে .forEach()অ্যারে পদ্ধতিতে যায় যা আমি নিয়মিত forলুপের জায়গায় ব্যবহার করি ।

ভাগ্যক্রমে, এই প্রাচীন ব্রাউজারগুলির জন্য এসএএস-শিম পাওয়া যায় যা অনেকগুলি ES5 বৈশিষ্ট্যগুলিকে পলিফিল করবে (সেই দুটি সহ)।

(শীতল, নতুন ভাষার বৈশিষ্ট্যগুলি ব্যবহার থেকে বিরত থাকার পক্ষে আমি পলিফিলের পক্ষে আছি all)


হঠাৎ করেই, কোথাও 2 টি ডাউনবোটস। ছোট্ট সুযোগের সাথে চালিত হওয়া যে এই ছেলেরা এই মন্তব্যটি পড়বে - তাদের আসল কারণ কী? আমার উত্তরে আপনি কিছু পরিবর্তন / উন্নতি করার পরামর্শ দিচ্ছেন?
bardzusny

1
এটি অবশ্যই শীর্ষে ওঠার যোগ্য, পাশাপাশি অবজেক্ট স্প্রেড ইনিশিয়ালাইজার আরও নীচে (ES6) - এটি তীর ফাংশনগুলির সাথে আরও পরিষ্কার দেখায়!
mjohnsonengr

12

Necro'ing যাতে লোকেরা একটি ব্যক্তিগত অনুলিপি এবং প্রকৃত অবজেক্ট চেক সহ একটি অনুলিপি পদ্ধতি আবিষ্কার করতে পারে:

var extend = function (original, context, key) {
  for (key in context)
    if (context.hasOwnProperty(key))
      if (Object.prototype.toString.call(context[key]) === '[object Object]')
        original[key] = extend(original[key] || {}, context[key]);
      else
        original[key] = context[key];
  return original;
};

দ্রষ্টব্য যে এটি অ্যারে বা ফাংশন অবজেক্টগুলির গভীর-অনুলিপি করে না (তবে এটি অন্যান্য সমস্ত ধরণের অবজেক্টকে গভীর কপি করে)।
ম্যাট ব্রাউন

1
হ্যাঁ, আপনি যদি গভীর অনুলিপি অ্যারে করতে চান তবে কেবল টাইপ চেকটি অন্তর্ভুক্ত করতে সংশোধন করতে পারেন'[object Array]'
নিজিকোকন

12

অবজেক্টগুলি একত্রিত করতে কেউ অবজেক্ট.অ্যাসাইন ব্যবহার করতে পারে। এটি ডান থেকে বামে সাধারণ সম্পত্তি একত্রিত ও ওভাররাইড করবে, বামে একই সম্পত্তি ডানদিক দিয়ে ওভাররাইড করা হবে।

এবং উত্স অবজেক্টগুলিকে পরিবর্তন করতে এড়াতে প্রথমে একটি খালি বস্তু সরবরাহ করা জরুরী । উত্স অবজেক্টগুলি পরিষ্কার রেখে দেওয়া উচিত কারণ Object.assign()নিজেই কোনও নতুন অবজেক্ট ফেরত দেয়।

আশাকরি এটা সাহায্য করবে!

var firstObject = {
    key1 : 'value1',
    key2 : 'value2'
};

var secondObject = {
    key3 : 'value3',
    key4 : 'value4'
};

var finalObject = Object.assign({}, firstObject, secondObject)

console.log(finalObject)


তবে আপনি যদি চান যে এটি প্রথম বস্তুকে পরিবর্তন করতে পারে? আপনার কাছে A এবং অবজেক্ট B অবজেক্ট রয়েছে এবং আপনি এটিতে চান যে অবজেক্ট A কে রূপান্তর করতে পারেন যাতে সমস্ত বৈশিষ্ট্য B এর অবজেক্টের সমান হয়? আপনি কি Object.assign (A, B) করবেন?
21/03

দুর্ভাগ্যক্রমে সেই মজিলা বিকাশকারী নেটওয়ার্ক পৃষ্ঠা অনুসারে আইই, অ্যান্ড্রয়েড ওয়েবভিউ, অ্যান্ড্রয়েড অপেরাতে সমর্থিত নয়।
তবুওtiti99

6

কিংপ্পি ধারণা এবং ওপি ধারণা (অগভীর অনুলিপি) এর উন্নতি - আমি কেবল ওপি "উদাহরণ" তে 3 ডট যুক্ত করি :)

var secondObject = {
    ...firstObject,
    key3 : 'value3',
    key4 : 'value4'
};


4

এটি এখানে কাজ করা উচিত ।

var secondObject = {
    firstObject: JSON.parse(JSON.stringify(firstObject)),
    key3 : 'value3',
    key4 : 'value4'
};

দ্রষ্টব্য : এটি firstObject
নোট 2 এর পদ্ধতিগুলি অনুলিপি করবে না : পুরানো ব্রাউজারগুলিতে ব্যবহারের জন্য আপনাকে জসন পার্সার লাগবে
নোট 3 : রেফারেন্স দ্বারা নির্ধারণ করা একটি কার্যকর বিকল্প, বিশেষত যদি firstObjectপদ্ধতিতে থাকে। সেই অনুযায়ী প্রদত্ত জেসফিডাল উদাহরণটি সামঞ্জস্য করুন


3

দুর্ভাগ্যক্রমে, আপনি এর মতো কোনও জিনিসে কোনও পরিবর্তনকের রেফারেন্স রাখতে পারবেন না। তবে আপনি এমন একটি ফাংশন তৈরি করতে পারেন যা বস্তুর মানগুলিকে অন্য কোনও বস্তুতে অনুলিপি করে।

function extend( obj1, obj2 ) {
    for ( var i in obj2 ) {
        obj1[i] = obj2[i];
    }
    return obj1;
}

var firstObject = {
    key1: "value1",
    key2: "value2"
};

var secondObject = extend({
    key3: "value3",
    key4: "value4"
}, firstObject );

এটি দেশী সম্পত্তিগুলিও অনুলিপি করবে। এবং কীভাবে সেই সম্পত্তিগুলির সম্পর্কে যা তারা নিজেরাই অবজেক্টস?
KooiInc

1

যদি আপনি কেবল দ্বিতীয় অবজেক্টে বিদ্যমান বৈশিষ্ট্যগুলি দখল করতে চান তবে আপনি Object.keysপ্রথম অবজেক্টের বৈশিষ্ট্য দখল করতে ব্যবহার করতে পারেন , আপনি দুটি পদ্ধতি করতে পারেন:

এ) map পার্শ্ব প্রতিক্রিয়া ব্যবহার করে দ্বিতীয় অবজেক্টের জন্য প্রথম বস্তুর বৈশিষ্ট্য নির্ধারণ করতে:

var a = {a:100, b:9000, c:300};
var b = {b:-1};

Object.keys(a).map(function(key, index) {
    if (typeof b[key] !== 'undefined') {
        console.log(key);
        b[key] = a[key];    
    }
});

বি) বা reduceএকটি নতুন অবজেক্ট তৈরি করে এটি দ্বিতীয় অবজেক্টে নির্ধারণ করুন। সচেতন থাকুন যে এই পদ্ধতিতে দ্বিতীয় বস্তুর প্রথম বৈশিষ্ট্যের সাথে মেলে না এমন তার আগে অন্যান্য বৈশিষ্ট্যগুলি প্রতিস্থাপন করেছে :

var a = {a:100, b:9000, c:300};
var b = {b:-1, d:-1}; // d will be gone

b = Object.keys(a).reduce(function(result, current) {
    if (typeof b[current] !== 'undefined') {
        result[current] = a[current];   
    }
    return result;
}, {});

1

সম্পত্তি স্প্রেড স্বরলিপি ব্যবহার করুন। এটি ES2018 এ যুক্ত করা হয়েছিল (অ্যারে / পুনরাবৃত্তির জন্য স্প্রেড আগে ছিল, ES2015), {... ফার্স্টবজেক্ট all সমস্ত গুণাগুণকে আলাদা আলাদা বৈশিষ্ট্য হিসাবে ছড়িয়ে দেয়।

let secondObject = {
      ...firstObject,
      key3 : 'value3',
      key4 : 'value4'
    }

আপনি কি দয়া করে আপনার উত্তর এবং কেন এটি কেন প্রশ্নটি সমাধান করছেন সে সম্পর্কে কিছু প্রসঙ্গ দিতে পারেন
তামির ক্লিন

0

আমি বরং ফার্স্টবজেক্টটিকে সেকেন্ডওজেক্টের প্রোটোটাইপ হিসাবে ব্যবহার করব এবং সম্পত্তি বিবরণী যুক্ত করব:

var secondObject = Object.create(firstObject, {
      key3: {value: "value3", writable: true, configurable: true, enumerable: true},
      key4: {value: "value4", writable: true, configurable: true, enumerable: true}
      });

এটি অবশ্যই ওয়ান-লাইনার নয়, তবে এটি আপনাকে আরও নিয়ন্ত্রণ দেয়। আপনি যদি সম্পত্তি বর্ণনাকারীর প্রতি আগ্রহী হন তবে আমি এই নিবন্ধটি পড়ার পরামর্শ দিচ্ছি: http://patrickdelancy.com/2012/09/property-descripttors-in-javascript/#comment-2062 এবং MDN পৃষ্ঠা https: //developer.mozilla। সংস্থা / en-মার্কিন / ডক্স / ওয়েব / জাভাস্ক্রিপ্ট / রেফারেন্স / Global_Objects / অবজেক্ট / তৈরি

আপনি কেবল মানগুলি বরাদ্দ করতে পারেন এবং বর্ণনাকারীদের বাদ দিতে পারেন এবং এটি আরও খাটো করে তুলতে পারেন:

var secondObject = Object.create(firstObject, {
      key3: {value: "value3"}
      key4: {value: "value4"}
  });

সামঞ্জস্যতা: ECMAScript 5, সুতরাং আই 9 +


0
var firstObject = {
     key1: "value1",
     key2: "value2"
};

var secondObject = {
     key3: "value3",
     key4: "value4"
     copy: function(firstObject){
           this.key1 = firstObject.key1;
           this.key2 = firstObject.key2;
     }
 };

ফোলউইং পদ্ধতি ব্যবহার করে বৈশিষ্ট্যগুলি অনুলিপি করা হবে

secondObject.copy(firstObject)

আমি জাভাস্ক্রিপ্টে খুব নতুন, কিন্তু এটির কাজ খুঁজে পেয়েছি। আমি খুব বেশি দীর্ঘ অনুমান করি, তবে এটি কার্যকর হয়।

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