davej Posted June 16, 2014 Share Posted June 16, 2014 He's trying to use the most advanced stuff he's ever seen in his very first program. Link to comment Share on other sites More sharing options...
thescientist Posted June 16, 2014 Share Posted June 16, 2014 It's not even that this stuff is advanced per se, it's just not practical, or practically applied. Link to comment Share on other sites More sharing options...
L8V2L Posted June 16, 2014 Author Share Posted June 16, 2014 So the code will be ready to be invoke after the document have loaded Link to comment Share on other sites More sharing options...
thescientist Posted June 16, 2014 Share Posted June 16, 2014 So the code will be ready to be invoke after the document have loaded you're already doing that by assigning a callback to onload. just assign myFunction to window.onload Link to comment Share on other sites More sharing options...
L8V2L Posted June 17, 2014 Author Share Posted June 17, 2014 (edited) You can simply establish a namespace, and use it, or you can use a closure to establish a namespace and have private static variables and private functions. Why do you need private static variables and private functions? Tell me. Explain it. because myFunction is defined inside fin. Why do you have the function wrapped in another function? What is the point? If you had your developer tools and console open, you would see a function not defined error. He's trying to use the most advanced stuff he's ever seen in his very first program. It's not even that this stuff is advanced per se, it's just not practical, or practically applied. you're already doing that by assigning a callback to onload. just assign myFunction to window.onloadI belive I knowwhere my confusion lies:var varName;window.onload = function(){//which one is correct? Please example fully, for this is where my confusion lies.function funcName(){}varName = function(){};} Edited June 17, 2014 by L8V2L Link to comment Share on other sites More sharing options...
Hadien Posted June 17, 2014 Share Posted June 17, 2014 varName, which is basically the method i used in my earlier post was merely a way to show how you can use closures. funcName, won't work at all. unless it is either a helper function to something else inside the onload or the function is actually assigned while still inside the onload. but by itself it won't work You are failing to understand what is actually available before the page fully loads. Functions are available before onload runs (even before javascript actually executes any code). Javascript is available before the page even fully loads. but pretty much anything you get by using "document" and it's functions... that has to wait until after the page loads. "function" doesn't need to be inside the window.onload handler, but things like "document.getElementById()" do. both methods can work just fine, its just that you're doing one of them wrong. 1 Link to comment Share on other sites More sharing options...
davej Posted June 17, 2014 Share Posted June 17, 2014 B ) Closures implies providing implicit access of one scope while in another and that is most often accomplished by using "return". In any event you need to provide some sort of way to bridge the 2 scopes together. without using return you have to do something like in this jsfiddle, where I initialize the identifier for the function in the global space... but I wait to actually define it inside the onload. So while the function exists in the global scope, it was defined in another scope. thus it knows about and can access the "cnt" variable despite being a global function. This seems like a very simple and easy to understand approach, and you could very easily apply a namespace to it. 1 Link to comment Share on other sites More sharing options...
L8V2L Posted June 17, 2014 Author Share Posted June 17, 2014 varName, which is basically the method i used in my earlier post was merely a way to show how you can use closures.funcName, won't work at all. unless it is either a helper function to something else inside the onload or the function is actually assigned while still inside the onload. but by itself it won't workYou are failing to understand what is actually available before the page fully loads. Functions are available before onload runs (even before javascript actually executes any code). Javascript is available before the page even fully loads. but pretty much anything you get by using "document" and it's functions... that has to wait until after the page loads. "function" doesn't need to be inside the window.onload handler, but things like "document.getElementById()" do.both methods can work just fine, its just that you're doing one of them wrong.Yes, I remembering that you gotten the code that I ask to work, but I was confuse on why didn't it work the way I had it, but seen that as you said, having setting the variable out of the local scope... comprehending that is another story.This seems like a very simple and easy to understand approach, and you could very easily apply a namespace to it.comprehending that is another story...Thanks both of you for helping toward understanding it.Both of you get likes from me!!!! Link to comment Share on other sites More sharing options...
justsomeguy Posted June 17, 2014 Share Posted June 17, 2014 Both of those function declarations "work" fine, they just do different things. It's up to you as the programmer to know what you're doing and what you need to use. The difference between those definitions is scope, one of them gets defined in a local scope and one of them in the global scope. If you don't understand scope then further explanation on that won't help, you need to understand scoping. Scoping in Javascript is one of the most important concepts to understand. If you don't understand what a scope is then study it until you do. This is another example of where you need to be writing and testing code and using your browser's developer tools to help you figure out what is going on, reading alone is not sufficient. Link to comment Share on other sites More sharing options...
L8V2L Posted June 17, 2014 Author Share Posted June 17, 2014 Both of those function declarations "work" fine, they just do different things. It's up to you as the programmer to know what you're doing and what you need to use. The difference between those definitions is scope, one of them gets defined in a local scope and one of them in the global scope. If you don't understand scope then further explanation on that won't help, you need to understand scoping. Scoping in Javascript is one of the most important concepts to understand. If you don't understand what a scope is then study it until you do. This is another example of where you need to be writing and testing code and using your browser's developer tools to help you figure out what is going on, reading alone is not sufficient.JSG IS BACK!!! YEAH~!! so the one that is an expression with the variable defined out side the function is global, and the other one is local being defined completely in the function it self? What if I put the variable inside the function, would it be defined as a local scope and with that, not work as it does being defined as a global scope? Link to comment Share on other sites More sharing options...
justsomeguy Posted June 17, 2014 Share Posted June 17, 2014 so the one that is an expression with the variable defined out side the function is global, and the other one is local being defined completely in the function it self?Right. What if I put the variable inside the function, would it be defined as a local scope and with that, not work as it does being defined as a global scope?Test it out and see what happens. this refers to the current scope, so if you use console.log(this); inside the function then you can inspect the scope in the developer tools to see if it is defined inside that scope.JSG IS BACK!!!I've always been here, I just don't answer questions if I don't think you will understand the answer. Link to comment Share on other sites More sharing options...
L8V2L Posted June 17, 2014 Author Share Posted June 17, 2014 (edited) Right. Thanks.Test it out and see what happens. this refers to the current scope, so if you use console.log(this); inside the function then you can inspect the scope in the developer tools to see if it is defined inside that scope.I had a feeling you was going to say that:function foo(){function bar(){return(this)};return(bar());};console.log(foo());/*return the window object as assume(<-- feel as if this is the incorrect word to use. But I check it on my favorite dictionary site, and it is correct, I have trouble with pronunciation to; which is why I misspell a lot). Is this the correct test to perform?*/ I've always been here, I just don't answer questions if I don't think you will understand the answer.HUH! YOU COULD ALEAST TRY! You might be surprise. Edited June 17, 2014 by L8V2L Link to comment Share on other sites More sharing options...
justsomeguy Posted June 17, 2014 Share Posted June 17, 2014 Try this: function foo() { function bar() { console.log('bar scope:'); console.log(this); } bar(); this.baz = function() { console.log('baz scope:'); console.log(this); } var bar2 = function() { console.log('bar2 scope:'); console.log(this); } console.log('foo scope:'); console.log(this);}foo();baz();console.log('global scope:');console.log(this);The scope is the same for all of them, it is the window object, which is the default scope unless otherwise specified. But even so, they still have a local scope. Even though they run in the window scope, declaring a local variable does not declare it in the window scope. At the end of that it prints the global scope, the window object. Inspect that window object, scroll through the list of properties and methods and see if foo, bar, baz, or bar2 are defined there, and think about why.HUH! YOU COULD ALEAST TRY!You, the guy who refuses to take advice about how to learn to program, are telling me, the guy with a computer science degree, a 6-figure income, and a C-level job title, that I'm the one who needs to try? Can you see the irony? I will only try so much and see my advice ignored before I will stop trying. I'm not out to give you advice at any cost, I'll give you advice and you can either take it, or ignore it. If you ignore it, don't expect much future advice. Link to comment Share on other sites More sharing options...
L8V2L Posted June 18, 2014 Author Share Posted June 18, 2014 Try this: function foo() { function bar() { console.log('bar scope:'); console.log(this); } bar(); this.baz = function() { console.log('baz scope:'); console.log(this); } var bar2 = function() { console.log('bar2 scope:'); console.log(this); } console.log('foo scope:'); console.log(this);}foo();baz();console.log('global scope:');console.log(this);The scope is the same for all of them, it is the window object, which is the default scope unless otherwise specified. But even so, they still have a local scope. Even though they run in the window scope, declaring a local variable does not declare it in the window scope. At the end of that it prints the global scope, the window object. Inspect that window object, scroll through the list of properties and methods and see if foo, bar, baz, or bar2 are defined there, and think about why. Cause this is pointing to the window Object, so only the window's object's inheritance properties and methods will be shown... I don't truly know why, bit that what I think to be. NO wait! I see foo! I will keep what I have already written for documentation purpose like I always do. as stated in the w3s tutorials and many others, the window object is the top object, and in non-strict mode global function or variable will be long to the window object. I don't see bar2. I see baz and foo under function, but not the other two. Link to comment Share on other sites More sharing options...
justsomeguy Posted June 18, 2014 Share Posted June 18, 2014 I don't see bar2. I see baz and foo under function, but not the other two.So why is that? Look at how the different functions are defined. Link to comment Share on other sites More sharing options...
L8V2L Posted June 18, 2014 Author Share Posted June 18, 2014 (edited) So why is that? Look at how the different functions are defined.Cause bar2 , and bar are closure to the function foo, and cannot be accessed/reach. Unlike this.baz, keyword "this" connect it to the window object, or more so make a placeholder for the window object.The reason why bar return the window object is cause it take all value that the parent function/outer function have as his, but is still not a function of the window object, cause it is a closure/a inner function define within another function. Edited June 18, 2014 by L8V2L Link to comment Share on other sites More sharing options...
justsomeguy Posted June 18, 2014 Share Posted June 18, 2014 bar and bar2 are both defined in the local scope of foo, so they are not defined globally (in the window scope). foo was defined globally, so window.foo exists, and baz was explicitly defined globally (I could have also used window.baz to define it instead of this.baz). Since bar is defined locally inside foo, you cannot call bar outside of foo, it does not exist there. That is the same reason why the code you posted in posts 63 and 67 did not work correctly. When you use an attribute to set an event handler, like onchange, the code inside that attribute runs in the scope of the element object, so the things available in that scope are anything that is defined globally, plus the properties and methods of the element (using this). e.g.:<div id="some_div" onclick="alert('This code runs in the scope of the div element'); alert(this.id); window.alert('Global properties and methods of the window object are also available');"> 1 Link to comment Share on other sites More sharing options...
L8V2L Posted June 22, 2014 Author Share Posted June 22, 2014 In top-level JavaScript code (i.e., code not contained within any function definitions), the scope chain consists of a single object, the global object. In a non-nested function, the scope chain consists of two objects. The first is the object that defines the functions parameters and local variables, and the second is the global object. In a nested function, the scope chain has three or more objects. It is important to understand how this chain of objects is created. When a function is defined, it stores the scope chain then in effect. When that function is invoked, it creates a new object to store its local variables, and adds that new object to the stored scope chain to create a new, longer, chain that represents the scope for that function invocation. This becomes more interesting for nested functions because each time the outer function is called, the inner function is defined again. Since the scope chain differs on each invocation of the outer function, the inner function will be subtly different each time it is definedthe code of the inner function will be identical on each invocation of the outer function, but the scope chain associated with that code will be different.Translate into lamen, please. Link to comment Share on other sites More sharing options...
justsomeguy Posted June 23, 2014 Share Posted June 23, 2014 I don't know how to rephrase that any simpler. Link to comment Share on other sites More sharing options...
L8V2L Posted June 23, 2014 Author Share Posted June 23, 2014 I don't know how to rephrase that any simpler. p_p Link to comment Share on other sites More sharing options...
davej Posted June 23, 2014 Share Posted June 23, 2014 Layman's terms: alert(typeof varname=='undefined'?'varname out of scope':'varname in scope'); Link to comment Share on other sites More sharing options...
L8V2L Posted June 24, 2014 Author Share Posted June 24, 2014 var o = {x:1, y:2}; // Define a variable; initialize it to an objectIs this correct wording? Note: initialize it to an object Link to comment Share on other sites More sharing options...
davej Posted June 24, 2014 Share Posted June 24, 2014 Same as... var o = {}; // Declare an empty objecto.x = 1; // add x key-value pairo.y = 2; // add y key-value pair 1 Link to comment Share on other sites More sharing options...
L8V2L Posted June 24, 2014 Author Share Posted June 24, 2014 Same as... var o = {}; // Declare an empty objecto.x = 1; // add x key-value pairo.y = 2; // add y key-value pair Thanks for the key value pair. (Properties, key value pair, name/value)Why are they call key value pair?But that did not answer my question:var o = {x:1, y:2}; // Define a variable; initialize it to an objectIs this correct wording? Note: initialize it to an objectYes or no please, then answer this one:So this terminology is correct: var x is declare and asgin the numerical value one to it. Porperty x is initialize to the obj x and one is initialize to the porperty x.Please answer yes or no and any follow up comments afterward for clear explicit. Link to comment Share on other sites More sharing options...
davej Posted June 24, 2014 Share Posted June 24, 2014 But that did not answer my question:var o = {x:1, y:2}; // Define a variable; initialize it to an objectIs this correct wording? Note: initialize it to an object I would not word it that way myself, but it is not incorrect. I would say "Declare and initialize the object." var x; // declare x var y = 0; // declare and initialize y 1 Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now