tag: Learn

What if you want to allow changing props of an object, but do not want anyone to add new props? Well, that is what Object.seal is for. Objects in Javascript cannot be made immutable by using a const keyword. const works on primitives. It can also make sure you don’t reassign value to an object. const fruit = "apple"; fruit = "orange"; // TypeError: Assignment to constant variable. const fruit = { name: "apple" }; fruit = { name: "orange" }; //TypeError: Assignment to constant variable. But, const cannot prevent value in object from being changed. ...

What if you want to play around with data, but also maintain metadata at the same time? In Javascript you don’t have to create other objects or work hard for that Nirvana that someone in the office was talking about. You just have to go ahead and store the darn metadata along with the object, and everyone is happy. Consider this array - const nums = [1, 3, 5, 7]; Let’s say you have to store a message along with the array. You might have seen distinct variables being assigned to serve such a need. ...

It is easy to take NaN for granted. But remember - the ’not a number’ notation is the only powerful object that does not equal itself. First the essentials - you use NaN whenever you do not have variable values in control but want to do a numerical operation on it. Rather than the numerical operation throwing you under the bus, you play safe by checking whether the numbers can be used in a valid way. ...

You can make mere variables and even an object immutable. But, how about a humble object prop? Making object props constant and immutable has practical usage. For e.g. consider this totally practical program to print out fruits and whether they are poisonous. const eatable = { poisonous: false, printFruit: function(fruit) { return "name: " + fruit + " | poison: " + this.poisonous; } }; console.log(eatable.printFruit("mango")); // name: mango | poison: false If someone decides to play spoil-sport and update poisonous to true, it may result in whole populations being wiped out. ...

You have used null. You have used undefined. But, have you ever thought about what they mean to the world and to Javascript? The fact is quite simple - we can’t do a null equality check. console.log(1 == null); // false console.log(0 == null); // false console.log(false == null); // false console.log("" == null); // false The same holds for undefined. console.log(1 == undefined); // false console.log(false == undefined); // false But, they measure up to themselves and to each other. console.log(null == null); // true console.log(null == undefined); // true console.log(null === null); // true console.log(null === undefined); // false Practical usage of null and undefined, therefore, follow this pattern - ...

You can use bind to bind variables of a function, and execute the said function later to get the desired result. You have seen how how closures can be used in Javascript and a bit about currying functions. Here’s one more way of doing that. We can bind available variables for a function and execute function at a later time. Consider the below closure - function getProduct(x) { return function(y) { return y * x; }; } const twice = getProduct(2); console.log(twice(3)); // 6 We may not want to create another variable doing the same thing for us - do we? Instead we bind one of the values, and do the final execution when the next variable is available. ...

You can easily chain methods along with variables to find a highly readable, and totally sensible scope chain. We have seen how closures can be used in Javascript before. Let us see some more practical usage scenarios. Consider the below closure - function getProduct(x) { return function(y) { return y * x; }; } const twice = getProduct(2); console.log(twice(3)); // 6 What do you think will happen if we put more inner functions? function getProduct(x) { return function(y) { return function(z) { return function(a) { return function(b) { return x * y * z * a * b; }; }; }; }; } const prod = getProduct(2)(3)(4)(5)(6); console.log(prod); // 720 With each iteration, we remember the variable and proceed to the next. We therefore end up multiplying all products from left to the right. We could have done it separately as we did before, or neatly chain it like depicted in the above code.

Functions are objects in Javascript. So, we could use functions as objects within other functions. So, the below is valid - function getProductPlus(x, y) { function factoredResult() { const factor = 2; //console.log("factored : ", x * y * factor); return x * y * factor; } return factoredResult; } let prod = getProductPlus(3, 5); console.log("prod ", prod()); // 30 We call point a variable prod to getProductPlus, and pass arguments. Then we execute prod(). In other languages this likely implies that the outer function has been executed and has already lost its variables. ...

We have come to love and respect the fact that (almost) everything is an object in Javascript and we can use all kinds of variables without giving a damn about their types. But, we also can understand that Javascript is trying to work its magic when we throw all caution to the wind. This may have adverse effects. Consider using Booleans as an example. const truthy = true; const falsy = false; console.log(!!truthy); // true console.log(!!falsy); // false The !! just gives the right boolean value - it is equivalent to the variable being used in an if condition. ...

An object’s key can be anything - even a reserved keyword. And, this may cause unexpected problems in some script engines. Consider - const operations = { add: "add something", delete: "remove something", prototype: "do something" }; operations is valid. And, you can go ahead and use the props in any way you wish. We are using node to execute the script. console.log(operations.add); // add something console.log(operations.delete); console.log(operations.prototype); // do something Turns out, nothing really happens even if you try to confuse the engine. ...