{"id":4093,"date":"2024-09-19T05:30:57","date_gmt":"2024-09-19T05:30:57","guid":{"rendered":"https:\/\/ubiq.co\/tech-blog\/?p=4093"},"modified":"2025-07-21T04:48:47","modified_gmt":"2025-07-21T04:48:47","slug":"how-to-access-correct-this-inside-callback","status":"publish","type":"post","link":"https:\/\/ubiq.co\/tech-blog\/how-to-access-correct-this-inside-callback\/","title":{"rendered":"How to Access Correct This Inside Callback"},"content":{"rendered":"\n<p>JavaScript provides <em>this<\/em> keyword that is very useful for web developers. It allows you to easily access variables and objects without explicitly defining them. But its meaning changes according to where it is used. If not used properly, this keyword may refer to a wrong object and give undesirable results. On the other hand, if you use it correctly, then it can simplify your programming a lot. Often web developers need to be able to access correct this inside callback function. In this article, we will learn how to do this.<\/p>\n\n\n\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_82_2 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-access-correct-this-inside-callback\/#What_is_this_keyword\" >What is this keyword<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-access-correct-this-inside-callback\/#What_is_a_Callback_in_JavaScript\" >What is a Callback in JavaScript<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-access-correct-this-inside-callback\/#How_to_Access_Correct_This_Inside_Callback\" >How to Access Correct This Inside Callback<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-access-correct-this-inside-callback\/#1_Using_Arrow_Function\" >1. Using Arrow Function<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-access-correct-this-inside-callback\/#2_Using_Another_Variable\" >2. Using Another Variable<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-access-correct-this-inside-callback\/#3_Using_Bind_function\" >3. Using Bind() function<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-access-correct-this-inside-callback\/#Conclusion\" >Conclusion<\/a><\/li><\/ul><\/nav><\/div>\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"What_is_this_keyword\"><\/span>What is this keyword<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Before we proceed, it is essential to understand what <em>this<\/em> keyword is and how it works. In JavaScript, this is a reserved keyword used to refer to an object such as variable, function, etc. It is a read-only object and its value is set by the browser and cannot be changed by us. Its value changes according to where you use it. This too is done by web browser. For example, if you use it by itself or in a function, it refers to the global object such as window. If you use this in an object method, it refers to an object. If used in an event, it refers to the event receiver. Its scope is automatically determined by the web browser and can be changed using functions like call(), apply() and bind().<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"What_is_a_Callback_in_JavaScript\"><\/span>What is a Callback in JavaScript<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>We need to also understand how callback functions work to get this and callback to work together. <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Glossary\/Callback_function\" target=\"_blank\" rel=\"noreferrer noopener\">Callback<\/a> is simply a function that is passed as an argument to another function. It is generally called sometime or the other inside the outer function where it is passed as argument. The difference between the value of <em>this<\/em> object and any other variable is that the value of <em>this<\/em> depends on where it is called or run, whereas the value of variable depends on where it is defined. So, many developers assume that this will have the same value as it was in the callback where it was defined. But that is not always true. Let us learn this with an example.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">function outer(callback){<br>  inner(); <br>}<br><br>function inner(){<br>  console.log(this);<br>}<br><br>outer(callback);<\/pre>\n\n\n\n<p>Here is its output.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">Window {0: Window, window: Window, <br>        self: Window, document: document, <br>        name: '', location: Location, \u2026}<\/pre>\n\n\n\n<p>In the above example, we have defined callback function inner() that is called from inside function outer(). It prints the value of this global variable.<\/p>\n\n\n\n<p>On the other hand, if you call the <em>this<\/em> variable inside a JS object, it behaves differently.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">var obj={ <br>name: \"John\", <br>a: function(){ <br>\tconsole.log(this); <br>    } <br>} <br>obj.a();<\/pre>\n\n\n\n<p>Here is the output.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">{name: 'John', a: \u0192}<\/pre>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"How_to_Access_Correct_This_Inside_Callback\"><\/span>How to Access Correct This Inside Callback<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>There are several simple ways to access the correct this inside callback functions.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"1_Using_Arrow_Function\"><\/span>1. Using Arrow Function<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>JavaScript Arrow functions provide a shorter way to define functions and return values in JavaScript. Here is an example of how a regular JS function is written as arrow function.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">\/\/ Regular Function<br>data = function_name() {<br>  return \"Hello World!\";<br>}<br><br>\/\/Arrow Function<br>data = () =&gt; {<br>  return \"Hello World!\";<br>}<br><br>OR<br><br>data = () =&gt; \"Hello World!\";<\/pre>\n\n\n\n<p>It basically allows you to skip function name and return statement, since it always returns value by default. Let us say you have the following outer() function. Here we first set the value of this object&#8217;s data variable. Then we call inner object&#8217;s anonymous function as callback function. In this callback function, we display the value of this.data variable, assuming it to be what we assigned in the previous statement.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">function outer(data, inner) {<br>    this.data = data;<br>    inner.on('data', function () {<br>        console.log(this.data);<br>    });<br>}<br><br>\/\/ Mock inner object<br>let inner = {<br>    on: function(event, callback) {<br>        setTimeout(callback, 1000);<br>    }<br>};<br><br>\/\/ called as<br>let obj = new outer('foo', inner);<\/pre>\n\n\n\n<p>In the above example, the callback function in inner object refers to Window. When we run this code, we get <strong>undefined<\/strong> as the output. The this.data called in inner.on() is different from what we have assigned in the previous statement. So, instead of using anonymous function, we can use arrow function to solve the problem with binding <em>this<\/em> variable.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">function outer(data, inner) {<br>    this.data = data;<br>    <strong>inner.on('data', () =&gt; {<br>        console.log(this.data);<br>    });<\/strong><br>}<br><\/pre>\n\n\n\n<p>This is because arrow functions do not have implicit binding of <em>this<\/em> variable. Therefore, when we refer to <em>this.data<\/em> it is looked up in global scope just as any other regular variable, and its value becomes available.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"2_Using_Another_Variable\"><\/span>2. Using Another Variable<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Another approach is to just use another variable to store <em>this<\/em> variable before callback scope. In this case, the browser will create a copy of <em>this<\/em> variable and store it in your new variable, which is free from implicit binding. The implicit binding occurs only on variables with name <em>this.<\/em> It is important to remember that such a variable is also available inside the callback. Here is an example where we have copied the <em>this<\/em> variable to <em>that<\/em> variable.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">function outer(data, inner) {<br>    this.data = data;<br>    <strong>let that = this;<\/strong><br>    inner.on('data', function() {<br>        alert(<strong>that.data<\/strong>);<br>    });<br>}<\/pre>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"3_Using_Bind_function\"><\/span>3. Using Bind() function<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Lastly, you can use functions like bind(), call() and apply() to point this keyword to another object inside callback function. As mentioned earlier, we cannot change the value of this keyword. What happens is that every function has its own bind() function that returns a new function with its own this property which is bound to a specific object. This new returned function will be a mirror of the original function where you have complete control over this property that it points to. Here is an example to illustrate it.<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">function outer(data, inner) {<br>    this.data = data;<br>    let bound = (function() { <br>        alert(this.data);             <br>    }).<strong>bind(this)<\/strong>; \/\/ bind called with the 'this' value of the outer function<br>    inner.on('data', bound);<br>}<\/pre>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Conclusion\"><\/span>Conclusion<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>In this article, we have learnt several ways to access the correct this property inside callback functions in JavaScript. Callbacks and <em>this<\/em> property are both very tricky concepts in JavaScript and you need to carefully keep an eye on what <em>this<\/em> property is bound to, in order to get the right value. In case of confusion, just use console.log() to explicitly print the value of <em>this<\/em> property at different points of your code. This will tell you what <em>this<\/em> points to throughout your code. Thereafter, use any of the above methods for course correction, if <em>this<\/em> does not point to the expected value.<\/p>\n\n\n\n<p><a href=\"https:\/\/ubiq.co\/\">Ubiq<\/a>&nbsp;makes it easy to visualize data, and monitor them in real-time dashboards.&nbsp;<a href=\"https:\/\/ubiq.co\/accounts\/register\">Try Ubiq<\/a>&nbsp;for free.<\/p>\n\n\n\n<p>Also read:<\/p>\n\n\n\n<p><a href=\"https:\/\/ubiq.co\/tech-blog\/how-to-return-response-from-asynchronous-call\/\">How to Return Response from Asynchronous Call in JavaScript<\/a><br><a href=\"https:\/\/ubiq.co\/tech-blog\/how-slicing-in-python-works\/\">How Slicing in Python Works<\/a><br><a href=\"https:\/\/ubiq.co\/tech-blog\/how-to-ask-user-input-in-python-until-valid-response\/\">How to Ask User Input in Python Until Valid Response<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Web developers often need to access the right this variable inside JavaScript functions. Here is how to access the correct this inside callback.<\/p>\n","protected":false},"author":1,"featured_media":4571,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[295],"tags":[300,299],"class_list":["post-4093","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-javascript","tag-callback","tag-this"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.3 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>How to Access Correct This Inside Callback - Ubiq BI<\/title>\n<meta name=\"description\" content=\"Web developers often need to access the right this variable inside JavaScript functions. Here is how to access the correct this inside callback.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/ubiq.co\/tech-blog\/how-to-access-correct-this-inside-callback\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Access Correct This Inside Callback - Ubiq BI\" \/>\n<meta property=\"og:description\" content=\"Web developers often need to access the right this variable inside JavaScript functions. Here is how to access the correct this inside callback.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/ubiq.co\/tech-blog\/how-to-access-correct-this-inside-callback\/\" \/>\n<meta property=\"og:site_name\" content=\"Ubiq BI\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/ubiqbi\" \/>\n<meta property=\"article:published_time\" content=\"2024-09-19T05:30:57+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-07-21T04:48:47+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/ubiq.co\/tech-blog\/wp-content\/uploads\/2024\/09\/access-right-this-in-callback.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"301\" \/>\n\t<meta property=\"og:image:height\" content=\"200\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Sreeram Sreenivasan\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@UbiqBI\" \/>\n<meta name=\"twitter:site\" content=\"@UbiqBI\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Sreeram Sreenivasan\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-access-correct-this-inside-callback\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-access-correct-this-inside-callback\\\/\"},\"author\":{\"name\":\"Sreeram Sreenivasan\",\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/#\\\/schema\\\/person\\\/db98d49a766a3a111d8510935ab90abc\"},\"headline\":\"How to Access Correct This Inside Callback\",\"datePublished\":\"2024-09-19T05:30:57+00:00\",\"dateModified\":\"2025-07-21T04:48:47+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-access-correct-this-inside-callback\\\/\"},\"wordCount\":961,\"image\":{\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-access-correct-this-inside-callback\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/i0.wp.com\\\/ubiq.co\\\/tech-blog\\\/wp-content\\\/uploads\\\/2024\\\/09\\\/access-right-this-in-callback.jpg?fit=301%2C200&ssl=1\",\"keywords\":[\"callback\",\"this\"],\"articleSection\":[\"JavaScript\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-access-correct-this-inside-callback\\\/\",\"url\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-access-correct-this-inside-callback\\\/\",\"name\":\"How to Access Correct This Inside Callback - Ubiq BI\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-access-correct-this-inside-callback\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-access-correct-this-inside-callback\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/i0.wp.com\\\/ubiq.co\\\/tech-blog\\\/wp-content\\\/uploads\\\/2024\\\/09\\\/access-right-this-in-callback.jpg?fit=301%2C200&ssl=1\",\"datePublished\":\"2024-09-19T05:30:57+00:00\",\"dateModified\":\"2025-07-21T04:48:47+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/#\\\/schema\\\/person\\\/db98d49a766a3a111d8510935ab90abc\"},\"description\":\"Web developers often need to access the right this variable inside JavaScript functions. Here is how to access the correct this inside callback.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-access-correct-this-inside-callback\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-access-correct-this-inside-callback\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-access-correct-this-inside-callback\\\/#primaryimage\",\"url\":\"https:\\\/\\\/i0.wp.com\\\/ubiq.co\\\/tech-blog\\\/wp-content\\\/uploads\\\/2024\\\/09\\\/access-right-this-in-callback.jpg?fit=301%2C200&ssl=1\",\"contentUrl\":\"https:\\\/\\\/i0.wp.com\\\/ubiq.co\\\/tech-blog\\\/wp-content\\\/uploads\\\/2024\\\/09\\\/access-right-this-in-callback.jpg?fit=301%2C200&ssl=1\",\"width\":301,\"height\":200,\"caption\":\"access correct this inside callback\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/how-to-access-correct-this-inside-callback\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How to Access Correct This Inside Callback\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/#website\",\"url\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/\",\"name\":\"Ubiq BI\",\"description\":\"Build dashboards &amp; reports in minutes\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/#\\\/schema\\\/person\\\/db98d49a766a3a111d8510935ab90abc\",\"name\":\"Sreeram Sreenivasan\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/4b3127ed2d4bb8efb3fa0bbb52cf2efd4d0156c97fc05a503537c883e8279947?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/4b3127ed2d4bb8efb3fa0bbb52cf2efd4d0156c97fc05a503537c883e8279947?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/4b3127ed2d4bb8efb3fa0bbb52cf2efd4d0156c97fc05a503537c883e8279947?s=96&d=mm&r=g\",\"caption\":\"Sreeram Sreenivasan\"},\"description\":\"Sreeram Sreenivasan is the Founder of Ubiq. He has helped many Fortune 500 companies in the areas of BI &amp; software development.\",\"sameAs\":[\"https:\\\/\\\/www.linkedin.com\\\/in\\\/sreeram-sreenivasan\\\/\"],\"url\":\"https:\\\/\\\/ubiq.co\\\/tech-blog\\\/author\\\/wordpress\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to Access Correct This Inside Callback - Ubiq BI","description":"Web developers often need to access the right this variable inside JavaScript functions. Here is how to access the correct this inside callback.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/ubiq.co\/tech-blog\/how-to-access-correct-this-inside-callback\/","og_locale":"en_US","og_type":"article","og_title":"How to Access Correct This Inside Callback - Ubiq BI","og_description":"Web developers often need to access the right this variable inside JavaScript functions. Here is how to access the correct this inside callback.","og_url":"https:\/\/ubiq.co\/tech-blog\/how-to-access-correct-this-inside-callback\/","og_site_name":"Ubiq BI","article_publisher":"https:\/\/www.facebook.com\/ubiqbi","article_published_time":"2024-09-19T05:30:57+00:00","article_modified_time":"2025-07-21T04:48:47+00:00","og_image":[{"width":301,"height":200,"url":"https:\/\/ubiq.co\/tech-blog\/wp-content\/uploads\/2024\/09\/access-right-this-in-callback.jpg","type":"image\/jpeg"}],"author":"Sreeram Sreenivasan","twitter_card":"summary_large_image","twitter_creator":"@UbiqBI","twitter_site":"@UbiqBI","twitter_misc":{"Written by":"Sreeram Sreenivasan","Est. reading time":"5 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/ubiq.co\/tech-blog\/how-to-access-correct-this-inside-callback\/#article","isPartOf":{"@id":"https:\/\/ubiq.co\/tech-blog\/how-to-access-correct-this-inside-callback\/"},"author":{"name":"Sreeram Sreenivasan","@id":"https:\/\/ubiq.co\/tech-blog\/#\/schema\/person\/db98d49a766a3a111d8510935ab90abc"},"headline":"How to Access Correct This Inside Callback","datePublished":"2024-09-19T05:30:57+00:00","dateModified":"2025-07-21T04:48:47+00:00","mainEntityOfPage":{"@id":"https:\/\/ubiq.co\/tech-blog\/how-to-access-correct-this-inside-callback\/"},"wordCount":961,"image":{"@id":"https:\/\/ubiq.co\/tech-blog\/how-to-access-correct-this-inside-callback\/#primaryimage"},"thumbnailUrl":"https:\/\/i0.wp.com\/ubiq.co\/tech-blog\/wp-content\/uploads\/2024\/09\/access-right-this-in-callback.jpg?fit=301%2C200&ssl=1","keywords":["callback","this"],"articleSection":["JavaScript"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/ubiq.co\/tech-blog\/how-to-access-correct-this-inside-callback\/","url":"https:\/\/ubiq.co\/tech-blog\/how-to-access-correct-this-inside-callback\/","name":"How to Access Correct This Inside Callback - Ubiq BI","isPartOf":{"@id":"https:\/\/ubiq.co\/tech-blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/ubiq.co\/tech-blog\/how-to-access-correct-this-inside-callback\/#primaryimage"},"image":{"@id":"https:\/\/ubiq.co\/tech-blog\/how-to-access-correct-this-inside-callback\/#primaryimage"},"thumbnailUrl":"https:\/\/i0.wp.com\/ubiq.co\/tech-blog\/wp-content\/uploads\/2024\/09\/access-right-this-in-callback.jpg?fit=301%2C200&ssl=1","datePublished":"2024-09-19T05:30:57+00:00","dateModified":"2025-07-21T04:48:47+00:00","author":{"@id":"https:\/\/ubiq.co\/tech-blog\/#\/schema\/person\/db98d49a766a3a111d8510935ab90abc"},"description":"Web developers often need to access the right this variable inside JavaScript functions. Here is how to access the correct this inside callback.","breadcrumb":{"@id":"https:\/\/ubiq.co\/tech-blog\/how-to-access-correct-this-inside-callback\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/ubiq.co\/tech-blog\/how-to-access-correct-this-inside-callback\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/ubiq.co\/tech-blog\/how-to-access-correct-this-inside-callback\/#primaryimage","url":"https:\/\/i0.wp.com\/ubiq.co\/tech-blog\/wp-content\/uploads\/2024\/09\/access-right-this-in-callback.jpg?fit=301%2C200&ssl=1","contentUrl":"https:\/\/i0.wp.com\/ubiq.co\/tech-blog\/wp-content\/uploads\/2024\/09\/access-right-this-in-callback.jpg?fit=301%2C200&ssl=1","width":301,"height":200,"caption":"access correct this inside callback"},{"@type":"BreadcrumbList","@id":"https:\/\/ubiq.co\/tech-blog\/how-to-access-correct-this-inside-callback\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/ubiq.co\/tech-blog\/"},{"@type":"ListItem","position":2,"name":"How to Access Correct This Inside Callback"}]},{"@type":"WebSite","@id":"https:\/\/ubiq.co\/tech-blog\/#website","url":"https:\/\/ubiq.co\/tech-blog\/","name":"Ubiq BI","description":"Build dashboards &amp; reports in minutes","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/ubiq.co\/tech-blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/ubiq.co\/tech-blog\/#\/schema\/person\/db98d49a766a3a111d8510935ab90abc","name":"Sreeram Sreenivasan","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/4b3127ed2d4bb8efb3fa0bbb52cf2efd4d0156c97fc05a503537c883e8279947?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/4b3127ed2d4bb8efb3fa0bbb52cf2efd4d0156c97fc05a503537c883e8279947?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/4b3127ed2d4bb8efb3fa0bbb52cf2efd4d0156c97fc05a503537c883e8279947?s=96&d=mm&r=g","caption":"Sreeram Sreenivasan"},"description":"Sreeram Sreenivasan is the Founder of Ubiq. He has helped many Fortune 500 companies in the areas of BI &amp; software development.","sameAs":["https:\/\/www.linkedin.com\/in\/sreeram-sreenivasan\/"],"url":"https:\/\/ubiq.co\/tech-blog\/author\/wordpress\/"}]}},"jetpack_featured_media_url":"https:\/\/i0.wp.com\/ubiq.co\/tech-blog\/wp-content\/uploads\/2024\/09\/access-right-this-in-callback.jpg?fit=301%2C200&ssl=1","jetpack_shortlink":"https:\/\/wp.me\/pbGGTT-141","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/posts\/4093","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/comments?post=4093"}],"version-history":[{"count":27,"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/posts\/4093\/revisions"}],"predecessor-version":[{"id":8924,"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/posts\/4093\/revisions\/8924"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/media\/4571"}],"wp:attachment":[{"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/media?parent=4093"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/categories?post=4093"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ubiq.co\/tech-blog\/wp-json\/wp\/v2\/tags?post=4093"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}