That is also two global objects, that is true; but I didn't write that code and as such can't really provide a rationale for it. I'm learning JavaScript at the moment - trying to learn it properly, following best practices, etc. - and something that the experts are unanimous on is that using putting things straight into the global namespace is usually a very bad idea indeed. It may be unlikely, but a situation where an imported library clashed with one of your own functions would lead to unpredictable behaviour and would be quite difficult to debug. Hence my wrapping both variable and function in an object.
At the risk of overcomplicating things, one could take it a step further by use of a closure:
HTML Code:
<html><script>
var Flag = (function() {
var myFlag = false;
function setFlag(state) {
myFlag = state;
}
return {
falseFlag : function() {
setFlag(false);
},
trueFlag: function() {
setFlag(true);
},
value: function() {
return myFlag;
}
}
})(); // the pair of brackets at the end are very important
document.writeln(Flag.value()+'<br />');
Flag.trueFlag();
document.writeln(Flag.value()+'<br />');
Flag.falseFlag();
document.writeln(Flag.value()+'<br />');
</script>
Using the above code, the flag variable within the function can only be accessed using the function, virtually guaranteeing that no accidental code cross-contamination can occur. Although that's probably overkill for this scenario.
<script type="text/javascript">
function myFlag( state )
{
var cp = this.constructor.prototype;
if( state !== undefined )
cp.flag = !!state;
return cp.flag;
}
alert( myFlag() ); // not yet set ( undefined )
myFlag( true ); // set the flag
alert( myFlag() ); // no parameter returns last set value
myFlag( false );
alert( myFlag() );
</script>
Where used, return should be executed unconditionally and always as the last statement in the function.
That's my signature, it's not part of the damn post!
<script type="text/javascript">
function myFlag( state )
{
var cp = this.constructor.prototype;
if( state !== undefined )
cp.flag = !!state;
return cp.flag;
}
alert( myFlag() ); // not yet set ( undefined )
myFlag( true ); // set the flag
alert( myFlag() ); // no parameter returns last set value
myFlag( false );
alert( myFlag() );
</script>
That is pretty neat! If I'm counting correctly, that is only one global variable created by the JS.
Could you verify my understanding of what is going on...
1. After the call to the myFlag() function, first a local variable 'cp' is created as a prototype of the myflag() function.
[Question: Is 'cp' a local variable or is it global because of the .constructor.prototype command?}
My assumption here is that the 'cp' variable already has been created for this prototype and is available to be checked
OR it has not been previously created and the cp assignment is undefined
2. If the argument (true or false) of the myFlag() function does not exist, then an prototype variable (cp.flag) is created as undefined.
If the argument (true or false) does exist, then cp.flag is initialized to something (true or false) from the argument passed.
Now the cp.flag has been created, either with a value of undefined or true/false.
3. The the status of cp.flag is returned from the myFlag() function.
It is a bit confusing, but is this anywhere close to what is actually being done or have I got it backwards somewhere?
I modified it just a bit to make sure I could understand how it is used...
Code:
<!doctype html>
<html>
<head>
<title> Boolean prototype </title>
<script type="text/javascript">
function myFlag( state ) {
var cp = this.constructor.prototype;
if( state !== undefined ) cp.flag = !!state;
return cp.flag;
}
</script>
</head>
<body>
<h1> Boolean Prototype </h1>
<button onclick="alert(myFlag())">Current Status</button>
<button onclick="myFlag(true)">Set Status TRUE</button>
<button onclick="myFlag(false)">Set Status FALSE</button>
</body>
</html>
Now that you have really blown my mind, could you explain how this new element in post #12 works?
Or how it differs from my earlier analysis in post #11?
Now that you have really blown my mind, could you explain how this new element in post #12 works?
Or how it differs from my earlier analysis in post #11?
He's pointing to tgis ...
Code:
function myFlag( state ){
var cp = this.constructor.prototype;
alert(this===window)
if( state !== undefined )
cp.flag = !!state;
return cp.flag;
}
alert( myFlag() ); // not yet set ( undefined )
could you explain how this new element in post #12 works?
Well the idea was to create an instance from an anonymous constructor and save a reference to its member function, but even that is unnecessarily complicated when a simple closure can do the same job.
Code:
myFlag = ( function()
{
var flag = undefined;
return function( state )
{
if( state !== undefined )
flag = !!state;
return flag;
}
})();
alert( myFlag() ) // undefined
myFlag( true )
alert( myFlag() ) // true
myFlag( false )
alert( myFlag() ) // false
Where used, return should be executed unconditionally and always as the last statement in the function.
That's my signature, it's not part of the damn post!
Reply With Quote
Originally Posted by JMRKER
Bookmarks