The "this" confusion in JS: function vs arrow

Balaji Chennupati — Fri, 14 Jun 2024 09:16:22 +0000

Hey there, Good to see you back again!, In this blog I would like to clear a common confusion for many js beginners, the "this" confusion while using it b/w arrow and normal functions.

Standard function's perspective of this keyword

"this" is a keyword in js which is normally used to refer the object that we are currently working with or in terms of methods "this" refers to the object in which the method is located at.

const obj={
  name:"bj",
  info:function(){
        console.log(this.name);
       }
}

The above is a simple object representation in js with a name attribute and an info method now when we call the obj.info() what do you think it console logs?

bj

Yep! it prints the name of obj. But if write the same code outside of the object in the global execution context then "this " references to window object which is the initial global object in browser by default and it may vary from run time to run time.

So by this I would like to very much say that the default global object for any standard function is global object, but if working with any object then it becomes the this reference.

Arrow functions perspective of this keyword

In terms of arrow functions things slightly change, Let's write the same object above but in terms of arrow function this time and see what it outputs.

const obj={
  name:"bj",
  info:()=>{
        console.log(this.name);
       }
}

Now what do you think happens when i do the method call obj.info() well you might think we just changed the syntax but working is same, Well I am sorry to say but you are wrong mate. The standard functions in js by default have their own scope whereas arrow functions highly depend on lexical scope (simply scope around it) since the global scope refers to window object and window object does not have a name property we get the value undefined as output.

undefined

So by the end of this blog, What I would like to share with you is try to use this keyword only in standard functions and constructors, try not to use this in ES6 star boys (arrow functions 😉) and try to understand how they work.

That's it for this blog, Catch you in the next one till then Adios.

My experience with Arc for Windows

Balaji Chennupati — Sun, 02 Jun 2024 16:44:03 +0000

So I have recently used the latest release of arc for windows and I should say, This is a new experience in perspective of a browser user. Well in this post I would like to share my experience with arc and how it made my project development a lot productive.

Bugs noticed

The first bug I noticed was the problem in resizing the address bar. I have mailed issue to the browser company and they have taken care of it in the next 2 updates.

The next one I found out was the lack of sink b/w the profiles. Even after deleting a profile it still exists in your user settings which is kind of junky. Mailed it too still not updated..!

Now since this is just the initial release phase of the browser there might be a lot of issues being faced by the company and given it's size they are handling those pretty good. We can hope to have a better product with fewer bugs in the upcoming days.

Pros

Now coming to the pros, First of all the ui is awesome this is for people who like classic themes and don't like all the funky stuff.
Coming to features there aren't a bagload available but there are a lot of product features available like folder management, pinned sites and most unique thing spaces.
Even though we have had bookmark folders before I feel this browser took it to the next level by actually motivating us to use those bookmarks rather just bookmarking and forgetting them.
There are a lot of great stuff, in this browser but above are the stuff I felt useful for me.