Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 1 of 2 12 LastLast
Results 1 to 15 of 18
  1. #1
    New Coder
    Join Date
    Nov 2010
    Location
    i live online.
    Posts
    11
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Smile JS++ cool idea and technique!

    Code:
    //define globals first.
    var myGlobal1 = document.getElementById('myGlobal1');
    
    //the main(); function
    function main() {
    //normally more would be put here, but with this being an example, im purposely making
    //it much less efficient, for learning sake.
    exampleFunc();
    alert("application has terminated.");
    }
    
    //exampleFunc()
    function exampleFunc() {
    alert(myGlobal1.value);
    }
    this is called aspect-oriented javascript programming (AOP), and had i heard of it earlier, the name of this article would have been changed to match it such. I post this here as a means of driving it further into web developement. Many programmers have been using this technique in javascript for years, however, in every example of a program I see, it is not used.

    AOP was first developed by a group from Xerox PARC lead by Gregor Kiczales. This lead to the developement of AspectJ, an extension to java. This is why i write this, programs that dont traditionally use this, such as the loosely written javascript, can use AOP to organize projects, and have extensive web applications. Without it, it may remain misunderstood as a "web toy" or a means to only change CSS around for visuals.

    Think of it this way, HTML/CSS is the GUI interface frontend for javascript. Javascript can even interact with those elements to add a bit more to it. This is what most people seeing javascript doing.

    Of course, with this article i havent written any rough drafts or anything I simply threw it down.. if its not up to par with anything just let me know.. send me some links, and i will most likely update it.

    thanks.
    Last edited by boyo1991; 02-08-2013 at 07:20 PM.

  • #2
    Regular Coder
    Join Date
    Mar 2008
    Location
    London
    Posts
    152
    Thanks
    4
    Thanked 42 Times in 42 Posts
    Doesn't makes any sense.

  • #3
    New Coder
    Join Date
    Nov 2010
    Location
    i live online.
    Posts
    11
    Thanks
    2
    Thanked 0 Times in 0 Posts
    thats fine, im just putting it here in case people do see it...

    what part of it confuses you? perhaps i can help?

  • #4
    Moderator
    Join Date
    May 2002
    Location
    Hayward, CA
    Posts
    1,461
    Thanks
    1
    Thanked 23 Times in 21 Posts
    OK, who invokes main()?

    I hate to say it, but this idea is hardly new and revolutionary. JavaScript developers do this kind of stuff every day. We even have code that wraps original functions so that other functions can run before or after a target function. This is a concept known as aspect-oriented programming, and JS has supported it from the very beginning.
    "The first step to confirming there is a bug in someone else's work is confirming there are no bugs in your own."
    June 30, 2001
    author, Verbosio prototype XML Editor
    author, JavaScript Developer's Dictionary
    https://alexvincent.us/blog

  • Users who have thanked Alex Vincent for this post:

    boyo1991 (02-08-2013)

  • #5
    New Coder
    Join Date
    Nov 2010
    Location
    i live online.
    Posts
    11
    Thanks
    2
    Thanked 0 Times in 0 Posts
    well its meant to be invoked by either <body onload="main()"> or if one really wishes, onclicks...

    but i hardly doubted that anyone HASNT used it before... especially programmers coming from c++, but i just thought id make it a thing... a technique rather than something that just naturally happens..

    as for aspect-oriented programming, i should brush up on my history a bit! ive been programming for a long time but never decided to look for any REAL history in it.. so this idea of aspect-oriented javascript programming DOES nullify this article. i will modify it to work correctly with the implimentation!

  • #6
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,642
    Thanks
    0
    Thanked 649 Times in 639 Posts
    Quote Originally Posted by boyo1991 View Post
    well its meant to be invoked by either <body onload="main()"> or if one really wishes, onclicks...
    Jumbling the JavaScript with the HTML like that is a really bad idea - it used to be the only way to write JavaScript back when Netscape was the only browser that supported it but since IE5 there has been no reason whatever to jumble the JavaScript in with the HTML. Since IE5 all JavaScript should go in a separate file.

    onload is also unnecessary except if your script needs to confirm if all the images have loaded. For simple interactions with the page simply attaching the script at the bottom of the page results in a lot less code and the script running a lot sooner.

    In addition, global variables are almost completely unnecessary in JavaScript - the only time they are needed is to provide a way to reference a library that is in a separate file. For stand alone scripts that are not dependent on a library the only use that global variables have is to possibly clash with other scripts to break the functioning of the page.

    Also alert() is for debugging purposes only and should never be used in a published script.

    Defining names functions rather than simply assigning anonymous functions to variables also limits your ability to use functions as flexibly as JavaScript allows but with the types of scripts that JavaScript beginners produce this doesn't really matter.

    Effectively there is nothing whatsoever in your code that should be used in writing JavaScript for modern browsers - except for beginners using that less flexible way of defining their functions.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #7
    New Coder
    Join Date
    Nov 2010
    Location
    i live online.
    Posts
    11
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by felgall View Post
    Jumbling the JavaScript with the HTML like that is a really bad idea - it used to be the only way to write JavaScript back when Netscape was the only browser that supported it but since IE5 there has been no reason whatever to jumble the JavaScript in with the HTML. Since IE5 all JavaScript should go in a separate file.

    onload is also unnecessary except if your script needs to confirm if all the images have loaded. For simple interactions with the page simply attaching the script at the bottom of the page results in a lot less code and the script running a lot sooner.

    In addition, global variables are almost completely unnecessary in JavaScript - the only time they are needed is to provide a way to reference a library that is in a separate file. For stand alone scripts that are not dependent on a library the only use that global variables have is to possibly clash with other scripts to break the functioning of the page.

    Also alert() is for debugging purposes only and should never be used in a published script.

    Defining names functions rather than simply assigning anonymous functions to variables also limits your ability to use functions as flexibly as JavaScript allows but with the types of scripts that JavaScript beginners produce this doesn't really matter.

    Effectively there is nothing whatsoever in your code that should be used in writing JavaScript for modern browsers - except for beginners using that less flexible way of defining their functions.
    well i was not to say that it was the only way... it could be simply done at the bottom of the script as:

    main();

    and your done..

    as for the global variables, i understand, but they still do exist.. so i added them into the example.. and for an alert(), i understand this as well, but this example is not based on what the program does, its about a technique for writing it. so maybe this were for debugging purposes? its just to show whats supposed to go through the app.

    i do appreciate the input however!

  • #8
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,366
    Thanks
    11
    Thanked 590 Times in 571 Posts
    for the code shown, in modern browsers,
    Code:
    var myGlobal1 = document.getElementById('myGlobal1');
    is the same as
    Code:
    
    
    ...
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/9/03) IE7:0.1, IE8:4.6, IE11:9.1, IE9:3.1, IE10:3.0, FF:17.2, CH:46, SF:11.4, NON-MOUSE:38%

  • #9
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,642
    Thanks
    0
    Thanked 649 Times in 639 Posts
    A better way to do this would be to use modern JavaScript instead of that antiquated 20th Century version that's been obsolete for about a decade now.

    Here's what the OPs code would look like of coded in the right order - as the OP included statements to show the order they go in I have included the same statements but put them in the correct order. What the statements actually do and what real code replaces the alerts would be irrelevant to the order of the statements.

    Code:
    //don't define globals at all
    
    // wrap your entire script inside a function so that nothing is global
    (function() {
    
    // use the latest JavaScript version
    "use strict";
    
    // define all your local variables
    var myGlobal1, exampleFunc, main; 
    
    //exampleFunc()
    exampleFunc = function() {
    alert(myGlobal1.value);
    }
    //the main(); function
    main = function() {
    //normally more would be put here, but with this being an example, im purposely making
    //it much less efficient, for learning sake.
    exampleFunc();
    alert("application has terminated.");
    }
    
    // get the script to actually do something
    myGlobal1 = document.getElementById('myGlobal1');
    main();
    
    // end of anonymous function wrapper
    })();
    As you can see, even with such a short example there is almost nothing from the OPs example that was in the right place.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • Users who have thanked felgall for this post:

    boyo1991 (02-08-2013)

  • #10
    New Coder
    Join Date
    Nov 2010
    Location
    i live online.
    Posts
    11
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by felgall View Post
    A better way to do this would be to use modern JavaScript instead of that antiquated 20th Century version that's been obsolete for about a decade now.

    Here's what the OPs code would look like of coded in the right order - as the OP included statements to show the order they go in I have included the same statements but put them in the correct order. What the statements actually do and what real code replaces the alerts would be irrelevant to the order of the statements.

    Code:
    //don't define globals at all
    
    // wrap your entire script inside a function so that nothing is global
    (function() {
    
    // use the latest JavaScript version
    "use strict";
    
    // define all your local variables
    var myGlobal1, exampleFunc, main; 
    
    //exampleFunc()
    exampleFunc = function() {
    alert(myGlobal1.value);
    }
    //the main(); function
    main = function() {
    //normally more would be put here, but with this being an example, im purposely making
    //it much less efficient, for learning sake.
    exampleFunc();
    alert("application has terminated.");
    }
    
    // get the script to actually do something
    myGlobal1 = document.getElementById('myGlobal1');
    main();
    
    // end of anonymous function wrapper
    })();
    As you can see, even with such a short example there is almost nothing from the OPs example that was in the right place.
    this is interesting, I quite like it, however, i dont like how functions are declared, nor do i like how variables are declared in your example, of course thats nothing you had to do with.. its damn ECMA! :P either way, i like this thought.. as for javascript in its own. very informative, basic stuff but a good refresher.

    however this is a different technique entirely.. this is with AOP, and its a little different in total. Im sure my writing will be obsolete (already is, but just as an example) in a few years when they say that you must declare the function before anything.

    the thought that my globals are being garbage collected help a lot, i now understand why some of my programs are simply not working. i will not be declaring global variables again anytime soon! lol

  • #11
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,642
    Thanks
    0
    Thanked 649 Times in 639 Posts
    Quote Originally Posted by boyo1991 View Post
    however, i dont like how functions are declared
    There are some places in JavaScript where you have to define the functions the way I did. For example if you want to define the function two different ways using an if statement to select which of the two definitions to use or if you nest definitions of the same function inside one another.

    For example of you are going to define an addEvent function that uses an eventListener for JavaScript and attachEvent for JScript then you have to define the two functions the way I did because the way you defined the functions is not allowed inside of if/else. See http://javascriptexample.net/events01.php for an example of this.

    If you define named functions then those functions are automatically hoist to the top of the code and multiple definitions of the same function will overwrite one another leaving the last version of the function as the one that always gets called. Since they are hoist to the top it would be less confusing if you actually defined them at the top.

    Quote Originally Posted by boyo1991 View Post
    nor do i like how variables are declared in your example
    JavaScript automatically hoists all variable declarations to the top of the script so the code is easier to follow if you actually declare them all at the spot where JavaScript will declare them. That way someone familiar with other languages that don't hoist declarations will not be confused.

    JavaScript declares all the variables in one go so it makes the most sense to use a single statement to declare them.

    When you work with lots of different programming languages it is easier to work with them all if you base your coding styles on how they actually work - that way they work the way your code reads in each case.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #12
    New Coder
    Join Date
    Nov 2010
    Location
    i live online.
    Posts
    11
    Thanks
    2
    Thanked 0 Times in 0 Posts
    understood.. im just saying i dont like it :P

    however.. like i said before, this is just an idea, and a different way of looking at it.. its not by any means the only way and/or the way that needs to be done.. technically this is the way it SHOULDNT be done.. but im just saying it still works..

  • #13
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,642
    Thanks
    0
    Thanked 649 Times in 639 Posts
    Quote Originally Posted by boyo1991 View Post
    understood.. im just saying i dont like it
    So if you don't like JavaScript then what programming languages do you like? What language do you think should be made available as an alternative language to use in the browser instead of JavaScript?
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #14
    New Coder
    Join Date
    Nov 2010
    Location
    i live online.
    Posts
    11
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by felgall View Post
    So if you don't like JavaScript then what programming languages do you like? What language do you think should be made available as an alternative language to use in the browser instead of JavaScript?
    i actually love javascript... maybe not so much its syntax, but its capabilities, and strengths are fantastic. id love to see a better language come along though! ill be entirely honest i dont necessarily make programming languages, so this is just a thought, nothing more..

  • #15
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,366
    Thanks
    11
    Thanked 590 Times in 571 Posts
    Quote Originally Posted by felgall View Post
    There are some places in JavaScript where you have to define the functions the way I did. For example if you want to define the function two different ways using an if statement to select which of the two definitions to use or if you nest definitions of the same function inside one another.

    For example of you are going to define an addEvent function that uses an eventListener for JavaScript and attachEvent for JScript then you have to define the two functions the way I did because the way you defined the functions is not allowed inside of if/else. See http://javascriptexample.net/events01.php for an example of this.
    if your claim is true, why does this seem to work?
    Code:
    function test(x,y){
      function sum(a,b){return a+b;}
      if( 1>0 ){function sum(a,b){return a*b;}}
    
     return sum(x,y);
    }
    
    test(5,10); // == 50
    as compared to :
    Code:
    function test(x,y){
      function sum(a,b){return a*b;}
      if( 1>0 ){  function sum(a,b){return a+b;} }
    
     return sum(x,y);
    }
    
    test(5,10); // == 15
    seems like the function statement inside the if work just fine to me, unless you know something i don't...

    i can see how with function hoisting and all one might think it wouldn't work, but it's neat how it works as expected, huh?

    I for one, strongly recommend using function statements instead of function expressions, it's one less name to type, and gives all functions an internal name. This is important since arguments.callee is likely going away soon. When you pre-declare the var, and then later assign the function without an internal name, recursion is slower and more dangerous, and you have more boilerplate between the function opener and the core logic. That's harder to skim, even if it is more detailed information.


    if i were to code the OP's syntax, i would DRY all vars and assumed globals, publish the workhorse for later re-use, make it async and dependency self-aware, self-waiting for all depends, and use better function declaration to reduce clutter, allow recursion, and facilitate debugging:


    PHP Code:
    // wrap your entire script inside a function so that nothing is global
    (function wrapper() {

        
    // define local variables
        
    var myGlobal1=myGlobal1;

        
    // init code:
        
    function main() {
            
    // normally more would be put here, but this is an example
            // for learning sake.
            
    exampleFunc();
            
    alert("application has terminated.");
        }

        
    // support code:
        
    function exampleFunc() {
            
    alert(myGlobal1.value);
        }

        
    // invoke init and execution if ready:
        
    if(myGlobal1){
              
    main();
         } else {
              return 
    setTimeout(wrapper);
         }

         
    //optional, publish main() for partial page refreshes to re-init this app:     
         
    self.main main;
    }()); 
    // end wrapper() 
    to me, that code is much less terse, more stable, and has a good self-narrative instead of a formal introduction.
    Last edited by rnd me; 02-11-2013 at 02:04 AM.
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/9/03) IE7:0.1, IE8:4.6, IE11:9.1, IE9:3.1, IE10:3.0, FF:17.2, CH:46, SF:11.4, NON-MOUSE:38%


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •