একটি বিদ্যমান অবজেক্টের উপর কি এটি বিন্যাস সম্ভব? (জাভাস্ক্রিপ্ট ইএস 6)

Question

উদাহরণস্বরূপ যদি আমার দুটি জিনিস থাকে:

var foo = {
  x: "bar",
  y: "baz"
}

এবং

var oof = {}

এবং আমি x এবং y মানগুলি foo থেকে oof এ স্থানান্তর করতে চেয়েছিলাম। Es6 ডেস্ট্রাকচারিং সিনট্যাক্স ব্যবহার করে এটি করার কোনও উপায় আছে কি?

সম্ভবত কিছু:

oof{x,y} = foo

Comments

আপনি যদি সমস্ত সম্পত্তি অনুলিপি করতে চানObject.assign(oof, foo)

— elclanrs

এমডিএন-তে এখানে প্রচুর ধ্বংসাত্মক উদাহরণ রয়েছে , তবে আপনি যা জিজ্ঞাসা করছেন সেটিকে আমি দেখতে পাচ্ছি না।

— jਫਰ00

হুম আমি

— একটিও পাইনি

আমার উত্তর নীচে একটি দুটি লাইন সমাধানের জন্য দেখুনObject.assign

— Zfalen

Answer 1

কুরুচিপূর্ণ এবং কিছুটা পুনরাবৃত্তি করার সময়, আপনি এটি করতে পারেন

({x: oof.x, y: oof.y} = foo);

যা fooবস্তুর দুটি মান পড়বে এবং তাদেরকে তাদের oofবস্তুটিতে তাদের নিজ নিজ অবস্থানগুলিতে লিখবে ।

ব্যক্তিগতভাবে আমি এখনও পড়তে চাই

oof.x = foo.x;
oof.y = foo.y;

অথবা

['x', 'y'].forEach(prop => oof[prop] = foo[prop]);

যদিও।

Comments

বিকল্প ['x', 'y']। ForEach (প্রোপ => ওফ [প্রপ] = ফু [প্রপ]]; আমি দেখতে পাচ্ছি, এখন অবধি কেবলমাত্র একটি ডিআরওয়াই (নিজেকে পুনরাবৃত্তি করবেন না)। "DRY" ম্যাপযুক্ত বেশ কয়েকটি কীগুলির ক্ষেত্রে সত্যই কার্যকর। আপনার কেবলমাত্র একটি জায়গা আপডেট করতে হবে। আমি ভুল হতে পারে। যাই হোক ধন্যবাদ!

— ভ্লাদিমির ব্রাসিল

তৃতীয় উদাহরণটি DRY, তবে আপনাকে কীগুলি হিসাবে স্ট্রিংগুলি ব্যবহার করতে হবে, যা জাভাস্ক্রিপ্ট সাধারণত অন্তর্নিহিতভাবে করে। এর চেয়ে কম উপদ্রব নেওয়ার বিষয়টি নিশ্চিত নয়: কনস্ট {x, y} = foo; কনস্ট oof = {x, y};

— জেফ লোরি

প্রথম পরামর্শটি যেখানে কাজ করে সেখানে কেউ আমাকে jsfiddle এ দেখাতে পারেন? এটি এখানে ক্রোমটিতে

— techguy2000

@ techguy2000 আপনি পরে সেমিকোলন ভুলে গেছেন var oof = {};।

— লগানফস্মিথ

প্রথম কোডে, থাকা উচিত নয় ({x: oof.x, y: oof.y} = foo)? আমি তোমাদের একটি অতিরিক্ত রেখেছি মনে চ সালে মালকড়ি ।

— Sornii

Answer 2

না, ডেস্ট্রাকচারিং সংক্ষিপ্ত মুহুর্তগুলিতে সদস্যের অভিব্যক্তিগুলিকে সমর্থন করে না তবে বর্তমান সময়ে কেবল সাধারণ প্লেসমেন্টের নাম। সেখানে আলোচনা হয়েছে esdiscuss উপর সম্পর্কে এমন, কিন্তু কোন প্রস্তাব ES6 সেটিকে করতে হবে।

আপনি Object.assignতবে ব্যবহার করতে সক্ষম হতে পারেন - যদি আপনার নিজের সমস্ত সম্পত্তি প্রয়োজন না হয়, আপনি এখনও করতে পারেন

var foo = …,
    oof = {};
{
    let {x, y} = foo;
    Object.assign(oof, {x, y})
}

Comments

@ লাগানফস্মিথ, আপনার উদাহরণটি নোড ৪.২.২ সহ আমার পরীক্ষায় কমপক্ষে আমার পক্ষে কাজ করছে না। --harmony_destructuringসক্ষম সঙ্গে । আমি "সিনট্যাক্স এরর: অপ্রত্যাশিত টোকেন" দেখছি।

— jpierson

@ লাগানফস্মিথ আপনার একটি সঠিক উত্তর জমা দেওয়া উচিত কারণ এটি একটি খুব দরকারী মন্তব্য ইমো।

— সুলিওয়ানে

@ সুলিওয়ানে: সে এখনই করেছে (এখন) । বার্গি, আপনি লোগান দেখানো হিসাবে সদস্য এক্সপ্রেশন ব্যবহার করতে পারেন যে কল আউট উত্তর আপডেট করা সম্ভবত সেরা । (এপ্রিল থেকে জুন 2015-এর মধ্যে কি

— জল্পনা

@ টিজে ক্রাউডার না, আমার মনে হয় না এটি পরিবর্তন হয়েছে, আমার ধারণা আমি যে বিষয়ে কথা বলছিলাম {oof.x, oof.y} = foo। অথবা সম্ভবত আমি এটি মিস করেছি।

— বার্গি

Answer 3

আইএমও এটি যা আপনি সন্ধান করছেন তা সম্পাদন করার সহজতম উপায়:

let { prop1, prop2, prop3 } = someObject;
let data = { prop1, prop2, prop3 };

  // data === { prop1: someObject.prop1, ... }

মূলত, ভেরিয়েবলগুলিতে ডেস্ট্রাকচার এবং তারপরে একটি নতুন অবজেক্ট তৈরি করতে ইনিশিয়ালাইজার শর্টহ্যান্ড ব্যবহার করুন। দরকার নেইObject.assign

আমি মনে করি এটি যাইহোক, সবচেয়ে পঠনযোগ্য উপায়। আপনি someObjectচান তা থেকে যথাযথ প্রপসগুলি এখানে নির্বাচন করতে পারেন। আপনার যদি কোনও বিদ্যমান অবজেক্ট থাকে তবে আপনি কেবল প্রপসগুলিকে মার্জ করতে চান, এই জাতীয় কিছু করুন:

let { prop1, prop2, prop3 } = someObject;
let data = Object.assign(otherObject, { prop1, prop2, prop3 });
    // Makes a new copy, or...
Object.assign(otherObject, { prop1, prop2, prop3 });
    // Merges into otherObject

আরেকটি, যুক্তিযুক্তভাবে পরিষ্কার, এটি লেখার উপায় হ'ল:

let { prop1, prop2, prop3 } = someObject;
let newObject = { prop1, prop2, prop3 };

// Merges your selected props into otherObject
Object.assign(otherObject, newObject);

আমি এটি POSTঅনুরোধগুলির জন্য অনেকটা ব্যবহার করি যেখানে আমার কেবল কয়েকটি পৃথক ডেটা প্রয়োজন। তবে আমি সম্মত হই যে এটি করার জন্য একটি লাইনার থাকা উচিত।

সম্পাদনা: পিএস - আমি সম্প্রতি শিখেছি আপনি জটিল পদক্ষেপের বাইরে নেস্টেড মানগুলি টানতে প্রথম ধাপে আল্ট্রা ডেস্ট্রাকচারিং ব্যবহার করতে পারেন! এই ক্ষেত্রে...

let { prop1, 
      prop2: { somethingDeeper }, 
      prop3: { 
         nested1: {
            nested2
         } 
      } = someObject;
let data = { prop1, somethingDeeper, nested2 };

এছাড়াও, আপনি নতুন অবজেক্ট তৈরি করার সময় Object.assign এর পরিবর্তে স্প্রেড অপারেটর ব্যবহার করতে পারেন:

const { prop1, prop2, prop3 } = someObject;
let finalObject = {...otherObject, prop1, prop2, prop3 };

অথবা ...

const { prop1, prop2, prop3 } = someObject;
const intermediateObject = { prop1, prop2, prop3 };
const finalObject = {...otherObject, ...intermediateObject };

Comments

আমি এই পদ্ধতির পছন্দ, বাস্তববাদী।

— জেসি

এটি আমিই করি তবে এটি খুব শুষ্ক নয়। আমি মনে করি অনেক লোকের সত্যিকারের যা দরকার তা হ'ল কেবল একটি এক্সট্রাক্ট কীগুলি।

— jgmjgm

@ জেজিএমজিজিএম হ্যাঁ, এটি একটি তৈরি করা ভাল লাগবে তবে আমি অনুমান করি যে এটি লেখার পক্ষে খুব বেশি কঠিন নয়।

— Zfalen

Answer 4

অন্য চেয়ে Object.assignআছে বস্তুর বিস্তার সিনট্যাক্স যা ECMAScript প্রোগ্রামিং এর জন্য একটি পর্যায় 2 প্রস্তাব করা হয়।

var foo = {
  x: "bar",
  y: "baz"
}

var oof = { z: "z" }

oof =  {...oof, ...foo }

console.log(oof)

/* result 
{
  "x": "bar",
  "y": "baz",
  "z": "z"
}
*/

কিন্তু এই বৈশিষ্ট্যটি ব্যবহার করতে আপনাকে ব্যবহার করতে হবে stage-2বা transform-object-rest-spreadBabel জন্য প্লাগ-ইন। এখানে বাবেলের সাথে একটি ডেমো রয়েছেstage-2

Comments

এটি প্রকৃতপক্ষে বিদ্যমান বস্তুর উপর বৈশিষ্ট্যগুলি সেট করে না, বরং উভয়ের সমস্ত বৈশিষ্ট্য সমন্বিত একটি নতুন অবজেক্ট তৈরি করে।

— ম্যাট ব্রাউন

Answer 5

বাবেলজেএস প্লাগইন

আপনি যদি ব্যাবেলজেএস ব্যবহার করছেন তবে আপনি এখন আমার প্লাগইনটি সক্রিয় করতে পারেন babel-plugin-transform-object-from-destructuring( ইনস্টলেশন ও ব্যবহারের জন্য এনপিএম প্যাকেজ দেখুন )।

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

বস্তুর উদাহরণ

let myObject = {
  test1: "stringTest1",
  test2: "stringTest2",
  test3: "stringTest3"
};
let { test1, test3 } = myObject,
  myTest = { test1, test3 };

হিসাবে লেখা যেতে পারে:

let myTest = { test1, test3 } = myObject;

অ্যারে উদাহরণ

let myArray = ["stringTest1", "stringTest2", "stringTest3"];
let [ test1, , test3 ] = myArray,
  myTest = [ test1, test3 ];

হিসাবে লেখা যেতে পারে:

let myTest = [ test1, , test3 ] = myArray;

Comments

এটি আমি যা চেয়েছিলাম ঠিক তা-ই। ধন্যবাদ!

— গারেটমার্মিং

let myTest = { test1, test3 } = myObject;কাজ করে না

— এটডোকু

Answer 6

এটা সম্পূর্ণ সম্ভব। শুধু একটি বিবৃতিতে না।

var foo = {
    x: "bar",
    y: "baz"
};
var oof = {};
({x: oof.x, y: oof.y} = foo); // {x: "bar", y: "baz"}

(বিবৃতিটির চারপাশে প্রথম বন্ধনীর বিষয়টি লক্ষ্য করুন)) তবে কোড-গল্ফিংয়ের চেয়ে সুসংগততা মনে রাখবেন :)।

সূত্র: http://exploringjs.com/es6/ch_destructuring.html#sec_assignment-targets

Answer 7

আপনি কেবল এটির জন্য পুনর্গঠন ব্যবহার করতে পারেন:

const foo = {x:"a", y:"b"};
const {...oof} = foo; // {x:"a", y:"b"} 

অথবা উভয় বস্তু একত্রিত করুন যদি ওফের মান থাকে:

const foo = {x:"a", y:"b"};
let oof = {z:"c"}
oof = Object.assign({}, oof, foo)

Comments

আমি মনে করি এই প্রথম কেসটি আমি ঠিক যা খুঁজছিলাম is আমি ক্রোম কনসোলে এটি চেষ্টা করে দেখে মনে হচ্ছে এটি কার্যকর হয়েছে। চিয়ার্স! @ ক্যাম্পসফারি

— মেজর বুমর

@ মজোরবামার আপনার কলটি শেষ পর্যন্ত, তবে আমি আসলে আপনার প্রশ্নের উত্তর না দেওয়ার জন্য পদ্ধতির বিষয়টি বিবেচনা করব, কারণ এগুলি উভয়ই আপনার শিরোনামের মতো বিদ্যমান অবজেক্টগুলিতে সম্পত্তি যুক্ত করার পরিবর্তে নতুন অবজেক্ট তৈরি করে।

— লগানফস্মিথ

এটি একটি ভাল পয়েন্ট @ লাগানফস্মিথ। আমি মনে করি যে শিবিরের সাফারি যে পদ্ধতিটি নিয়ে এসেছিল তাতে আমি কেবল উত্তেজিত ছিলাম কারণ আমি বুঝতে পারি নি যে এটি সম্ভব ছিল।

— মেজর বামার

আপনি যদি কোনও নতুন অবজেক্ট তৈরি করতে মন চান না তবে আপনি ঠিক করতে পারেনoof = {...oof, ...foo}

— জোশুয়া কোডি

Answer 8

আপনি একটি তীর ফাংশনে ডিস্ট্রাকচার্ড অবজেক্টটি ফিরিয়ে দিতে পারেন এবং এটিকে ভেরিয়েবলের জন্য বরাদ্দ করতে অবজেক্ট.স্যাসাইন () ব্যবহার করতে পারেন।

const foo = {
  x: "bar",
  y: "baz"
}

const oof = Object.assign({}, () => ({ x, y } = foo));

Answer 9

শুকনো

var a = {a1:1, a2: 2, a3: 3};
var b = {b1:1, b2: 2, b3: 3};

const newVar = (() => ({a1, a2, b1, b2})).bind({...a, ...b});
const val = newVar();
console.log({...val});
// print: Object { a1: 1, a2: 2, b1: 1, b2: 2 }

অথবা

console.log({...(() => ({a1, a2, b1, b2})).bind({...a, ...b})()});

Answer 10

আপনি অন্য কোনও অবজেক্ট অ্যাট্রিবিউটকে সরাসরি বরাদ্দ করা কোনও অবজেক্টটি ধ্বংস করতে পারেন।

কাজের উদাহরণ:

let user = {};
[user.name, user.username] = "Stack Overflow".split(' ');
document.write(`
1st attr: ${user.name} <br /> 
2nd attr: ${user.username}`);

আপনি যে অক্ষরটি ধরতে চান তার একই নামের সাথে ভেরিয়েবলগুলি ব্যবহার করে ধ্বংস করতে কাজ করতে পারেন, আপনার এইভাবে করার দরকার নেই:

let user = { name: 'Mike' }
let { name: name } = user;

এইভাবে ব্যবহার করুন:

let user = { name: 'Mike' }
let { name } = user;

স্ট্রাক্ট স্ট্রাকচারের একই বৈশিষ্ট্যটির নাম থাকলে আপনি একইভাবে নতুন মান সেট করতে পারেন।

এই কাজের উদাহরণ দেখুন:

// The object to be destructed
let options = {
  title: "Menu",
  width: 100,
  height: 200
};

// Destructing
let {width: w, height: h, title} = options;

// Feedback
document.write(title + "<br />");  // Menu
document.write(w + "<br />");      // 100
document.write(h);                 // 200

Answer 11

এটি ক্রোম 53.0.2785.89 এ কাজ করে

let foo = {
  x: "bar",
  y: "baz"
};

let oof = {x, y} = foo;

console.log(`oof: ${JSON.stringify(oof)});

//prints
oof: {
  "x": "bar",
  "y": "baz"
}

Comments

দুঃখজনকভাবে দেখে মনে হচ্ছে যে এটি oofকেবলমাত্র একটি রেফারেন্স পেয়েছে fooএবং পুরো ডেস্ট্রাকচারিংকে বাইপাস করে (কমপক্ষে ক্রোমে)। oof === fooএবং let oof = { x } = fooএখনও ফিরে আসে{ x, y }

— Theo.T

@ থিও.টি ভাল ক্যাচ এটি একটি গুঁড়ো, আমি অন্য উপায় খুঁজে পেতে হবে

— ব্যবহারকারী 1577390

এগুলি কেবল জেএস কীভাবে বিভ্রান্তিকর হতে পারে তা প্রদর্শনের জন্য মূল্যবান।

— jgmjgm

Answer 12

আমি এই পদ্ধতিটি নিয়ে এসেছি:

exports.pick = function pick(src, props, dest={}) {
    return Object.keys(props).reduce((d,p) => {
        if(typeof props[p] === 'string') {
            d[props[p]] = src[p];
        } else if(props[p]) {
            d[p] = src[p];
        }
        return d;
    },dest);
};

যা আপনি এটির মতো ব্যবহার করতে পারেন:

let cbEvents = util.pick(this.props.events, {onFocus:1,onBlur:1,onCheck:'onChange'});
let wrapEvents = util.pick(this.props.events, {onMouseEnter:1,onMouseLeave:1});

অর্থাত্, আপনি যে বৈশিষ্ট্যগুলি চান তা বেছে নিতে এবং এটিকে একটি নতুন অবজেক্টে রেখে দিতে পারেন। _.pickআপনি একই সাথে তাদের পুনরায় নামকরণ করতে পারেন এর বিপরীতে ।

আপনি যদি কোনও বিদ্যমান বস্তুতে প্রপসগুলি অনুলিপি করতে চান তবে কেবল destআর্গ সেট করুন ।

Answer 13

এটি এক ধরণের প্রতারণা, তবে আপনি এই জাতীয় কিছু করতে পারেন ...

const originalObject = {
  hello: 'nurse',
  meaningOfLife: 42,
  your: 'mom',
};

const partialObject = (({ hello, your }) => {
  return { hello, your };
})(originalObject);

console.log(partialObject); // ​​​​​{ hello: 'nurse', your: 'mom' }​​​​​

অনুশীলনে, আমি মনে করি আপনি যদিও এটি খুব কমই ব্যবহার করতে চাইবেন। নিম্নলিখিতটি আরও স্পষ্ট ... তবে প্রায় মজাদার নয়।

const partialObject = {
  hello: originalObject.hello,
  your: originalObject.your,
};

আর একটি সম্পূর্ণ ভিন্ন রুট, যার মধ্যে প্রোটোটাইপ সহ কৌতুক রয়েছে (এখনই সাবধান ...):

if (!Object.prototype.pluck) {
  Object.prototype.pluck = function(...props) {
    return props.reduce((destObj, prop) => {
      destObj[prop] = this[prop];

      return destObj;
    }, {});
  }
}

const originalObject = {
  hello: 'nurse',
  meaningOfLife: 42,
  your: 'mom',
};

const partialObject2 = originalObject.pluck('hello', 'your');

console.log(partialObject2); // { hello: 'nurse', your: 'mom' }

Answer 14

এটি আমি সবচেয়ে পঠনযোগ্য এবং সংক্ষিপ্ততম সমাধানটি নিয়ে আসতে পারি:

let props = { 
  isValidDate: 'yes',
  badProp: 'no!',
};

let { isValidDate } = props;
let newProps = { isValidDate };

console.log(newProps);

এটি আউটপুট হবে { isValidDate: 'yes' }

এটি কোনও দিন ভালো let newProps = ({ isValidDate } = props)লাগবে যেমন কিছু বলতে সক্ষম হয় তবে দুর্ভাগ্যক্রমে এটি ES6 সমর্থন করে এমন কিছু নয়।

Answer 15

এটি কোনও সুন্দর উপায় নয় বা আমি এটির প্রস্তাবও দিচ্ছি না, তবে কেবল জ্ঞানের জন্য এটি এইভাবে সম্ভব।

const myObject = {
  name: 'foo',
  surname: 'bar',
  year: 2018
};

const newObject = ['name', 'surname'].reduce(
  (prev, curr) => (prev[curr] = myObject[curr], prev),
  {},
);

console.log(JSON.stringify(newObject)); // {"name":"foo","surname":"bar"}

Answer 16

আপনি এটি অনুসরণ করতে JSON শ্রেণীর পদ্ধতিগুলি ব্যবহার করতে পারেন

const foo = {
   x: "bar",
   y: "baz"
};

const oof = JSON.parse(JSON.stringify(foo, ['x','y']));
// output -> {x: "bar", y: "baz"}

পাস বৈশিষ্ট্য যা stringifyঅ্যারে ফর্ম্যাটে কাজ করার জন্য দ্বিতীয় যুক্তি হিসাবে ফলাফল অবজেক্টে যুক্ত করা প্রয়োজন ।

JSON.stringify এর জন্য MDN ডক