ক্লোনিং (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\"}"