Posts

Equals (==), not equals (!=), greater than (>), lesser than (<) - Javascript comparison operators cannot get more simple. Let’s dissect these operators a bit. Comparison operators are the ones that you use to.. well, compare. For example: let numCoffee = 3; if (numCoffee < 2) console.log("too few"); else if (numCoffee == 2) console.log("just right"); else console.log("crazy"); // output: crazy The expression within brackets is evaluated to true or false based on operator precedence. A succinct representation of the above totally real-world problem will be - ...

Know how you can use a Javascript object and its props. Javascript objects have properties or props. As you would have seen in the post about objects and primitives, object operations are quite easy. Though objects can mean more than a few things in Javascript, we will limit discussion of an object to the ** real real ** object. ..i.e., let obj = { i: 1 }; You should know a few things about this object to make your life much easier. ...

Get to know all the practical knowledge about Javascript primitives and objects. In JavaScript, objects are king. If you understand objects, you understand JavaScript. W3 Schools Everything except primitives is an object in Javascript. A couple of days back, we were talking about Javascript having the following primitives: bool, number, string, undefined and null. Primitives are quite easily defined and accessed - var name = "Mr. Anderson"; var x = 1; var universe = null; Objects on the other hand.. can also be easily defined and accessed. ...

Don’t know how to type? Get a typewriter. I always wanted to say that. But, if indeed you don’t know types - you can always head over to Javascript types to know more**. So, you know there are types. And, you also know that there can be many a problem in the lousy world of loose typing. (I just felt like the next S waxing such eloquence). The only choice to make here is to know more about how to convert from one type to other, and remain type-safe. And, that will quickly become second nature to your programming style. ...

This one thing I never said ever - “once you type, you cannot un-type”. Yep, I make up words and compete on how to level up in my eating my own words. Even if I allegedly uttered those words (which are totally unoriginal anyway), I happily don’t abide by them. I continue to use Javascript without types with all fervour (and have had a stint with typeless / loosely-typed scripting languages). ...

In a previous post, we saw the power of bindings in Vue. v-model is a powerful way to bind variables and UI rendering in Vue. Let us look at a bit more of v-model in this post. Remind me what is v-model about? In its simplest form.. <input type="text" v-model="myName" label="Your name:"> .. and it doesn’t quite get more complicated than that on its own. When you change ‘myName’ manually, through another component, or from the back-end, the variable value changes for sure but will also trigger off a change to UI. The user will see near instantaneous change to a specific UI element without any page refresh. ...

The power of Vue is in making reactive components child’s play. Well, that is true if the child in question is a 8-year old nephew who knows the basics of Javascript - you know what I mean. Consider an example that I have used before - <template> <div class="hello"> <h1>{{ msg }}</h1> <p> <button @click="sayHello">Hello</button> <span v-if="showHello">&nbsp;World!</span> </p> <p> <input type="text" v-model="myName" label="Your name:" /> </p> <p v-if="myName">Hello to you too.. {{ myName }}</p> </div> </template> <script> export default { name: "HelloWorld", data() { return { myName: null, showHello: false, }; }, methods: { sayHello() { console.log("hello world"); this.showHello = !this.showHello; }, }, props: { msg: String, }, }; </script> <!-- Add "scoped" attribute to limit CSS to this component only --> <style scoped> h3 { margin: 40px 0 0; } a { color: #42b983; } </style> ‘HelloWorld’ is a typical Vue component. ...

Imagine you are in need of a complex if/then routine. No, not the below.. const smart = true; if (smart) console.log("I am smart"); else console.log("I am not so smart"); .. but more of.. function sum(a, b) { let smartMessage; if (a + b <= 0) smartMessage = "Negative numbers are not known and cannot be computed."; else if (a + b < 10) smartMessage = "Less than 10? X, Really?"; else if (a + b < 50) smartMessage = "You could have just returned L"; else if (a + b < 100) smartMessage = "You are nearing the big C"; else if (a + b < 500) smartMessage = "You are nearing the bigger D"; else smartMessage = "It is all about M from here on"; return smartMessage; } console.log(sum(200, 2)); The above program works, and shows its smartness through the message. But there obviously should be a better way than to write a thousand if’s and but’s. ...

Oh.. why? Why should we work on theoritical algo problems when we could develop the next Instagram or Salesforce.com? Because, son - you have to learn the different paths to glory. Why take the longer path when it can be shorter? That aside: let us look at multiple ways of reversing a string in Javascript. The best and easiest way Convert to array and back. const txt = "abcxyz"; console.log(txt.split("").reverse().join("")); Prove that I know ‘modern’ functions Aka - use reducer to reverse. ...

Yes. Now, go back to work.. may be? What the heck is this? I am sure you used something called if/else? const sum = a + b; let result; if (sum > 100) result = "too high"; else result = "just right"; Instead of the “elaborate” syntax, we can just shorthand it. const result = a + b > 100 ? "too high" : "just right"; So, should you use it? Emm.. it depends. ...