কম্পিউটার টিউটোরিয়াল

জাভাস্ক্রিপ্টে স্প্রেড অপারেটর (spread operator) ব্যবহার করে অবজেক্ট ক্লোন (clone) করা


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

উদাহরণ

নিচের উদাহরণে, অ্যাসাইনমেন্ট অপারেটর ব্যবহার করে ক্লোনিং করা হয়েছে। তাই একটি ভেরিয়েবলে পরিবর্তন আনলে সেটি অন্যটিতে প্রতিফলিত হয়েছে।

<html> <body> <script> 
    var org = {org1 : "Serveneedy", org2 : "Praveenlatha", org3 : "Redcross" }; 
    document.write(JSON.stringify("without change org :" + " " + JSON.stringify(org))); 
    var neworg = org; 
    org.org1 = "gatesfoundation"; 
    document.write("</br>"); 
    document.write(JSON.stringify("with change org :" + " " + JSON.stringify(org))); 
    document.write("</br>"); 
    document.write(JSON.stringify("change also reflected in neworg :" + " " + JSON.stringify(neworg))); 
</script> </body> </html>

আউটপুট

"without change org : {\"org1\":\"Serveneedy\",\"org2\":\"Praveenlatha\",\"org3\":\"Redcross\"}" "with change org : {\"org1\":\"gatesfoundation\",\"org2\":\"Praveenlatha\",\"org3\":\"Redcross\"}" "change also reflected in neworg :{\"org1\":\"gatesfoundation\",\"org2\":\"Praveenlatha\",\"org3\":\"Redcross\"}"


উদাহরণ

নিচের উদাহরণে স্প্রেড অপারেটর ব্যবহার করা হয়েছে তাই মূল অবজেক্ট (original object)-এ পরিবর্তন আনলে সেটি ক্লোনড অবজেক্ট (cloned object)-এ প্রতিফলিত হয় না।

<html> <body> <script> 
    var org = {org1 : "Serveneedy", org2 : "Praveenlatha", org3 : "Redcross" }; 
    document.write(JSON.stringify("without change org :" + " " + JSON.stringify(org))); 
    var neworg = {...org}; 
    org.org1 = "gatesfoundation"; 
    document.write("</br>"); 
    document.write(JSON.stringify("with change org :" + " " + JSON.stringify(org))); 
    document.write("</br>"); 
    document.write(JSON.stringify("change also reflected in neworg" + " " + JSON.stringify(neworg))); 
</script> </body> </html>

আউটপুট

"without change org : {\"org1\":\"Serveneedy\",\"org2\":\"Praveenlatha\",\"org3\":\"Redcross\"}" "with change org : {\"org1\":\"gatesfoundation\",\"org2\":\"Praveenlatha\",\"org3\":\"Redcross\"}" "change also reflected in neworg : {\"org1\":\"Serveneedy\",\"org2\":\"Praveenlatha\",\"org3\":\"Redcross\"}"

  1. জাভাস্ক্রিপ্ট স্প্রেড অপারেটর

  2. জাভাস্ক্রিপ্ট দিয়ে URL অবজেক্ট তৈরি করা

  3. জাভাস্ক্রিপ্টে filter() ব্যবহার করে অবজেক্ট সরানো

  4. জাভাস্ক্রিপ্টে স্প্রেড অপারেটরের ফলাফল দেখাতে JSON.stringify() ব্যবহার করা