CodingForums.com - JS++ cool idea and technique!

Page 1 of 2

Show 40 post(s) from this thread on one page

CodingForums.com (http://www.codingforums.com/index.php)

- Post a JavaScript (http://www.codingforums.com/forumdisplay.php?f=19)

- - JS++ cool idea and technique! (http://www.codingforums.com/showthread.php?t=287296)

boyo1991

02-08-2013 06:17 AM

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.

niralsoni

02-08-2013 11:19 AM

Doesn't makes any sense.

boyo1991

02-08-2013 07:01 PM

thats fine, im just putting it here in case people do see it...

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

Alex Vincent

02-08-2013 07:03 PM

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.

boyo1991

02-08-2013 07:08 PM

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!

felgall

02-08-2013 07:35 PM

Quote:

Originally Posted by boyo1991 (Post 1312036)

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.

boyo1991

02-08-2013 07:59 PM

Quote:

Originally Posted by felgall (Post 1312042)

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!

rnd me

02-08-2013 08:55 PM

for the code shown, in modern browsers,

Code:

var myGlobal1 = document.getElementById('myGlobal1');

is the same as

Code:

...

felgall

02-08-2013 10:43 PM

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.

boyo1991

02-08-2013 11:26 PM

Quote:

Originally Posted by felgall (Post 1312084)

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

felgall

02-08-2013 11:40 PM

Quote:

Originally Posted by boyo1991 (Post 1312092)

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 (Post 1312092)

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.

boyo1991

02-09-2013 12:55 AM

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..

felgall

02-09-2013 03:13 AM

Quote:

Originally Posted by boyo1991 (Post 1312099)

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?

boyo1991

02-10-2013 11:51 PM

Quote:

Originally Posted by felgall (Post 1312128)

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..

rnd me

02-11-2013 01:48 AM

Quote:

Originally Posted by felgall (Post 1312094)

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.

All times are GMT +1. The time now is 10:59 AM.

Page 1 of 2

Show 40 post(s) from this thread on one page