JavaScript - Understanding Parenthesis When Calling Functions And Methods
I still can't understand very well when to use and when NOT to use parenthesis when calling/using methods and functions.
Case 1: Where I commented "// No parenthesis.", could someone explain why not. And at the end, where the commen reads "// Parenthesis. ? Code: /* This function will be used as a method inside the objects. */ function getPayment() { thePayment = 250; thePayment += (this.seats == 'leather') ? 100 : 50; thePayment += (this.engine == 'V-8') ? 150 : 75; thePayment += (this.radio == 'CD Player') ? 30 : 10; return thePayment; } /* Object Constructor (prototype of the object). */ function car(seats, engine, radio) { this.seats = seats; this.engine = engine; this.radio = radio; this.payments = getPayment; // No parenthesis. } /* Creates an instance called 'my_car' out of the 'car' object. */ var my_car = new car('cloth', 'V-6', 'Tape Deck'); /* Object Initializer - automatically instantiates the object. */ var carObj = { seats: 'leather', engine: 'V-8', radio: 'CD Player', payments: getPayment // No parenthesis. No comma after last item. } // Firebug... console.log(my_car.payments()); // Parenthesis. console.log(carObj.payments()); // Parenthesis. /* vim:set foldmethod=indent: */ Case 2: Please look at the comments. Code: window.onload = initAll; // Why no () here? function initAll() { window.doStuff(); // Why () here? } function doStuff() { var msg_text = 'I love you so much!'; var msg_link = window.document.getElementById('msg_link'); console.log(msg_link); var msg_box = window.document.getElementById('msg_box'); msg_link.onmouseover = function() { //msg_box.value = msg_text; msg_box.setAttribute('value', 'May the force be with you!'); }; msg_link.onmouseout = function() { /* This works in ie. */ //msg_box.value = ''; /* Doesn't work in ie7 (and probably not in ie6 either). * Perhaps the code above is reasonable. */ msg_box.removeAttribute('value'); } } /* vim:set foldmethod=indent: */ Similar TutorialsThis is in reference to Crockford's articles found he http://javascript.crockford.com/prototypal.html http://javascript.crockford.com/private.html I'm attempting to understand the use of privileged methods when used with Object.create. I put together a quick demo (code below) that shows what happens when I use Object.create to create a new object based on one that has a privileged method. The outcome is not pleasant, as changing the value in the first object also changes it in the second. Unless I am reading Crockford's articles incorrectly, this makes Object.create almost useless for anything but objects that have only public members. I've seen many JavaScript programmers use closures extensively to create private members, and that still holds to be a good programming practice. However I still can't find an elegant way to create inheritance in combination with closures in JavaScript, given downfalls such as the one I mentioned above. With all of that said I still think Crockford has a nice way of programming, creating factory functions that produce objects, staying away from the prototype property and making the language look more functional. Here's the code to demonstrate what I'm referring to. Firebug needs to be enabled to view the console.debug output, otherwise convert them to alerts. Code: if (typeof Object.create !== 'function') { Object.create = function (o) { function F() {} F.prototype = o; return new F(); }; } var o = (function() { var msg = "hi"; return { msg: function(m) { if (m === undefined) { return msg; } msg = m; } }; })(); var foo = Object.create(o); var bar = Object.create(foo); console.debug(foo.msg()); // "hi" foo.msg("what?"); console.debug(foo.msg()); // "what?" console.debug(bar.msg()); // "what?" I have a javascript assignment I am having difficulties with. I have most of it complete but need some assistant with the last portion and that is to get my display function to work. I am sure that this is something I should know how to do but for the life of me can't seem to figure out and just need a little guidance. Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html lang="en" xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <title>Lab03</title> <h1> Person Information </h1> <script type= "text/javascript" charset= "utf-8"> function Person( ) { this.lastname = ' '; this.firstname= ' '; this.areacode= ' '; this.phone_number= ' '; this.show_person = ' '; } </script> <script type= "text/javascript" charset= "utf-8"> var per1 = new Person function getInput( ) { lastname= prompt("please enter your last name: "); firstname= prompt("please enter your first name: "); areacode= prompt("please enter your area code: "); phone_number= prompt ("Please enter your phone number (ex:888-8888): "); return per1; } per1= getInput( ); </script> </head> <body> <script type ="text/javascript" charset= "utf-8"> function show_person( ){ if( firstname == "" && lastname == "" ) { document.writeln( "Name: Unknown" + "<br/>" ); } else if( firstname == 'null' && lastname == 'null' ) { document.writeln( "Name: Unknown" + "<br/>" ); } else if ( firstname == "" || lastname == "") { document.writeln("Name: " + lastname); document.writeln(firstname + "<br/>"); } else if ( firstname == 'null' || lastname == 'null') { document.writeln("Name: " + lastname); document.writeln(firstname + "<br/>"); } else { document.writeln("Name: " + lastname + ", "); document.writeln(firstname + "<br/>"); } else if ( areacode == "" || phone_number == "" ) { document.writeln ("Phone: "); } else if ( areacode == 'null' || phone_number == 'null' ) { document.writeln ("Phone: "); } else { document.writeln('Phone: (' + areacode + ')'); document.writeln(phone_number); } return this.show; } </script> <noscript> <p>You must enable javascript to view all the features of this page.</p> </noscript> </body> </html> Can someone help me out and tell me what it is I need to do to make it work? I actually had it working when I was able to put all the code in the get function but was told I needed a separate display function so any input is greatly appreciated. Hello, very simple code block is below. Javascript functions that call web service methods are working when I called them between form tags. But they are not working at the beginning of the page. I specified lines that are not working below. Please help. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> <script type="text/javascript"> function GetMyName() { WebService1.GetName(onNameSuccess, onNameFailure); } function onNameSuccess(result) { return result; } function onNameFailure(result) { alert("There is an error"); } function GetMySurname() { WebService1.GetSurname(onSurnameSuccess, onSurnameFailure); } function onSurnameSuccess(result) { return result; } function onSurnameFailure(result) { alert("There is an error"); } //JAVASCRIPT FUNCTIONS ARE NOT WORKING HERE //THESE TWO LINES ARE NOT WORKING var name = GetMyName(); var surname = GetMySurname(); </script> </head> <body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server"> <Services> <asp:ServiceReference Path="WebService1.asmx" /> </Services> </asp:ScriptManager> //JAVASCRIPT FUNCTIONS ARE WORKING HERE </form> </body> </html> Hi, I'm very new to Javascript and I need some help on calling some existing functions. What i want to do is create a new function to call the first test1 and then call test2 to turn on the checkbox. i hope this isn't confusing. Code: function test1(inStore,onSale,newItem) { var daURL; if (inStore==true) { BSSetStoreOnly(true); daURL="s-2-Online-Store.aspx?ms=bsm1"; if (onSale==true){ daURL+='&SaleOnly=1'; } } else { BSSetStoreOnly(false); daURL="s-1-Our-Products.aspx?ms=bsm1"; if(newItem==true) { daURL+='&NewOnly=1'; } } location=daURL; } function test2() { var pInc; chk=document.getElementById("chkAll"); pInc=readCookie("overrideURL"); if (pInc==null) { pInc=0; } if (pInc==0) { chk.checked=false; } else { chk.checked=true; } } function callingTest1Test2 { } Hi, I would like to do something like this: Code: function searchLocations(count) { var found = false; var input = document.getElementById('autocomplete').value; var inp = input.toLowerCase(); var count = 0; for (var j = 0; j < gmarkers.length; j++) { gmarkers[j].hide(); var str=gmarkers[j].myname.toLowerCase(); var patt1=inp; if (str.match(patt1)) { found = true; gmarkers[j].show(); count++; } } if (count==1) myclick(j); if (count>1) centerZoom(); if ( ! found ) alert("No matches found. Please check your spelling or refine your search."); } on this page here, but the functions - myclick(j); and centerZoom(); aren't getting called. I tried it with switches here, but that only made things worse. I know the functions work because if I put them two } up, they get called, but that takes them out of the if statements. Those if (count...) statements have to be where they are so that "count" will get the right value. Any ideas? i have a script that will let you know what the date is.. as well as a countdown to thanksgiving.. it is called tday.js Code: function showDate() { thisDate = new Date(); var thisWDay=thisDate.getDay(); var thisDay=thisDate.getDate(); var thisMonth=thisDate.getMonth(); var thisYear=thisDate.getFullYear(); var mName = new Array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October","November", "December"); var wdName = new Array("Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"); return wdName[thisWDay]+", "+mName[thisMonth]+" "+thisDay+", "+thisYear; } function calcThanksgiving(year) { var delta = year - 1900; var tday = delta % 12; tday = (tday + Math.floor(tday/4) + Math.floor(delta/12)) % 7; return (tday == 0)? 28 : (29 - tday); } function daysToThanksgiving() { var thisDate = new Date(); var year = thisDate.getFullYear(); var tday = calcThanksgiving(year); var tdate = new Date("November "+tday+", "+year); if (thisDate > tdate) { year++; tday = calcThanksgiving(year); tdate = new Date("November "+tday+", "+year); } return Math.floor((tdate-thisDate)/(1000*60*60*24)); } so now i have to call upon this script to print "today is ..the date.. . <br> there are ..days... till thanksgiving im kind of new of calling on javascript files but i came up with Code: <SCRIPT LANGUAGE="JavaScript" SRC="tday.js"> </SCRIPT><script type="text/javascript"> document.write('Today is: '+showDate()+'. There are '+daysToThansgiving()+' days until Thanksgiving.'); </script> and it doesnt seem to be working. Hi, I have an embarrassingly similar problem to the last time I was here. I have a google map that generates links and checkboxes from an xml file and puts them in a sidebar. The links open infowindows and the checkboxes show or hide lines on the map. Which all works ok. But (like last time) I have another function that puts arrowheads along those lines to indicate directionality. The code which turns the lines off and on looks like this: Code: function togglePoly(poly_num) { if (document.getElementById('poly'+poly_num)) { if (document.getElementById('poly'+poly_num).checked) { gpolys[poly_num].show(); } else { gpolys[poly_num].hide(); } } } and the sidebar creation code is like this: Code: sidebar_html += '<input type="checkbox" id="poly'+poly_num+'" checked="checked" onclick="togglePoly('+poly_num+');">' + label + '<br />'; so I was thinking that I could just call the functions that put the arrows on the lines like this, to show/hide them along with their respective lines: Code: function togglePoly(poly_num,category) { if (document.getElementById('poly'+poly_num)) { if (document.getElementById('poly'+poly_num+category).checked) { gpolys[poly_num].show(); show(category); } else { gpolys[poly_num].hide(); hide(category); } } } and change the sidebar code to this: Code: sidebar_html += '<input type="checkbox" id="poly'+poly_num+'" checked="checked" onclick="togglePoly('+poly_num+','+category+');">' + label + '<br />'; and all would be well. But all is not well - I get an error saying that my category is not defined in the sidebar_html line. If you want to see it in action, here's without trying to toggle the arrows on and off: http://xelawho.com/map/busroutes2.htm and here's the version with the category undefined error: http://xelawho.com/map/busroutes3.htm can anybody help me out here? thanks in advance. Hello, so I'm trying to call multiple functions with onClick. It doesnt really work, just wondering why. Advice or tips would be nice, thank you guys for your time. By the way this is a project for school so the comments are for my professor Code: <head> <title>Untitled Document</title> <script type="text/javascript"> //hello, this code doesn't work, I did it piece by piece so the bits work, but when I combined them, it stopped working function texter(newText){ var oldHTML = document.getElementById('outputPrompt').innerHTML; document.getElementById('outputPrompt').innerHTML = newText+"<br />"+oldHTML; console.log(newText); } // texter function from class function menuMain(){ var userInput = document.getElementById('input').value; var mainMenu; if (userInput == "3"){ mainMenu = menuThree(); } else if (userInput== "2") { mainMenu = menuTwo(); } else if (userInput== "1") { mainMenu = menuOne(); } texter(mainMenu) } //going to the functions by calling them function menuOne(){ var userInput = document.getElementById('input').value; if (userInput.length == 0){ texter("You need to enter something in the input box"); } else { texter("the string has been saved"); } } // if the length is equal to zero then there was nothing inputted function menuTwo() { var userInput = document.getElementById('input').value; var theArray = userInput.split(/\s|\n|\r/); //split string into words array i looked up the regex on coding forums //also had help to create this from coding forums var WordsFound = [i]; for (var i=0; i<theArray.length-0; i++) { if (theArray[i].length < 5) { WordsFound.push('eep- '+theArray[i]); } else { if (theArray[i].length > 5) { WordsFound.push(theArrray[i]+' -zzz'); } else { WordsFound.push(theArray[i]); } } } document.getElementById('outputPrompt').innerHTML = WordsFound.join('<br>'); } // if the array length is less than five the word will push it onto the array // vise versa with the array length being more than five //then i join the word with the array function menuThree() { var userInput = document.getElementById('outputPrompt').reset(); } //reset the output function combineFunctions() { menuMain(); menuOne(); menuTwo(); menuThree(); } // combining the functions into one function so i can call it on onclick function cleartext(){ document.getElementById('input').value=""; } </script> </head> <body> <h1>RoboSpeek</h1> <textarea type='text' id='input' onfocus="cleartext()" cols="40"rows="10" wrap="physical"> Please enter 1,2,3 or Exit</textarea><br /> <input type='button' onclick='combineFunctions()' value='submit'/> <p id='outputPrompt'>Please enter 1,2,3 or exit only</b> </p> </body> </html> Hello all here is a more intelligent question. This one is just on an exercise I am doing. I have to call a function using parameter values. my main function is this Code: function showResults(race,name,party,votes) or just function showResults in the next lines below i have to call the function is this the right way Code: <script type="text/javascript"> { showResults=("race[0],name1,party1,votes1"); } </script> or should it be without the { and } like this? Code: script type="text/javascript"> showResults=("race[0],name1,party1,votes1"); </script> or is it like this Code: script type="text/javascript"> showResults(race[0],name1,party1,votes1); </script> Thanks all, what would be the proper method Thanks i now have <a href=""javascript:NewCssCal('repaymentdate','ddMMyyyy')""> how can I have this after it calls teh newcsscal and fills in the textbox call another function. (i don't want to add it to newcsscal as that's used in multiple locations and I only need to call this function in 1 location. 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 I am currently designing a table as such Code: ___________________________ | TABLE | | | FRAME A |___________________________| | last row clicked | FRAME B |___________________________| the top frame is a table and the bottom frame contains the last row clicked called through onclick. question: if frame B is a php file with a javascript object, how do i call the javascript object's function to print the data? here is what i have so far index.html //this is the source code for the site Code: <html> <frameset rows = "60%, 40%"> <frame src = "table_driver.php" name = "A" id = "FRAME1"> <frame src = "bottom_row.php" name = "B" id = "FRAME2"> </frameset> </html> printJSTable() //prints the table shown in frame A Code: function printJSTable() { echo '<script src = "java_script.js"></script>'; echo '<script src="sorttable.js"></script>'; echo '<table class = "sortable" id = "myTable" border = "1">'; echo '<thead id = "header"><tr>'; foreach($this->columns as $header => $order) { echo '<th>'; echo $header; echo '</th>'; } echo '</tr></thead><tbody>'; $counter = 0; for($i = 0; $i < $this->numRows; $i++) { //IMPORTANT changeRow(this) is JS call echo '<tr onclick = "changeRow(this)" onmouseover = "mouseOver(this)" onmouseout = "mouseOut(this)">'; foreach($this->data[$i] as $key => $value) { echo '<td>'; if($value!="") echo $value; else { echo ''; } $counter++; echo '</td>'; } echo '</tr>'; } echo '</tbody></table>'; echo '<form><input id = "'.$this->numRows.'"type = "button" value = "add row" onclick = "addRow(id)"></form>'; } and this is changeRow(this) which is supposed to create the table in frame b Code: //populates headersArr and rowArr correctly parent.B.obj = new TableData(headersArr, rowArr); parent.B.obj.printTable(); here are the function definitions for TableData Code: function TableData(headers, row) { this.headerArr = headers; this.rowArr = row; } TableData.prorotype.printTable = function() { for(i=0; i<this.headerArr.length; i++) { document.write('<tr><th>'); document.write(this.headerArr[i]); document.write('</th><td>'); document.write(this.rowArr[i]); document.write('</td></tr>'); } } and then, finally, this is the php file for the bottom frame Code: <html> <head> <link rel = "stylesheet" type = "text/css" href = "style.css"/> <script type = "text/javascript" src="java_script.js"></script> </head> <body> <script> obj = new TableData; </script> </body> </html> what i want to do is populate the variable obj from ^ (bottom_row.php) and then use the print function to print it out. right now it is populating correclt,y but i cant get it to print. The error console says that Value undefined (result of expression parent.B.obj.printTable) is not object. ?? sry for all the code! just didnt want to leave anything out thanks! Hello, Our website is built in ASP.NET and uses a content management system. The CMS came with a wealth of JavaScript files and I decided to use one of these files for form validation. Although the file is over 2,300 lines, from what I can tell it is supposed to return true if the form is valid and false otherwise. The problem is that a function inside that file seems to get to a certain point, and somehow quit and return true no matter if the form is valid or not. I am calling this JS from an ASP.NET button control. When the button is clicked, a JS function ValidateForm(document.forms[0]) is called. My ValidateForm function calls another function inside the JS file (which calls another, and another...). No matter what, when that second function is called and executed, code execution stops at some point and the form submits (postbacks). I can see that the validation is working just before the postback, but it is not preventing the form from being submitted, and it also stops executing any code after it. Here is my code: ASP: Code: <asp:Button ID="SubmitBtn" runat="server" Text="Submit Form" CausesValidation="false" CssClass="submit_button" OnClientClick="FmValidate(document.forms[0]); return false;" OnClick="SubmitBtn_Click" /> My Javascript: Code: function FmValidate(formObj) { var strError = ''; var e = null; if (strError == '' && 'function' == typeof design_validateHtmlForm) { alert('before'); // this line causes execution to stop - located in external JS file // code states "Returns first invalid element, or null." e = design_validateHtmlForm(formObj); alert("e is " + e); if (e) { strError = e.title; } return false; } } In my ASP.NET button, changing the OnClientClick method to "return false" will prevent form submission, but "return FmValidate(formObj);" will not if that function calls design_validateHtmlForm(formObj). I receive the message box saying "before" but I never receive the second one. I have debugged using Fire bug, but the code seems to cycle through each element on the page and stepping through the code is not realistic (I have done so for 20-minute stretches). I am wondering if anyone has any ideas what code I could look for that would stop execution and return true no matter what, or how I could begin debugging this monster. so, I can pass a value from a select list to another function which then decides which function to call, but I want to cut out the middleman, and make the values the function calls, and call them directly on the onchange... I imagine something like this: Code: <select id="select" onchange="this.value"> <option selected value="function1()">Funtion 1</option> <option value="function2()">Function 2</option> <option value="function3()">Function 3</option> </select> is it possible? Hi. I need help in adding a parenthesis in the area code of the phone number and validating it also. I made some javascript code but it is not working. Can somebody please help? I just need the code in adding () in the area code. For example: When user enter 10 digit number no spaces or dashes such as 0000000000 or 000-000-0000, I would like to have this format right away (000)000-0000. I know how to replace the characters but adding it is a tricky one for me. Can somebody please help? Thanks. 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. My question is about the following javascript function that converts 15 digit salesforce IDs to 18 digit salesforce IDs. The function was originally posted here. Developer 1 wrote the function: function convertToCaseInsensitiveId(id) { var hash = ''; for (var c = 0; c < 3; c++) { var h = 0; for (var i = 0; i < 5; i++) { var ch = id.charCodeAt(i + c * 5); if (ch >= 65 && ch <= 91) h += Math.pow(2, i); } hash += String.fromCharCode(h > 26 ? h + 48 - 26 : h + 65); } return id + hash; } Developer 2 said: Since the checksum numbers are mapped to AB..YZ012345, 25 gives Z. The following line > hash += String.fromCharCode(h > 26 ? h + 48 - 26 : h + 65); should be > hash += String.fromCharCode(h > 25 ? h + 48 - 26 : h + 65); otherwise 26 would be mapped to opening bracket (ASCII # 91). Which developer's solution is correct? Hi, can anyone tell me... Code: function Obj() { this.recursiveMethod=function () { //...how to invoke Obj.recursiveMethod from here? } } Gus I am building a website and I need to gather some information but I feel that prompts are unappealing. Maybe something like a form but it defines whatever is typed in as a variable?
I currently have the following code: <script> function strstr (haystack, needle, bool) { var pos1 = 0; haystack += ''; pos1 = haystack.indexOf(needle); if (pos1 == -1) { return false; } else{ if (bool){ return haystack.substr(0, pos1); } else{ amp1 = haystack.indexOf('&'); if((amp1 == -1) || pos1<amp1){ alert("here"); return haystack.slice(pos1); }else{ bString = haystack.slice( pos1 ); pos2 = bString.indexOf( needle ); amp2 = bString.indexOf('&'); //alert(bString.slice( pos2)); return bString.slice( pos2 ); }//if(amp>1){ }//if (bool){ }//if (pos == -1) { }//function strstr var story = strstr(top.location.href, "story="); var pinID = story.replace("story=", ""); alert(pinID); if(pinID>0){ document.getElementById('iFrame').src = 'http://www.domain.net/index.php?story='+pinID; }//if(pinID>0){ </script> It takes the website URL in Javascript and I wanted it to see if there is a "story=1" id and then pass it to the IFRAME. This works in a fashion, but i was trying to make it into a function so I could find and pass other variables, but anything after an & sign and it all fails? I was hoping to pick out variables from the top.location.ahref of "http://www.domain.com/index.php?story=1&category=2&something=3" for example? Any help would be appreciated. Many thanks |