MVC বা MDV ব্যবহার করে প্রচুর জাভাস্ক্রিপ্ট ফ্রেমওয়ার্ককে এমন বস্তুর পরিবর্তনের জন্য প্রতিক্রিয়া জানাতে হবে যা একটি ওয়েব অ্যাপ্লিকেশনের ভিতরে স্টেটকে মডেল করে। এই ক্ষমতা একটি ডেটা-বাইন্ডিং মডেলের একটি মৌলিক অংশ।
জাভাস্ক্রিপ্ট অবজেক্ট এবং DOM বৈশিষ্ট্যগুলি নিরীক্ষণ করার বিভিন্ন উপায় রয়েছে যা কিছু ধরণের অ্যাকশন ট্রিগার করতে পারে, তবে বেশিরভাগ কৌশলগুলি পারফরম্যান্স ইত্যাদির মতো বিভিন্ন কারণে আদর্শ নয়।
ওয়েব অ্যাপ্লিকেশনের কর্মক্ষমতা উন্নত করার জন্য, TC39-এর কাছে Object.observe() নামে একটি নতুন পদ্ধতি প্রস্তাব করা হয়েছে - ECMAScript (জাভাস্ক্রিপ্ট) এর উন্নয়নের তত্ত্বাবধানকারী মানক সংস্থা।
Object.observe() আপনাকে যেকোন জাভাস্ক্রিপ্ট অবজেক্টে একজন শ্রোতা যোগ করতে দেয় যেটিকে কল করা হয় যখনই সেই বস্তু বা এর বৈশিষ্ট্যগুলি পরিবর্তন হয়।
আপনি এখন Chrome Canary সংস্করণ 25-এ এটি ব্যবহার করে দেখতে পারেন।
এই বৈশিষ্ট্যটি নিয়ে পরীক্ষা করার জন্য, আপনাকে Chrome Canary-এ Enable Experimental JavaScript পতাকা সক্ষম করতে হবে এবং ব্রাউজারটি পুনরায় চালু করতে হবে। পতাকাটি 'about:flags'-এর নীচে পাওয়া যাবে যেমনটি নীচের ছবিতে দেখানো হয়েছে:
এখানে একটি বস্তুর উপর একটি পর্যবেক্ষক সেট আপ করার একটি সহজ উদাহরণ:
var beingWatched = {};
// Define callback function to get notified on changes
function somethingChanged(changes) {
// do something
}
Object.observe(beingWatched, somethingChanged);
যখন অবজেক্ট 'beingWatched' পরিবর্তন করা হয়, এটি কলব্যাক ফাংশন 'somethingChanged' ট্রিগার করবে যা অবজেক্টে প্রয়োগ করা পরিবর্তনের একটি অ্যারে পায়।
সুতরাং জাভাস্ক্রিপ্ট ইঞ্জিন অনেকগুলি পরিবর্তন বাফার করতে এবং কলব্যাক ফাংশনে একক কলে সেগুলি পাস করতে বিনামূল্যে। এটি কলব্যাকগুলিকে অপ্টিমাইজ করতে সাহায্য করে যাতে আপনার কোড প্রচুর জাভাস্ক্রিপ্ট ম্যানিপুলেশন করতে পারে তবে আপডেটগুলি একসাথে ব্যাচ করে শুধুমাত্র কয়েকটি কলব্যাক প্রক্রিয়া করে৷
কলব্যাক ফাংশনটি ট্রিগার করা হবে যখনই একটি প্রপার্টি যোগ করা, পরিবর্তন করা, মুছে ফেলা বা পুনরায় কনফিগার করা হবে।
অ্যারেগুলি পর্যবেক্ষণ করার সময় আরেকটি সত্যিই চমৎকার জিনিস হল যে যদি একটি অ্যারেতে অনেকগুলি পরিবর্তন করা হয়ে থাকে তবে আপনি একটি ন্যূনতম পরিবর্তন সেট তৈরি করতে একটি পরিবর্তন সারাংশ সহায়ক লাইব্রেরি ব্যবহার করতে পারেন, যাতে ক্লায়েন্ট সাইড জাভাস্ক্রিপ্টকে ম্যানুয়ালি স্ক্যান করতে না হয়। প্রতিটি আইটেম পরীক্ষা করার জন্য অ্যারে।
আপনি আপনার 'somethingChanged' কলব্যাক ফাংশনে নিম্নলিখিত মত কিছু করার মাধ্যমে বেশ সহজে প্রতিটি পরিবর্তনের মাধ্যমে পুনরাবৃত্তি করতে পারেন:
function whatHappened(change) {
console.log(change.name + " was " + change.type + " and is now " + change.object[change.name]);
}
function somethingChanged(changes) {
changes.forEach(whatHappened);
}
টাইপ সম্পত্তি বস্তুর কি ঘটেছে সনাক্ত করে। প্রপার্টি সেট করা এবং সংশ্লিষ্ট প্রকারের কিছু উদাহরণ নিচের কোডে দেখা যাবে।
beingWatched.a = "foo"; // new
beingWatched.a = "bar"; // updated
beingWatched.a = "bar"; // no change
beingWatched.b = "amazing"; // new
এই কৌশলটি সম্পর্কে দুর্দান্ত জিনিস হল যে সমস্ত মনিটরিং স্মার্টগুলি জাভাস্ক্রিপ্ট ইঞ্জিনের ভিতরে রয়েছে যা ব্রাউজারটিকে এটিকে ভালভাবে অপ্টিমাইজ করতে এবং এই বৈশিষ্ট্যটির সুবিধা গ্রহণ করে কার্যকারিতা বাস্তবায়নের জন্য আপনার জাভাস্ক্রিপ্টকে মুক্ত করতে দেয়৷
ডেভেলপমেন্টের জন্য আরেকটি সত্যিই দুর্দান্ত বৈশিষ্ট্য হল যখনই কোনো বস্তুর পরিবর্তন হয় তখনই ডিবাগারকে ট্রিগার করতে Object.observe() ব্যবহার করার ক্ষমতা। এটি করার জন্য আপনি নীচের উদাহরণের মত কিছু কোড ব্যবহার করবেন।
Object.observe(beingWatched, function(){ debugger; });
এখানে Object.observe() সম্পর্কে একটি দুর্দান্ত ভিডিও ভূমিকা যা এটিকে বিশদভাবে ব্যাখ্যা করে।
এখানে একটি চমৎকার বর্ণনামূলক লেখা এবং একটি কার্যকর উদাহরণ উপলব্ধ রয়েছে।
TC39 স্ট্যান্ডার্ড বডি এই বৈশিষ্ট্যটি সম্পর্কে প্রতিক্রিয়া চাইছে, তাই এগিয়ে যান এবং এটি চেষ্টা করে দেখুন এবং আপনি কী ভাবছেন তা আমাদের জানান৷