Js Mutation Observer

Whenever a DOM element changes, we can capture it using MutationObserver. Basically you can create a new MutationObserver(callback) instance and then invoke the observe(targetNode, config) function. On a recent project there was a shop plugin I was using in a cart page. Every time user updated quantity, the form element’s id was changing randomly and I did not know how to access its reference. In a situation like this, you can add a parent element to that <form> and observe that parent element for mutation changes....

November 19, 2021 · 2 min · Ahmet Gokdayi

this Keyword in JavaScript

We happen to guess that the this keyword’s usage is same to the ones in Java or C# or any other OOP language. But it’s not true. I’ve been following the book series You Don’t Know JS, and i gotta say using this is not that easy as it looks. What We Normally Assume We think that it refers to the function that it resides in. For example think about this C# code:...

March 26, 2017 · 3 min · Ahmet Gokdayi

Js, Using Timeout in For Loop

Let’s say you want to do write numbers from 0 to 10 in a for loop, but you want this to happen after a certain amount of time. Let’s do this the old way we know Using var keyword I guess that you’d come up with a solution like this: var counter = 10; for(var i = 0; i < counter; i++){ setTimeout(function timer(){ console.log(i); },1000); } The above code should write the numbers in 1 seconds break, but the ouput is not as we expected, it should write 10 ten times....

March 21, 2017 · 2 min · Ahmet Gokdayi

Js, Property Descriptors

Sometimes you may want your variable to act like a constant variable or something, well we can achieve such a behaviour by using writable property descriptor Object Dot defineProperty Let’s see it in action, first we need an object; var b = {}; Then, let’s add a property to this objec,we can use the built-in defineProperty() function of the Object to achieve this : Object.defineProperty(b, "a", { value: "b letter", writable: false, configurable: true, enumerable: true }); b....

3 min · Ahmet Gokdayi