একটি জাভাস্ক্রিপ্ট ES6 শ্রেণীর উদাহরণটি কীভাবে ক্লোন করবেন

Question 1

আমি কীভাবে ES6 ব্যবহার করে জাভাস্ক্রিপ্ট ক্লাসের উদাহরণ ক্লোন করব।

আমি jquery বা $ প্রসারিত উপর ভিত্তি করে সমাধানগুলিতে আগ্রহী নই।

আমি অবজেক্ট ক্লোনিংয়ের বেশ পুরাতন আলোচনা দেখেছি যা বোঝায় যে সমস্যাটি বেশ জটিল, তবে ES6 এর সাথে একটি খুব সহজ সমাধান নিজেই উপস্থাপন করেছে - আমি এটি নীচে রেখে দেব এবং লোকেরা মনে করে এটি সন্তোষজনক কিনা।

সম্পাদনা করুন: পরামর্শ দেওয়া হচ্ছে যে আমার প্রশ্নটি একটি সদৃশ; আমি উত্তরটি দেখেছি কিন্তু এটি 7 বছরের পুরানো এবং প্রি ES6 জেএস ব্যবহার করে খুব জটিল উত্তর জড়িত। আমি প্রস্তাব দিচ্ছি যে আমার প্রশ্নটি, যা ES6 এর জন্য মঞ্জুরি দেয়, এর একটি নাটকীয়ভাবে সহজ সমাধান রয়েছে।

Question 2

এটা জটিল; আমি অনেক চেষ্টা করেছিলাম! শেষ পর্যন্ত, এই ওয়ান-লাইনারটি আমার কাস্টম ES6 শ্রেণীর উদাহরণগুলির জন্য কাজ করেছে:

let clone = Object.assign(Object.create(Object.getPrototypeOf(orig)), orig)

এটি প্রোটোটাইপ সেট করা এড়ায় কারণ তারা বলে যে এটি কোডটি অনেকটা ধীর করে দেয়।

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

উপসংহার: এটি একটি গণ্ডগোল। আসুন আশা করি যে একদিন দেশীয় এবং পরিষ্কার ক্লোন কার্যকারিতা থাকবে।

Question 3

const clone = Object.assign( {}, instanceOfBlah );
Object.setPrototypeOf( clone, Blah.prototype );

অবজেক্ট.সেসাইন এর বৈশিষ্ট্যগুলি নোট করুন : এটি অগভীর অনুলিপি করে এবং শ্রেণি পদ্ধতিগুলি অনুলিপি করে না।

আপনি যদি একটি অনুলিপি বা অনুলিপিটির উপর আরও নিয়ন্ত্রণ চান তবে লড্যাশ ক্লোন ফাংশন রয়েছে ।

Question 4

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

জাভাস্ক্রিপ্টে অবজেক্টগুলি ক্লোন করার জন্য কোনও সহজ বা সোজা উপায় নেই। "অগভীর অনুলিপি" ব্যবহার করে এখানে প্রথম উদাহরণ দেওয়া হয়েছে:

1 -> অগভীর ক্লোন:

class Employee {
    constructor(first, last, street) {
        this.firstName = first;
        this.lastName = last;
        this.address = { street: street };
    }

    logFullName() {
        console.log(this.firstName + ' ' + this.lastName);
    }
}

let original = new Employee('Cassio', 'Seffrin', 'Street A, 23');
let clone =  Object.assign({},original); //object.assing() method
let cloneWithPrototype Object.create(Object.getPrototypeOf(original)), original) //  the clone will inherit the prototype methods of the original.
let clone2 = { ...original }; // the same of object assign but shorter sintax using "spread operator"
clone.firstName = 'John';
clone.address.street = 'Street B, 99'; //will not be cloned

ফলাফল:

আসল.লগ ফুলনাম ():

ফলাফল: ক্যাসিও সেফরিন

ক্লোন.লগ ফুলনাম ():

ফলাফল: জন সেফরিন

original.address.street;

ফলাফল: 'স্ট্রিট বি, 99' // লক্ষ্য করুন যে আসল সাব অবজেক্টটি পরিবর্তন করা হয়েছিল

বিজ্ঞপ্তি: উদাহরণটির নিজস্ব বৈশিষ্ট্য হিসাবে ক্লোজারগুলি থাকলে এই পদ্ধতিটি এটি মোড়বে না। ( ক্লোজারগুলি সম্পর্কে আরও পড়ুন ) এবং আরও, সাব অবজেক্ট "ঠিকানা" ক্লোন হবে না।

ক্লোন.লগ ফুলনাম ()

কাজ করবে না.

ক্লোনওয়েথপ্রোটোটাইপ.লগ ফুলনাম ()

কাজ করবে, কারণ ক্লোনটি এর প্রোটোটাইপগুলিও অনুলিপি করবে।

অবজেক্ট.সেসাইন দিয়ে অ্যারেগুলি ক্লোন করতে:

let cloneArr = array.map((a) => Object.assign({}, a));

ECMAScript স্প্রেড সিনট্যাক্স ব্যবহার করে ক্লোন অ্যারে:

let cloneArrSpread = array.map((a) => ({ ...a }));

2 -> গভীর ক্লোন:

সম্পূর্ণ নতুন অবজেক্ট রেফারেন্স সংরক্ষণাগার করতে আমরা JSON.stringify () ব্যবহার করতে পারি মূল স্ট্রিংটিকে পার্সিং হিসাবে এবং পার্স করার পরে এটি JSON.parse () এ ফিরে আসে।

let deepClone = JSON.parse(JSON.stringify(original));

গভীর ক্লোন দিয়ে ঠিকানার রেফারেন্স রাখা হবে। তবে ডিপক্লোন প্রোটোটাইপগুলি ছেড়ে দেওয়া হবে, সুতরাং ডিপক্লোন.লগ ফুলনাম () কাজ করবে না।

3 -> তৃতীয় পক্ষের গ্রন্থাগারগুলি:

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

অ্যান্ডস্কোর: যাক ক্লোনআউন্ডারস্কোর = _ (মূল) .ক্লোন ();

লোড্যাশ ক্লোন: var ক্লোনলোডাশ = _ক্লোনডিপ (আসল);

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

Question 5

অন্য একটি লাইনার:

বেশিরভাগ সময় ... (তারিখ, রেজেক্সট, মানচিত্র, স্ট্রিং, নম্বর, অ্যারের জন্য কাজ করে), বিটিডাব্লু, ক্লোনিং স্ট্রিং, সংখ্যাটি কিছুটা মজার।

let clone = new obj.constructor(...[obj].flat())

অনুলিপি নির্মাণকারী ছাড়াই class শ্রেণীর জন্য:

let clone = Object.assign(new obj.constructor(...[obj].flat()), obj)

Question 6

class A {
  constructor() {
    this.x = 1;
  }

  y() {
    return 1;
  }
}

const a = new A();

const output = Object.getOwnPropertyNames(Object.getPrototypeOf(a)).concat(Object.getOwnPropertyNames(a)).reduce((accumulator, currentValue, currentIndex, array) => {
  accumulator[currentValue] = a[currentValue];
  return accumulator;
}, {});

Question 7

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

let clone = { ...obj};

এবং আপনি যদি ক্লোন করা বস্তুটিতে কোনও কিছু পরিবর্তন করতে বা যোগ করতে চান:

let clone = { ...obj, change: "something" };