Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>First a semantic note:</p> <p>The scope of a function is not related to <code>this</code> word. The <code>context</code> is related to <code>this</code>. The scope is related to the accessibility of variables and functions inside another function.</p> <p>When you try to read a variable outside the function where it's declared, then you trying to access to a var outside its scope. So you cannot do it because the var is inside a scope not accessible from current position.</p> <blockquote> <p>Now everything works (full fiddle here if you are interested), but have I done something terrible?</p> </blockquote> <p>If it works, it's not so terrible :-)</p> <blockquote> <p>Is there any reason this is used instead of passing in an explicit scope variable as a parameter (that would make things easier to understand as for me, this makes the workings kind of hidden).</p> </blockquote> <p>a fast read: <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this" rel="nofollow">https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this</a></p> <blockquote> <p>In javascript the value of <code>this</code> is determined by how a function is called.</p> </blockquote> <p>In one way this approach could save annoying passage of context as argument: in a well documented library, the <code>this</code> use is very intituitive. In other cases, I agree when you change continually context in your app without a rigorous logic, it could be confused.</p> <blockquote> <p>What is the intended use for this?</p> </blockquote> <p>We should always remember how and when the javascript is born. It was born for browser in order to interact with the DOM.</p> <p>For this purpose, the context has sense that change based of which element call the function.</p> <p>For example:</p> <pre><code>var divs = document.getElementsByTagName('DIV'); for(var i = 0; i &lt; divs.length; i++) { divs[i].addEventListener('click',_clickHandler); } function _clickHandler() { this.innerHTML = "clicked"; } </code></pre> <p>DEMO <a href="http://jsfiddle.net/AYBsL/1/" rel="nofollow">http://jsfiddle.net/AYBsL/1/</a></p> <p>This is an example to how is useful the implicit change of context in javascript.</p> <p>You could do this also for user-defined function: when you call a function you could change the context:</p> <pre><code>_clickHandler.call(divs[0]); // simulate click of first div </code></pre>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload