Self-Invoking Functions and PB

[proseth]

Is there a downside to doing something like this:

<script>
<!--
(function (e) {
if (e && !e.thread && e.message && e.message.value == "")
e.message.value = "abc";
})(document.postForm);
//-->
</script>

or

<script>
(function () {
   for (l = 0; l < e.length; l++) {
       if (e.item(l).width == "92%") {
           e.item(l).width = "700";
       }
   }
})(document.getElementsByTagName("TABLE"));
</script>

Or a better way to do this? It seems easier, slower, and more efficent, but I'm guessing there is a drawback or a better way to do this.

[Charles Stover]

Why are you using a function in the first place?

<script type="text/javascript"><!--
if (
    typeof(document.postForm) != "undefined" &&
    typeof(document.postForm.thread) == "undefined" &&
    typeof(document.postForm.message) != "undefined" &&
    document.postForm.message.value == ""
)
    document.postForm.message.value = "abc";
//--></script>

<script type="text/javascript"><!--
var tables = document.getElementsByTagName("table"), x;
for (x = 0; x < tables.length; x++)
{
    if (tables.item(x).getAttribute("width") == "92%")
        tables.item(x).setAttribute("width", "700");
}
//--></script>

[proseth]

A few questions for you:

1) There's no downside to using a function, is there? It's definitely not necessary but passing data as an parameter shortened the code quite a bit.

2) Is there any benefits of using typeof in the conditional rather than just checking for the object? It seems like it just lengthens a code while both work fine cross-browser.

3) Is there a reason for using the item method rather than square bracket notation for selecting a level of an array? Or is that preference as well. I can find some documentation on the item method but it's hard to find anything on square bracket notation.

[Charles Stover]

You can always shorthand it anyway:
var e = document.postForm;

I'm not sure if functions take longer to parse than pure code. I'd speculate yes, since it has to create the function on top of everything else, but it would only be milliseconds. Regardless, it takes more code to use a function (because you have the extra parenthesis and "function(e)") than to just use pure code.

Probably no benefits. I think all browsers work with if (variable) to check if it exists; I just don't think that's a JavaScript standard. The only time you would need typeof is when checking an array that may not exist, e.g.
if (typeof(array[key]) == "undefined")
If array doesn't exist, then doing:
if (array[key]) will give you an error.

EDIT:
On second thought, I think typeof() would give an error in the event array doesn't exist also... Nonetheless, it is guaranteed to work now, in the future, and any version of JavaScript a browser is running. Whereas, unless if(variable) is a standard I'm not aware of, it really depends on the browser.

An array (var my_array = ["values", "in", "array"] should have square brackets. A list of HTML objects (var cells = document.getElementsByTagName("td") should use item().

[wildgoosespeeder]

Yeah, I never got the point of this because removing the function parts of the code works anyway... is there really a point? Maybe Eton Bones knows because he's a coding god.

[James [a_leon]]

Nov 28, 2010 15:10:03 GMT -8 wildgoosespeeder said:

Yeah, I never got the point of this because removing the function parts of the code works anyway... is there really a point? Maybe Eton Bones knows because he's a coding god.

If I had to guess, I'd say it's something to slow it down a little... perhaps to let the DOM load just that little bit more if you're running into errors? Otherwise, my only other thought is simply just to have no "floating" code, everything is contained in a function/objection (so perhaps a part of OOP).

[Jordan]

Nov 28, 2010 15:10:03 GMT -8 wildgoosespeeder said:

Yeah, I never got the point of this because removing the function parts of the code works anyway... is there really a point? Maybe Eton Bones knows because he's a coding god.

Nov 29, 2010 11:46:47 GMT -8 James [a_leon] said:

Nov 28, 2010 15:10:03 GMT -8 wildgoosespeeder said:

Yeah, I never got the point of this because removing the function parts of the code works anyway... is there really a point? Maybe Eton Bones knows because he's a coding god.

If I had to guess, I'd say it's something to slow it down a little... perhaps to let the DOM load just that little bit more if you're running into errors? Otherwise, my only other thought is simply just to have no "floating" code, everything is contained in a function/objection (so perhaps a part of OOP).

I believe the reason why Eton Bones uses self invoking functions is for variable scope. Any variables not inside a function become global which is why it's a good idea to use functions in general with Javascript, especially on Proboards. The reason for using a self invoking function rather than a named function is because you don't have to worry about naming conflicts and the function just automatically executes so you don't have to do functionName(). It's basically letting you write your code in a local scope without having to give it a function name since you know you're not going to call it later.

I don't think calling a function one time is going to take up much more time than if you had just written the code directly into the page. It is the year 2010 and we are talking about web pages. Saving one or two milliseconds does not matter unless you are in a loop that is executing over and over again like in a game. Then saving those milliseconds would matter.

"In an effort to protect the global object, all JavaScript applications should be written within a self-invoking function. This will create an application scope in which variables can be created without the fear of them colliding with other applications.

If a global variable is needed, developers must take the extra step by setting them directly within the window object. For example window.foo = ‘bar’;.

Self-invocation is a fundamental pattern of professional JavaScript development. Nearly every pattern in this weeks catalog uses it as a base to create scope, closure, or to configure cross-platform objects on-the-fly." - 2007-2010.lovemikeg.com/2008/08/17/a-week-in-javascript-patterns-self-invocation/

Nov 27, 2010 14:45:25 GMT -8 @proseth said:

3) Is there a reason for using the item method rather than square bracket notation for selecting a level of an array? Or is that preference as well. I can find some documentation on the item method but it's hard to find anything on square bracket notation.

In C++ it's called the subscript operator so try searching for that.

[Charles Stover]

Nov 30, 2010 16:13:20 GMT -8 Jordan said:

I believe the reason why Eton Bones uses self invoking functions is for variable scope. Any variables not inside a function become global which is why it's a good idea to use functions in general with Javascript, especially on Proboards. The reason for using a self invoking function rather than a named function is because you don't have to worry about naming conflicts and the function just automatically executes so you don't have to do functionName(). It's basically letting you write your code in a local scope without having to give it a function name since you know you're not going to call it later.

I don't think calling a function one time is going to take up much more time than if you had just written the code directly into the page. It is the year 2010 and we are talking about web pages. Saving one or two milliseconds does not matter unless you are in a loop that is executing over and over again like in a game. Then saving those milliseconds would matter.

Tell that to Yahoo and Google.

But I imagine in the event where not using global variables (good point) is necessary, the milliseconds used would be an acceptable trade-off. For just average code, I imagine the time used in milliseconds plus the time used downloading the extra characters minus the readability removes all use for it.

[Jordan]

Nov 30, 2010 20:10:54 GMT -8 Charles Stover said:

Nov 30, 2010 16:13:20 GMT -8 Jordan said:

I believe the reason why Eton Bones uses self invoking functions is for variable scope. Any variables not inside a function become global which is why it's a good idea to use functions in general with Javascript, especially on Proboards. The reason for using a self invoking function rather than a named function is because you don't have to worry about naming conflicts and the function just automatically executes so you don't have to do functionName(). It's basically letting you write your code in a local scope without having to give it a function name since you know you're not going to call it later.

I don't think calling a function one time is going to take up much more time than if you had just written the code directly into the page. It is the year 2010 and we are talking about web pages. Saving one or two milliseconds does not matter unless you are in a loop that is executing over and over again like in a game. Then saving those milliseconds would matter.

Tell that to Yahoo and Google.

But I imagine in the event where not using global variables (good point) is necessary, the milliseconds used would be an acceptable trade-off. For just average code, I imagine the time used in milliseconds plus the time used downloading the extra characters minus the readability removes all use for it.

Just because they do it doesn't mean it's the proper way, plus they are the only ones writing their code so it's not really a big deal. By the way, when I say "proper" I don't mean it's the absolute best way, I basically just mean that it's the safest and standard way of doing it. It's a good idea on a site like Proboards since you have codes coming from many different websites written by many different coders, and there's also external files for advertisements. If Javascript variables had data types people would be having a lot more problems since something like var a = 0 and var a = "asdf" would be illegal. Thankfully we can all get by with that, but it's still a bad practice. It makes more sense in programming languages since there are usually more coders involved with a lot more code and so encapsulation becomes much more important.

[proseth]

Thanks Jordan. I've known about variable scope and that self-invoking functions are a way to take advantage of it. I'll probably start using the self-invoking functions for codes that I'm going to distribute just for that reason. I don't think that an infinitesimally lengthier load time outweighs the use of auto-invoking functions.

Also thanks Charles and everyone else who answered.

[Charles Stover]

Dec 1, 2010 12:23:25 GMT -8 Jordan said:

Nov 30, 2010 20:10:54 GMT -8 Charles Stover said:

Tell that to Yahoo and Google.

But I imagine in the event where not using global variables (good point) is necessary, the milliseconds used would be an acceptable trade-off. For just average code, I imagine the time used in milliseconds plus the time used downloading the extra characters minus the readability removes all use for it.

Just because they do it doesn't mean it's the proper way, plus they are the only ones writing their code so it's not really a big deal. By the way, when I say "proper" I don't mean it's the absolute best way, I basically just mean that it's the safest and standard way of doing it. It's a good idea on a site like Proboards since you have codes coming from many different websites written by many different coders, and there's also external files for advertisements. If Javascript variables had data types people would be having a lot more problems since something like var a = 0 and var a = "asdf" would be illegal. Thankfully we can all get by with that, but it's still a bad practice. It makes more sense in programming languages since there are usually more coders involved with a lot more code and so encapsulation becomes much more important.

So people should use self-invoking functions because it would make sense if JavaScript variables had data types, even though JavaScript variables don't have data types?

Okay.

[Jordan]

Dec 1, 2010 15:36:06 GMT -8 Charles Stover said:

Dec 1, 2010 12:23:25 GMT -8 Jordan said:

Just because they do it doesn't mean it's the proper way, plus they are the only ones writing their code so it's not really a big deal. By the way, when I say "proper" I don't mean it's the absolute best way, I basically just mean that it's the safest and standard way of doing it. It's a good idea on a site like Proboards since you have codes coming from many different websites written by many different coders, and there's also external files for advertisements. If Javascript variables had data types people would be having a lot more problems since something like var a = 0 and var a = "asdf" would be illegal. Thankfully we can all get by with that, but it's still a bad practice. It makes more sense in programming languages since there are usually more coders involved with a lot more code and so encapsulation becomes much more important.

So people should use self-invoking functions because it would make sense if JavaScript variables had data types, even though JavaScript variables don't have data types?

Okay.

Read about encapsulation and you'll understand what I'm saying. Everything becomes a global variable which is not good, and, to be honest, a lot of my codes on here are like that. It's not as crucial in Javascript as it is in other languages, but it can prevent conflicts between codes so it's just a good practice. Worrying about speeds usually isn't a problem in Javascript, but obviously you should keep your algorithms efficient because that's where the speed is really affected. I'd also like to point out after looking at the source that Google and Yahoo are using self invoking functions as well as the global window object or some sort of global object.

[Charles Stover]

It would make sense if you wanted your variables private (it would be simpler and faster than an object), but in the event it doesn't matter (e.g. the "remove Welcome, X" ProBoards code; or variables that only contain basic information), there's no real reason to use it.

The only time I can imagine variables erroneously changing mid-code is when it runs on a timer, in which case you'd need a named function instead of a self-invoking one anyway.

Most scripts don't need private variables anyway, especially since most variables are never used again post-execution.

[James [a_leon]]

Dec 2, 2010 11:15:05 GMT -8 Charles Stover said:

Most scripts don't need private variables anyway, especially since most variables are never used again post-execution.

Especially when you figure that any code using the same variable name will be redefining it anyway.

[Jordan]

Dec 2, 2010 11:15:05 GMT -8 Charles Stover said:

It would make sense if you wanted your variables private (it would be simpler and faster than an object), but in the event it doesn't matter (e.g. the "remove Welcome, X" ProBoards code; or variables that only contain basic information), there's no real reason to use it.

The only time I can imagine variables erroneously changing mid-code is when it runs on a timer, in which case you'd need a named function instead of a self-invoking one anyway.

Most scripts don't need private variables anyway, especially since most variables are never used again post-execution.

Dec 2, 2010 12:10:49 GMT -8 James [a_leon] said:

Dec 2, 2010 11:15:05 GMT -8 Charles Stover said:

Most scripts don't need private variables anyway, especially since most variables are never used again post-execution.

Especially when you figure that any code using the same variable name will be redefining it anyway.

It all works fine, I'm just saying that it's a good practice to have variable scope. I've had this kind of stuff pounded into my head at university so it just feels wrong to not do it.