[lnkForumImage]
TotalShareware - Download Free Software
Confronta i prezzi di migliaia di prodotti.
Asp Forum
 Home | Login | Register | Search 


 

Forums >

comp.lang.javascript

Adding data to a function

ram

5/2/2016 9:39:00 PM

The following function always would recompute
»window.document.getElementById( "info" )«.

"use strict";

function f()
{ window.document.getElementById( "info" ).innerHTML
= 'The function "f" was called.'; }

Is it good style to attach this data to f as a property of f,
so that it does not have to be recomputed each time f is
being called, i.e.:

"use strict";

function f()
{ f.info.innerHTML
= 'The function "f" was called.'; }
f.info = document.getElementById( "info" );

?
3 Answers

Evertjan.

5/2/2016 10:06:00 PM

0

ram@zedat.fu-berlin.de (Stefan Ram) wrote on 02 May 2016 in
comp.lang.javascript:

> The following function always would recompute
> ¯window.document.getElementById( "info" )®.
>
> "use strict";
>
> function f()
> { window.document.getElementById( "info" ).innerHTML
> = 'The function "f" was called.'; }
>
> Is it good style to attach this data to f as a property of f,
> so that it does not have to be recomputed each time f is
> being called, i.e.: [....]

Methinks "Is it good style to ... ?"
is not a good question,
as it calls for subjective preferences
like "is this a beautiful painting?"

You could ask:
"Is it clearer scripting sourcecode for newbees?"
or
"Does this involve less cpu-time?"

Methinks, the clearer code Q is important, sometimes.

The cpu-time consumption is not, as:

- how many times would you want an innerHTML to change per second?

- the difference in fetching a DOM-pointer from a DOM id-array or as an
object-property [or even as a simple variable] will not matter much imho,
but you could try to measure that for different browsers, if you like.

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

Aleksandro

5/2/2016 11:31:00 PM

0

On 02/05/16 18:39, Stefan Ram wrote:
> The following function always would recompute
> »window.document.getElementById( "info" )«.
>
> "use strict";
>
> function f()
> { window.document.getElementById( "info" ).innerHTML
> = 'The function "f" was called.'; }
>
> Is it good style to attach this data to f as a property of f,
> so that it does not have to be recomputed each time f is
> being called, i.e.:
>
> "use strict";
>
> function f()
> { f.info.innerHTML
> = 'The function "f" was called.'; }
> f.info = document.getElementById( "info" );
>
> ?

If the object is ever destroyed and a new one with the same ID appears,
your function will never see it.

Thomas 'PointedEars' Lahn

5/3/2016 5:08:00 PM

0

Stefan Ram wrote:

> The following function always would recompute
> »window.document.getElementById( "info" )«.
>
> "use strict";
>
> function f()
> { window.document.getElementById( "info" ).innerHTML
> = 'The function "f" was called.'; }
>
> Is it good style to attach this data to f as a property of f,
> so that it does not have to be recomputed each time f is
> being called, i.e.:
>
> "use strict";
>
> function f()
> { f.info.innerHTML
> = 'The function "f" was called.'; }
> f.info = document.getElementById( "info" );
>
> ?

You should avoid "use strict" in the global execution context because it
affects all subsequent code â?? even code that has not been written to run in
strict mode (you cannot undo "use strict" in local execution contexts).
JSHint warns you about that by default: â??W097: Use the function form of "use
strict".�) See <http://jshint.com/docs/options/#global... p. for
details.

That aside, whether the answer to your question should be â??yesâ? depends on
the use-case. By default, functions are extensible objects in ECMAScript
implementations, so there is, in theory, nothing wrong with extending them.

However, one should take care to avoid name collisions as they are objects
that already have and inherit properties. [To that end, my JSX provides
jsx.object.findNewProperty().]

Also, there is no possibility for a race condition only if the property
value is never written twice.

And you have to consider the possibility that the element was not in the
document tree when the code was first executed, or that the element had been
removed or replaced afterwards. A document.getElementById("â?¦") call always
works on the *current* document tree.

An alternative approach that is still rather efficient, with which name
collisions are minimized and race conditions avoided, is the module pattern:

var foo = (function (doc) {
"use strict";

/*
* The value assigned could also be one of a property
* of the object to which a reference is returned
*/
var info = doc.getElementById("info");

return {
bar: function (s) {
info.innerHTML = s;
}
};
}(document));

/* executed much later: */

foo.bar("baz");

A variant of this that tends to be more efficient is to initialize a
variable or property on first use:

var foo = (function (doc) {
"use strict";

/*
* The value assigned could also be one of a property
* of the object to which a reference is returned
*/
var info = null;

return {
bar: function (s) {
if (info === null) info = doc.getElementById("info");
if (info) info.innerHTML = s;
}
};
}(document));

Whether the assignment should only take place only if the base object can be
resolved depends on the use-case and is a matter for debate; the code runs
more smoothly with the test it, but as it is, without error handling, it
hides regressions. You would tend to test before assignment if you did not
know the markup well that you are working on; for example, you would
certainly test, and handle errors explicitly, in a browser extension, and in
a bookmarklet that is available to the general public.

--
PointedEars
FAQ: <http://PointedEars.... | SVN: <http://PointedEars.de...
Twitter: @PointedEars2 | ES Matrix: <http://PointedEars.de/es-...
Please do not cc me. / Bitte keine Kopien per E-Mail.