Path: csiph.com!usenet.pasdenom.info!news.albasani.net!weretis.net!feeder1.news.weretis.net!news.solani.org!.POSTED!not-for-mail From: Thomas 'PointedEars' Lahn Newsgroups: comp.lang.javascript Subject: Re: eventDispath how that work Date: Wed, 15 Oct 2014 23:02:45 +0200 Organization: PointedEars Software (PES) Lines: 144 Message-ID: <1695306.Qhb0f9IOXP@PointedEars.de> References: <16yzpmtikrwk0$.1schjt968gcx$.dlg@40tude.net> <1791221.7QuZn8ShVB@PointedEars.de> <14ignx5l3afjk.j09ycbpj6e7h.dlg@40tude.net> Reply-To: Thomas 'PointedEars' Lahn Mime-Version: 1.0 Content-Type: text/plain; charset="UTF-8" Content-Transfer-Encoding: 8Bit X-Trace: solani.org 1413406967 28127 eJwFwYEBwCAIA7CXZNBqz0GB/09YAqfx7SAYGMxN3i0deYY3ET6ncrmFqspaMtiXi8OHaP0U2xC0 (15 Oct 2014 21:02:47 GMT) X-Complaints-To: abuse@news.solani.org NNTP-Posting-Date: Wed, 15 Oct 2014 21:02:47 +0000 (UTC) User-Agent: KNode/4.14.1 X-User-ID: eJwNyMEBwCAIA8CVQEnAcQrI/iPYex42leVG0DAYRxHqR8ixwH+aXMiMZSMc9wihQruuqFlW9b2HezK/kn4ktxU6 Cancel-Lock: sha1:e9SOZC+6hQZ4FVOXWgQOgd8+F7g= X-NNTP-Posting-Host: eJwFwYEBwCAIA7CXdFCw56CU/09YAosdLz0QjsFYTuez4lX7I1WHsGCnNjlLl8P1Teu4SvgBL5MR8Q== Xref: csiph.com comp.lang.javascript:25914 JJ wrote: > On Wed, 15 Oct 2014 15:24:48 +0200, Thomas 'PointedEars' Lahn wrote: >>> e = document.querySelector("#elem"); >> >> Avoid this newer, less compatible, less efficient pattern, and replace it >> with >> >> e = document.getElementById("elem"); > > Well, in this case getElementById() would be much more efficient. AISB. >> You also need to declare “e”. Otherwise – often discussed here before – >> the code will not run in strict mode and will cause side-effects in >> non-strict mode: >> >> var e; >> >> Declaration and initialization can be combined: >> >> var e = document.getElementById("elem"); > > Since my code was meant to be placed within sendTest(), i.e.: > > function sendTest(e) { > console.log("sendTest(e) e:"); > console.dir(e); > event = new CustomEvent('build', { 'detail': e.target.dataset.date > }); > > e = document.querySelector("#elem"); > e.dispatchEvent(event); > } > > This is fine I presume? No, given just this code, “event” is neither declared a variable in sendTest(), nor is it the identifier of a formal parameter. It would therefore refer to the “event” property of the next object in the scope chain that has it, it would be considered an attempt to augment the global object with an “event” property in non-strict mode, or, because no object in the scope chain had such a property, it would throw a ReferenceError exception in strict mode. You would probably see a kind of runtime error caused by the inability to overwrite a property of a host object in MSHTML-based runtime environments (e.g., Internet Explorer), and a ReferenceError exception in strict mode elsewhere. Also, one should avoid reusing formal parameters as if they were local variables. In this case, there is the additional caveat of accessing host objects in perhaps unforeseen ways: “e” would refer to one, an event object (as indicated by “e.target”; I am not sure about any browser-based host object having a built-in “dataset” property either, so there is potentially an unforeseen *write* access to avoid before). Incidentally, at work today I encountered, essentially, this piece of code written by someone else: if (window.toString.call(…) == "[object Array]") { // … } (Obviously an attempt to detect whether an value would be a reference to an Array instance, which is in many cases a misguided one [see “duck typing” for details].) It failed reproducibly in Internet Explorer 8 (with the infamous “error code 0”) on Windows XP¹ because there was no “window.toString”, and that caused *other* code (a progress indicator) to not function (a JScript/MSHTML peculiarity). For now, I can see three possible explanations how this code came about (I will investigate this tomorrow morning): A. Someone declared a global “toString” function or variable, and attempted to access the global object through “window”. B. Someone attempted to assign a reference to a Function instance to a previously non-existing “toString” property of the object referred to by “window”. C. Someone thought “window” would refer to the native ECMAScript global object and would therefore have a built-in “toString” method. Either way, that someone *must* have been unaware² that the (*host-defined*) “window” property (of the ECMAScript global object) does _not_, in general, refer to the ECMAScript global object, but to a *host* object that already has properties (some with setters), and neither needs to admit augmentation nor does it need to inherit native methods like Object.prototype.toString(). ______ ¹ the oldest version we need to support for this application ² probably blissfully, likely through bad books and/or bad tutorials like w3schools.com > Cause Non sequitur. > AFAIK, the x variables of these two functions are both local. > > function f1() { > var x; > x = 1; > } > function f2(x) { > x = 1; //this won't refer to any scope-inherited x variable > } Correct, except that the latter “x” is the identifier of a formal parameter, _not_ a local variable. > Or is there a potential problem with this? Only that these examples do not fully apply to sendTest(). >> (Likewise, when you are tempted to write >> >> document.querySelector(".foo") >> >> then write >> >> document.getElementsByClassName("foo") Correction: The latter would be equivalent to document.querySelectorAll(".foo") Instead, document.getElementsByClassName("foo")[0] would be equivalent to the former, provided that the method returned a reference to an object implementing the NodeList or HTMLCollection interface (which would need to be tested before the “0” property read access). -- PointedEars FAQ: | SVN: Twitter: @PointedEars2 | ES Matrix: Please do not Cc: me. / Bitte keine Kopien per E-Mail.