eval<\/code>.<\/p>\nOne Function, as many or as Few Arguments as You Like<\/h3>\n
In JS you can pass as many arguments to a function as you like and that function can then decide what to do with those arguments on the fly. You might wonder what I’m on about so let me give you an example. You have to write a function that takes any number of integers and adds them together. Before we do this in JS lets do it in Java:<\/p>\n
\r\npublic static int sum(int[] nums){\r\n int ans = 0;\r\n for(int i=0;i<nums.length;i++){\r\n ans += nums[i];\r\n }\r\n return ans;\r\n}\r\n[\/java]\r\n\r\n<p>What you should note is that in Java there is no way to make a function take 'any number' of arguments so you have to fudge it. In the above code I fudge it by using a single array argument rather than 'any number of arguments'. We could also have used some other list structure as the single argument, e.g. a <code>java.util.LinkedList<\/code> or a <code>java.util.Vector<\/code>. What wrapper we decide to use is irrelevant, the point is that we have to somehow wrap our variable length list of arguments into a single argument to keep Java happy.<\/p>\r\n\r\n<p>Now lets have a look at the right way to implement this in JS:<\/p>\r\n\r\n[js]\r\nfunction sum(){\r\n var ans = 0;\r\n for(var i=0;i<arguments.length;i++){\r\n ans += arguments[i];\r\n }\r\n return ans;\r\n}\r\n[\/js]\r\n\r\n<p>The code looks quite similar except for one thing: we have not named any of the arguments for the function, instead we are using an array called <code>arguments<\/code>. JS, like Perl, stores it's arguments in an array but lets you name some or all of them for convenience if you want. (unlike Perl JS does let you pass an array literal as a single argument.)<\/p>\r\n\r\n<p>You would be right in saying that there is very little difference between the JS version and the Java version when it comes to writing the function. There is a line-for-line equivalence between the functions. Where the difference becomes obvious is when you go to use your functions as illustrated below.<\/p>\r\n\r\n<p>Java first:<\/p>\r\n\r\n[java]\r\nint[] numbers1 = {1, 2, 3, 4};\r\nint ans1 = sum(numbers1);\r\nint numbers2[] = {5, 6, 7, 8};\r\nint ans2 = sum(numbers2);\r\n<\/pre>\nNow the JS:<\/p>\n
\r\nvar ans1 = sum(1, 2, 3, 4);\r\nvar ans2 = sum(5, 6, 7, 8);\r\n<\/pre>\nYou’ll notice that the JS code is much simpler. There is only one step involved, call the function and pass it what you want. The Java code on the other hand needs to prepare the array each time before sending it. Things get even worse if you want to do this kind of thing with Objects rather than literals. Have a look at the nasty Java code below:<\/p>\n
\r\nInteger numbers1 = new Integer[4];\r\nnumbers1[0] = new Integer(1);\r\nnumbers1[1] = new Integer(2);\r\nnumbers1[2] = new Integer(3);\r\nnumbers1[3] = new Integer(4);\r\nInteger sum1 = sum(numbers1);\r\nInteger numbers2 = new Integer[4];\r\nnumbers2[0] = new Integer(5);\r\nnumbers2[1] = new Integer(6);\r\nnumbers2[2] = new Integer(7);\r\nnumbers2[3] = new Integer(8);\r\nInteger ans2 = sum(numbers2);\r\n<\/pre>\nNow the power of this feature of the JS language should be obvious.<\/p>\n
More perceptive readers have, at this stage, probably realised that this means that JS does not do function overloading and you would be right. In each scope\/namespace there is only one function with a particular name. If you create a second function with the same name but a different argument list it will replace the first one, ignore the second or throw an error depending on your implementation of JS. You are now probably asking yourself, is this a problem? The answer is no it isn’t. You do all the work within one function and if you need to do different things depending on what arguments you got you have a look at what’s in the arguments<\/code> array and take appropriate action. In fact, function overloading is nothing more than a kludge to allow strongly typed languages like Java to approximate variable length argument lists. In general when two functions overload each other they do the same thing but with different data and you just do some converting\/default setting and then pass the data on to the overloaded function that does the actual work. In JS you just write one function that does the work regardless of how you called it. Anything you can do with multiple overloaded functions you can do with one single function in JS and TBH that makes a lot more sense to me, less hoop-jumping and all that.<\/p>\nEdit Classes on the Fly<\/h3>\n
Although it is easy, in Java, to take the functionality from any System object (like java.lang.String<\/code>) and add it to an object of your own (you just extend the class), it is not possible to add functionality to<\/strong> the System classes. You can’t, for example, decide that there should be a function in java.lang.Integer to return an Integer which is made up of the digits of the original Integer reversed and add it in to the class (no idea why you’d want to mind!). No prizes for guessing but, in JS you can. You can take any of the classes of object that come with JS and add your own functionality to them.<\/p>\nThe reason you can do this is because of the prototype<\/code> variable that is associated with each object class. When a function is called on an object there are two places that JS looks to find the function to invoke. First it looks to see if the object has a variable of type function<\/code> with the right name, failing that it looks in the prototype<\/code> variable for the class that the object belongs to to see if there is a mapping there. We have already seen the former when creating classes in the second section of this article. In the code examples in that section we created the properties and the functions for an object all within the ‘constructor’, adding functions by setting properties of the class equal to function literals. You don’t have to do it that way. You can add the functions in separately at any stage using the prototype<\/code> variable but this makes things more difficult for inheriting because prototyped functions cannot be inherited simply by calling a constructor function, they have to be explicitly copied to the inheriting class’ prototype<\/code> variable. This is why I don’t use prototype<\/code> when creating classes.<\/p>\nLets now re-visit our sum<\/code> function form the previous section. Rather than having the function as a standalone function that you then have to pass an array to, it would be much nicer to add the summing functionality straight into JS’s Array<\/code> class. Below is the code to do just that:<\/p>\n\r\nArray.prototype.sum = function(){\r\n var ans = 0;\r\n for(var i=0;i<this.length;i++){\r\n ans += this[i];\r\n }\r\n return ans;\r\n}\r\n[\/js]\r\n\r\n<p>By inserting the code into the Array class this functionality is now automatically added to all arrays so you can now do things like:<\/p>\r\n\r\n[js]\r\nvar myArrayOfInts = [1, 2, 3, 4];\r\nwindow.alert(myArrayOfInts.sum());\r\n\r\n\/\/because JS is loosly typed even the following will work \r\n\/\/(printing out the Array contents concatonated together)\r\nvar mixedArray = ["here", " ", "are", " ", "some", " ", " numbers:", " ", 1, 2, 3, 4];\r\nwindow.alert(mixedArray.sum());\r\n<\/pre>\nIf you’re already impressed, you’re about to become even more impressed. The more observant among you will have noticed that if you add functions to an object within it’s constructor each object has it’s own copy of the function. This has a downside, it takes up more RAM than the prototyping method, but it makes inheritance easier to implement and it also adds another very interesting ability to the language. In JS it is possible to have two objects of the same type with different implementations of the same function. Take a moment to let that sink in. Without having to create a new class you can make different instances of the same class have different implementations of functions. You just can’t do that in Java. You’d have to have a base class with the default implementation of the function in a parent class (or an abstract function if there is no default) and then a separate subclass overriding the function for each different implementation. If you have a couple of functions that that need a couple of implementations things get very out of hand very very quickly.<\/p>\n
That’s great but why on Earth would you want to do that? Well let me give you an example from my everyday life. You want to write a nice object to encapsulate a generic AJAX request because your site uses a lot of AJAX and you’re tired of typing the same code again and again and would like everything to do with a request encapsulated in an object. You start coding this up and it all goes well till you get to your function for handling state changes in the HTTP Request object in which you have to actually DO something with the response you got from the server. Thing is you want to do something different for each instance<\/strong> of your class. In Java this is not possible so you would have to write a base class which implements all the functionality for talking to the server and then make your function to actually do something with the response (lets call it process<\/code>) abstract. For each different thing you want to do with AJAX you would then have to create a new subclass of your base class and implement process<\/code>. That is a lot of work for no good reason. In JS you can just create an instance of your AJAX object, plug in a process<\/code> function of your choice using a function literal and then use your object.<\/p>\nIn fact, my partner wrote a little JS class to encapsulate AJAX in JS in this way which will be released as GPL soon. This object gets used something like this:<\/p>\n
[JS]
\nvar req1 = new AjaxReq(“POST”, “http:\/\/somewhere.ie\/something.do”, “var1=val1&var2=val2”);
\nreq1.process = function(req){
\n document.getElementById(‘myDynamicDiv’).innerHTML = req.responseText();
\n}
\nreq1.send();<\/p>\n
var req2 = new AjaxReq(“POST”, “http:\/\/somewhere.ie\/something.do”, “var1=val1&var2=val2”);
\nreq2.process = function(res){
\n window.alert(res.responseText());
\n}
\nreq2.send();
\n[\/js]<\/p>\n
You’ll note that this code is much simpler and neater than having to create a new class each time you want to do something different with the result you get from the server.<\/p>\n
Conclusions<\/h3>\n
This is by no means an exhaustive list of the cool things that JS can do that Java has trouble with or does less well yet it is a substantial list with some very powerful features. Perl can also do just about everything in this article and there are probably other languages that can too but Java, C and C++ are not among those languages.<\/p>\n
Something else to note is that the two features that I consider most powerful (Multiple inheritance and the ability to edit classes on the fly) are made possible because JS supports function literals which is what sparked Joel’s article in the first place. The simple act of allowing you to create a function in the same way as a variable and then pass it round as if it was a variable gives JS immense power which Java and it’s ilk just do not have.<\/p>\n
JS used to be a language confined to just the HTML page but is is now growing beyond that. JS is used to power FireFox extensions, Mac OS X Dashboard Widgets and Yahoo Desktop Widgets (or what ever Confabulator is now called) as well as other non-web applications. Considering how powerful the language is it seems a shame that most people don’t realise what it can do or that it has now broken free from the HTML page. I have no doubt that we will see JS branch out into even more applications soon and I for one am really looking forward to that.<\/p>\n
[tags]Java, JavaScript, Programming[\/tags]<\/p>\n","protected":false},"excerpt":{"rendered":"
Something that has annoyed me for a long time is that JavaScript is looked on by many people as just being a stripped down version of Java. You take Java, you take out most of the features and you get JS. This is completely wrong. The two are two completely different languages which follow different […]<\/p>\n","protected":false},"author":3,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":false,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[12,16],"tags":[420],"series":[],"class_list":["post-259","post","type-post","status-publish","format-standard","hentry","category-computers-tech","category-programming","tag-javascript"],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"","jetpack_shortlink":"https:\/\/wp.me\/p7t9xK-4b","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.bartbusschots.ie\/s\/wp-json\/wp\/v2\/posts\/259","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.bartbusschots.ie\/s\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.bartbusschots.ie\/s\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.bartbusschots.ie\/s\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/www.bartbusschots.ie\/s\/wp-json\/wp\/v2\/comments?post=259"}],"version-history":[{"count":1,"href":"https:\/\/www.bartbusschots.ie\/s\/wp-json\/wp\/v2\/posts\/259\/revisions"}],"predecessor-version":[{"id":7399,"href":"https:\/\/www.bartbusschots.ie\/s\/wp-json\/wp\/v2\/posts\/259\/revisions\/7399"}],"wp:attachment":[{"href":"https:\/\/www.bartbusschots.ie\/s\/wp-json\/wp\/v2\/media?parent=259"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.bartbusschots.ie\/s\/wp-json\/wp\/v2\/categories?post=259"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.bartbusschots.ie\/s\/wp-json\/wp\/v2\/tags?post=259"},{"taxonomy":"series","embeddable":true,"href":"https:\/\/www.bartbusschots.ie\/s\/wp-json\/wp\/v2\/series?post=259"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
![\"Figure](\"http:\/\/www.bartbusschots.ie\/blog\/wp-content\/uploads\/2006\/08\/jsblogpostfigure1.png\")
<\/p>\n