JavaScript - Nested Functions As Closure
js code is as follows:
Code: uniqueNo=(function(){ var no=0; return function(){ return no++; } })() document.writeln(uniqueNo()); // 1st time call document.writeln(uniqueNo()); // 2nd time call document.writeln(uniqueNo()); // 3rd time call the result is 1 2 3 why after the 2nd call, the declaration 'var no=0' is useless -- seems 'no' is updated and stored each time it is called? many thanks Similar TutorialsHi all, I've got some simple code that I use to drag the corners of a DIV to resize it on the fly. One thing that bothers me is that there is a "global" variable just hanging outside and I would rather "encapsulate" it all into a block of code so that the variable persists, but is not visible outside of the code that uses it. So, here's the code: Code: /*** * support for mouse drag resize of mChat window * "global" save of mouse start position **/ var start = 0; /*** * do-nothing function to attach unused events to **/ function nullFunc () { return false; }; /*** * begin drag **/ function drag () { start = 0; document.onmouseup = up; document.onmousedown = nullFunc; document.onmousemove = move; return false; }; /*** * end drag **/ function up () { start = 0; document.onmouseup = nullFunc; document.onmousedown = nullFunc; document.onmousemove = nullFunc; return false; }; /*** * mouse move capture **/ function move (e) { var o = mouseXY(e); /* mouseXY not shown here */ if (start) { mChatSize(o.y - start); /* mChatSize not shown here */ } start = o.y; return false; }; You see the code captures the mouse Y coordinate and then subtracts "start" from it to generate a DELTA (which is what the mChatSize function needs). So, moving the mouse up generates "-1, -1, -1" maybe -2 if dragged fast and +1 +1 +1... if moved down.... you see? Now what I want to do is put all this code in a "box" so that "start" is global to the box, but invisible outside. I tried to do it and made no headway... I'm sure it's simple and I'm just missing it. Any help will be appreciated. Thanks! -- Roger Hi, I have written a number of functions designed to return frequency data on 1000 randomly chosen numbers using different math functions for the rounding. I would like to include all of these functions within the wrapper of another function so that only one call is needed to get returns from all of the 'inner' functions. However, while each of the functions works in isolation, the moment I wrap them in another function they stop working. The following code is one of the functions 'frequencyWrapperOne' that has been wrapped in the function 'testWrapper'. A call to testWrapper does nothing. Can anyone see what I'm doing wrong? Code: function testWrapper() { function frequencyWrapperOne() { var numberArrayOne = new Array(0,0,0); for (var i = 0; i < 1000; i = i + 1) { var chosenNumber = Math.floor(Math.random() * 3); if (chosenNumber == 0) { numberArrayOne[0] = numberArrayOne[0] + 1; } if (chosenNumber == 1) { numberArrayOne[1] = numberArrayOne[1] + 1; } if (chosenNumber == 2) { numberArrayOne[2] = numberArrayOne[2] + 1; } } return window.alert(numberArrayOne.join(',')); } } testWrapper(); Thanks. Hi, i was wondering if there was a way to call a nested javascript function directly, from outside of the function its nested in? for example, if i have the following functions: Code: <script type="text/javascript"> var test = function(){ var testInner = function(){ alert('testInner'); } } </script> can i then call the 'testInner' function directly from an onclick action something like this: Code: <a href="#" onclick="test.testInner()">TEST JS</a><br /><br /> That code is obviously not working for me, but is there something similar to what ive shown here that will work? Thanks in advanced This is a little hard to explain so I'm posting an example. Code: //NESTED FUNCTION I'M USING TO DEMONSTRATE MY QUESTION function foo(a) { this.x = 5; //USED TO SET THE VALUE OF X if( a == 0 ) return function(z) { return x = z; } //USED TO RETRIEVE THE VALUE OF X else if( a == 1 ) return function() { return x; } } //MAKES setX THE SETTER FUNCTION var setX = foo(0); //MAKES getX THE GETTER FUNCTION var getX = foo(1); print( "setX(25), not an instance: " + setX( 25 ) ); print( "getX(), not an instance: " + getX() ); print( "" ); //CREATES AN OBJECT INSTANCE USING FOO AS CONSTRUCTOR var q = new foo(); print( "value of x in object instance: " + q.x ); print( "" ); print( "setX(25), not an instance: " + setX( 25 ) ); print( "getX(), not an instance: " + getX() ); This code will output: Code: setX(25), not an instance: 25 getX(), not an instance: 25 value of x in object instance: 5 setX(25), not an instance: 25 getX(), not an instance: 25 Observations: It seems like this.x actually has two meanings. 1)x becomes a member of the "Function" object foo(). 2)x becomes a part of the constructor for prototype class foo. But why then does x revert back to the original value of 5 when I use foo as a constructor? Does javascript automatically save the original value on creation for a reason? What is going on behind the scenes to make this happen? Is this behavior part of an ontological model that makes sense? Similarly, if I change "this.x" to "var x" I can access the value of x but I can't change it. Not that that I should be able to, the syntax "var x" doesn't make x a member of foo anyway. But I'm still having trouble classifying the relationship "var x" has to the function. Anyways this is more of a tangent. My main question is above but if anyone has something to say about this, I'd be interested to hear it. It seems like all these behaviors have rules to them, but there is no conceptual model to think through that guide these behaviors. Or maybe I'm just ignorant. Enlighten me. Code: function foo(x) { var tmp = 3; function bar(y) { alert(x + y + (++tmp)); } bar(10); } foo(2) is the function a closure? if not? why? thank you is this function a closure in javascript? Code: function f1(){ var n=999; function f2(){ alert(n); // 999 } } is the function f2() a closure? if not? why? what's and use of a closure.could you depict it in your own words. thank you Hi, i'm looking to send a loop variable (i) to a function inside the loop, but I can't seem to get it to use the value I want, it keeps making it a reference of i and therefore the function is always called using the last value of i rather than the one it was set with. So if i have 5 Tabs then Tab 1, when clicked, should call DefaultTabClick(0) and so on rather than always using 4 for any of the tabs. Code: for (var i = 0; i < AccountSettings.Tabs.length; i++) { $tabs.append(CreateTabLink(AccountSettings.Tabs[i].Title, DefaultTabClick(i)));}); } function DefaultTabClick(i) { var i = i || AccountSettings.Tabs.length - 1; return function () { if (currentTab === i) {RenameTab(this);} else { SaveTabSettings(currentTab); //Save Current ClearDashboard(); //Clear Current LoadDashboardWithLayout(i); //Load Selected } } } This is pretty cool; here's an online service Google has provided to scrunch your Javascript code down as small as possible. http://closure-compiler.appspot.com/home Here's the intro page... http://code.google.com/closure/compiler/ I like it! When using anonymous wrappers (I guess they are called like that), what does "()" part do at the end of the stack? An example: Code: ( function() {} ) () //Here! What does it do and how can we use it? Ok here is what I have so far, my ending part of my Call Function I think is ok. for my main function. I think I misplaced the { and } I will show you all the codes I have for my main function this is what I have I think I did misplace something but I can not pin point where that one small things should be Code: unction showResults(race,name,party,votes) { // script element to display the results of a particular race var totalV = totalVotes(votes); document.write("<h2>" + race + "</h2>"); document.write("<table cellspacing='0'>"); document.write("<tr>"); document.write("<th>Candidate</th>"); document.write("<th class ='num'>Votes</th>"); document.write("<th class='num'>%</th>"); document.write("</tr>"); } for (var i=0; i < name.length; i++) { document.write("<tr>"); document.write("<td>" name[i] + "(" + party[i] + ")</td>"); document.write("td class='num'>" + votes[i] + "</td>"); var percent=calcPercent(votes[i], totalV) document.write("<td class='num'>(" + percent +"%)</td>"); createBar(party[i],percent) document.write("</tr>"); } document.write("</table>"); } </script> Just wondering if i misplaced any ; or { or } anywhere suggestions? Here is my call function Code: <script type="text/javascript"> showResults(race[0],name1,party1,votes1); showResults(race[1],name2,party2,votes2); showResults(race[2],name3,party3,votes3); showResults(race[3],name4,party4,votes4); showResults(race[4],name5,party5,votes5); </script> I been going over this, I can not seem to figure out what { i might be missing? Thanks Is there a way to activate a function from another function? It has to be in the script tag, it can't be in the HTML section. Can I use something similar to this following code? If not, can anyone give me some help? I have tried to do it various ways, and have looked it up a few times, but to no avail. Can I use something similar to this following code? If not, can anyone give me some help? if (condition) {activate functionname();} Any help I can get would be appreciated. Thanks a lot to anyone who can help. OK i'm trying to make an affiliate section for my page in javascript, I used double arrays and it's terribly coded. Please help. I'm new to this... Code: <html> <body> <script type="text/javascript"> var alley = new Array(); alley[0] = new Array( "http://stereo.b1.jcink.com/", "http://i49.tinypic.com/5klkb6.gif", "Stereo Wired" ); alley[1] = new Array ( "http://s1.zetaboards.com/N2010/", "http://sixpop.com/files/246/n2010.png", "N2010" ); alley[2] = new Array ( "http://theipodnation.net", "http://img15.imageshack.us/img15/1043/affiipod.png", "The Ipod Nation" ); for ( i = 3; i < alley.length; i++ ) { for ( m = 0; m < alley[i].length; m++ ) { document.write(" <a href='" + alley[i][m][0] + "'><img src='" + alley[i][m][1] + "' alt='" + alley[i][m][2] + "' /></a> ") } } </script> </body> </html> Hello. I was wondering if there is a way to call a second Javascript function from within the first. For example: <script>...call first function...</script> Inside first function: If (a==1) <script>...call second function...</script> else (a==2) <script>...call third function...</script> My thinking as to why I would need this is because I need to access two different Google Maps API codes. If that isn't possible, does anyone have any other suggestions? This may be a basic programing problem but I am writing a function to validate a form using a bunch of else-if statements and encounters a problem when I use nested if/else-if statements. It will not continue on to the next else-if, after it returns false. Code: // to check each entry on the form and alert user if entry is invalid. function checkform(){ var checkssn = /(\d{3})-(\d{2})-(\d{4})/; var checkphone = /(\d{3})-(\d{4})/; var checkname = /[a-zA-Z]+(\.|,|\s)*/; var checkzip = /(^967|^968)\d{2}(-\d{4})?$/; // check to see if user have selected an Election if (!document.f1.elections[0].checked && !document.f1.elections[1].checked && !document.f1.elections[2].checked && !document.f1.elections[3].checked) { window.alert("Please select an Election!") return false; // check to see if user entered a valid SSN } else if ( checkssn.test(document.f1.ssn.value) == false){ window.alert("[1]. Please enter a valid social security number in the format ddd-dd-ddd"); return false; // check to see if user entered a valid home telephone number or business telephone number }else if ( document.f1.home_phone.value == '' && document.f1.business_phone.value == '') { window.alert("[4]. Please enter a Home or Business telephone number!") return false; } else if ( document.f1.home_phone.value != ''){ if (checkphone.test(document.f1.home_phone.value) == false){ window.alert("[4]. Please enter a valid home phone number in the format ddd-ddd"); return false; } } else if ( document.f1.business_phone.value != ''){ if ( checkphone.test(document.f1.business_phone.value) == false){ window.alert("[4]. Please enter a valid business phone number in the format ddd-ddd"); return false; } // check to see if user entered a valid Name }else if ( checkname.test(document.f1.lastname.value) == false){ window.alert("[5]. Last Name can only consist of letters, periods(.), commas(,) and spaces"); return false; }else if ( checkname.test(document.f1.firstname.value) == false){ window.alert("[5]. First Name can only consist of letters, periods(.), commas(,) and spaces"); return false; The problem occurs when it validates the phone numbers. When a valid number is entered, it will not move to the next else-if statement to validate the name. It's been years since I program in Java/C, so I'm a bit rusty. Any help is appreciated. -Alex Hey Guys, I'm currently a seasoned programmer who is in a programming class at my school. We're currently learning advanced JavaScript, and we're on the topic of nested loops. After teaching us about for and while loops, my teacher gave us a little puzzle to solve. It's kind of difficult to explain, but I'll give you guys my current code and what it outputs. Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Word Reversal</title> <script type="text/javascript"> var ask = prompt("How many words do you want?",""); while (ask < "1") { alert("You have to have at least one word!"); var ask = prompt("How many words do you want?",""); } var num = parseInt(ask) + 1; var final = ""; for (var i=1; i < num; i++) { var word = prompt("What's word " + i + "?"); final = final + "Word " + i +": " + word + "<br/>"; } </script> </head> <body> <script type="text/javascript"> document.writeln(final); </script> </body> </html> The current output, when the user wants two words, and word 1 is one and word 2 is two, comes out to be: Code: Word 1: one Word 2: two Which is great, but the only problem is, this is what the output's supposed to be: Code: Word 2: two Word 1: one I'm stumped. I've had numerous programming challenges in my life which I've solved, but I'm not sure where to go next on this one. The script is supposed to use a nested loop, but what goes in what loop to reverse the order of the user's input? I asked my teacher for help, but he told me "Ask someone else." I asked another seasoned programmer in my class, who was just about as stumped as I was, so I went back to my teacher. "Well, ask another person" he replied. And can you believe this guy has a Master's Degree of Computer Science? So I'm asking you guys: the community. I hope someone will be able to help me. On top of that, I have to help and tutor two special education students in my class on this kind of stuff during class, and they can't get the project done until I get it done, as they learn from analyzing and copying my work (which my teacher told me to do). They get upset when they have nothing to code, and they end up goofing off the entire period, or using it as a study hall. I need to get them back on track, so we can move on to the next project. Please help me with this code - it would be greatly appreciated. Thank you! Hi I need help to finish this code with using nested if statements A price of a ticket to a passenger will be: First Class 500 Economy Class (with meal) 400 Economy Class (without meal) 200 How I can write a JavaScript code according to the following specifications: a. Read the class that the passenger wants to travel on. b. If the class is the first class, print the price of ticket. c. If the class is the economy class, ask the user if he/she wants a meal on the flight. Then print the price of the ticket according to the response of the passenger. The program should simply accept one possible strings the user enters; it is not required to work for all possible inputs such as First, first, FIRST or Yes , yes, YES. This is the code which I have been trying { var inputNum = prompt("Enter the class you want\n first class?\neconomy? :"); if (isNaN(inputNum)) { if (inputNum.match(/first class/)) { document.write("<h1><center>your Ticket is 500<\center><\h1>"); } else { prompt("<h1>if you want a meal on the flight press OK <\h1>"); document.write("<h1>your ticket is 400<h1>,"); } } I'm trying to reuse some code in a different context to do a different job. The code to be reused contains hundreds of lines similar to a = new b.c.d(e,f) with different value for e and f. I need to create a new user defined object with the structure b.c.d. I've made numerous attempts along the lines of: Code: function d (e, f) { this.e = e; this.f = f; } function c () { this.d = d (e, f); } function b () { this.c = c; } var a = new b.c.d("test", "message"); with various permuations of functional declarations. However I get error message "Object expected" or "b.c.d is null or not an object" at the final line of the example. It works with the test line var a = new d("test", "message") but not when I start to build up the expression. How should I define of b.c.d? Hello codingforums.com! Right, this is probably going but such a stupid newbie thread but here goes.. I've finally got myself into gear to start learning javascript. I've been watching video tutorials, learning from websites and simply learning by error. I understand the concept of for loops, but the whole nested thing doesn't seem to click for some reason. I thought i understood and managed to write a piece of code that constantly writes '*' across the screen. Could someone with some pretty damn good knowledge of javascript be able to walk me through step by step of my script to explain what actually is happening? It would help loads. here is the script, many thanks!! <script type="text/javascript"> var counter = 0; function writeStars(){ for(i=0;i<1;i++){ for(a=0;a<=counter;a++){ document.write("*"); } counter++ document.write("<br />"); } } setInterval("writeStars()", 200); </script> Hello, I have the following script, but I'd like to sort each nested array before it is written. How can I do this? I've tried putting Games.sort(); and Games[0].sort(); in different places, but it never seems to work. Code: var Games = new Array(); //PS3 Games[0] = new Array(); Games[0][0] = "ps3list"; Games[0][1] = "Uncharted: Among Thieves"; Games[0][2] = "Prince of Persia"; Games[0][3] = "Saboteur"; Games[0][4] = "Assassins Creed"; //Wii Games[1] = new Array(); Games[1][0] = "wiilist"; Games[1][1] = "Wii Play"; Games[1][2] = "Mario Party 8"; Games[1][3] = "Okami"; Games[1][4] = "Wii Sports"; function loadGames(){ for (i = 0; i < Games.length; i++) { var list = "<ul>"; for (j = 1; j < Games[i].length; j++) { list += "<li><input type = 'checkbox' class='checkbox' name = '" + Games[i][j] + "' />" + Games[i][j] + "</li>"; } list += "</ul>" document.getElementById(Games[i][0]).innerHTML = list; } } Okay, I have another problem. I really can't figure out why it's not working in IE. The only problem I can think of would be using nested loops. Here's the part of the code that isn't working. It's not generating an error, it's just not returning anything. I know you guys hate when I post entire code, so I trimmed it down as much as I can. It's referring to an already stated xml document with xmlDoc. And it's goal is to return a table of rows that meet certain criteria. If you can see any syntax errors that explorer would not like, that's really what I'm asking for. Thanks in advance, Julian Code: var entries = Array.prototype.slice.call(arguments, 1); var headers = 0; for (var i=0;i<xmlDoc.getElementsByTagName('entry').length;i++) { var x = headers; headers += xmlDoc.getElementsByTagName('header').length; var id = xmlDoc.getElementsByTagName('entry')[i].getAttribute("id"); if (entries.indexOf(id) >= 0) { content += '<tr>'; for (x;x<headers;x++) { content += '<td>' + xmlDoc.getElementsByTagName('item')[x].firstChild.nodeValue + '<\/td>'; } } content += '<\/tr>'; } return content; |