Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>Using window is usually redundant - let me demonstrate:</p> <pre><code>var foo = '123'; alert(foo); //123 alert(window.foo) //123 alert(window['foo']) //123 </code></pre> <p>It is evident which is more convenient. There is a circumstance in which the use of window makes sense, but that circumstance is almost always because of poor architecture. Using window allows us to access a variable global variable - funny wording :) This should clear it up:</p> <pre><code>var foo = '123'; var bar = 'abc'; var prop; if (blah) { //some condition here prop = 'foo'; } else { prop = 'bar'; } </code></pre> <p>Now...how can we use prop to get the value of a corresponding variable?</p> <pre><code>console.log(window[prop]); //123 or abc - bracket notation lets us use variable property names </code></pre> <p>This sort of thing is very common within objects, but not with window. The reason is that we should be avoiding global variables (properties of window) as much as possible. Therefore, any logic that needs a variable property name should be inside of an object, dealing with objects - NOT <code>window</code>. Now window can be out of the picture.</p> <p>It is usually bad practice to create functions inside of other functions. That would mean that each time you call function A, you recreate function B. Most of the time, people do that because they don't know better, not because they need to.</p> <p>It appears to me that you intended to give <code>steve</code> a property called <code>WayCoolTest</code>, both being functions. That can be done.</p> <pre><code>var steve = function() { console.log("I'm Steve!"); } steve.WayCoolTest = function() { console.log("I'm a Way Cool Test!"); } steve(); //I'm Steve! steve.WayCoolTest(); //I'm a Way Cool Test! </code></pre> <p>This works because functions are objects in javascript. Therefore, you can add properties to them.</p> <p>Let's step it up! <br> To emphasize good practices, I'm going to wrap this example in an object <code>testApp</code> (it acts like a namespace..we're using that instead of window).<br> I will create a property of <code>testApp</code> called <code>steve</code>, which will be a function. Rather than creating <code>steve</code> directly as a function, I will use an IIFE (immediately invoked function expression), which is a function that will <code>return</code> something to be set as <code>steve</code>.<br> Inside the IIFE, I will create the function for <code>steve</code> and also attach <code>WayCoolTest</code> to it, as demonstrated in the previous example, then that function is returned and assigned to <code>steve</code>.</p> <pre><code>var testApp = { steve : (function() { var steve = function() { //the name here doesn't matter, just being consistent, since this will be the value of the property `steve`. console.log("I'm Steve!"); } steve.WayCoolTest = function() { console.log("I'm a Way Cool Test!"); } return steve; }()); }; testApp.steve(); //I'm Steve; testApp.steve.WayCoolTest(); //I'm a Way Cool Test! </code></pre> <p>Now, let's consider another variation.</p> <pre><code>var testApp = { steve : (function() { var steve = function() { //the name here doesn't matter, just being consistent, since this will be the value of the property `steve`. console.log("I'm Steve!"); WayCoolTest(); //Steve can use this, but nothing else can! Encapsulation. } var WayCoolTest = function() { //THIS PART!! No longer a property of "steve" console.log("I'm a Way Cool Test!"); } return steve; }()); }; testApp.steve(); //I'm Steve! I'm a Way Cool Test testApp.steve.WayCoolTest(); //undefined, of course </code></pre> <p>That is very useful if for example <code>steve</code> is a complicated function and you want to break it up into some other small functions that only <code>steve</code> will know about.</p>
    singulars
    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. 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.
    3. 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