The development ECMAScript 2016 has already started. One of the coming new capabilities will allow us to bind a function to specific object in order to be notified of changes that take place in that object. This capability is already supported in Google Chrome!
This following code sample shows this capability in action. You can check it out by running this code sample in Google Chrome and check the console.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
function observer(changes) {
console.log("### inside observer ###");
changes.forEach(function(change){
console.log(change.type, change.name, change.oldValue);
}
);
}
var ob = new Object();
ob.id = 12321;
ob.name = "david";
ob.average = 87;
window.Object.observe(ob,observer,['delete','update']);
ob.average = 90;
ob.name = "david dahan";
Object.deliverChangeRecords(observer);
ob.average = 92;
ob.name = "david dahan junior";
ob.average = 90;
Object.deliverChangeRecords(observer);
ob.id = 123123123;
delete ob.name;
Object.deliverChangeRecords(observer);
Object.unobserve(ob,observer);
ob.average = 100;
Object.deliverChangeRecords(observer);
</script>
</body>
</html>
The following video clip overviews the execution of this code sample and explains it step by step. I strongly believe it will assist you with understanding this topic.
