How do you reuse javascript functions

We have many javascript functions that are usually handled through the onclick function. They are currently present in every file where necessary. Would it be advisable to combine all the javascript functions into a single file and use it where necessary? What is the common practice here.

<s:link view="/User.xhtml" onclick="if (confirm('#{messages['label.user.warning']}')) { var f = $('user'); f.method = 'POST'; f.action = f.submit(); } return false;"> 
+4
source share
5 answers

It is up to you to determine where reuse lies in your own code. But it's quite simple (and a good idea) to create a library of commonly used functions. Create a file like mylib.js, for example with things like ...

 function saveUser(f) { //... f.method = 'POST'; f.action = f.submit(); } 

add this to your pages:

 <script type="text/javascript" src="mylib.js"></script> 

add your event code as follows:

 <s:link view="/User.xhtml" onclick="return saveUser($('user'));"> 

Please note that the library code avoids any dependencies on the layout or naming of elements on pages that use it. You can also leave small comments that will remind your future what the purpose and assumptions of these library functions are.

+4
source

Yes! Absolutely doubt the external javascript. Imagine if you need to change something in this code. How many places do you need to change now? Do not duplicate the code. This should make your page bigger, which obviously affects the loading.

+5
source

Would it be advisable to combine all the javascript functions into a single file and use it where necessary?

Mmmm ... yes

It would be better to do something like this:

 function saveUser() { // logic goes here } 

and use markup

 <s:link view="..." onclick="saveUser();"> 

Using inline code in code is very bad. Do not do this. Or the prorgamming gods will be restless.

+2
source

It is always recommended that you include JavaScript code in JavaScript files. Just as you don't mix content and presentation (XHTML and CSS), you don't need to mix content and interactivity (XHTML and JavaScript).

Paste JavaScript code into a separate file has several advantages:

  • No need to duplicate code (reuse is better)
  • The ability to reduce the source code , which is absolutely impossible to do if you have collected XHTML and JavaScript,
  • The ability to use non-intrusive JavaScript, helping to create more accessible websites (there is probably nothing wrong with accessibility to use onclick and other events, but it becomes very easy to forget that the website should work without JavaScript, thereby developing an unavailable website )
  • Better client-side performance: large pages slow down; when you install JavaScript from the outside, the pages are smaller, and the .js file is cached by the browser instead of downloading for every request.
+2
source

Javascript can be accessed using a script tag that can point to an external script or define it only for use in this document.

 <script type="text/javascript" src="mycustom.js"></script> <!-- OR --> <script type="text/javascript"> function saveUser(username) { //code } </script> 

Do not be offended, but if you did not know that you are either very new to this or have missed many steps in learning javascript. I recommend going through the w3schools.com javascript tutorial and all that you will use.

0
source

All Articles