javascript collections
in [JavaScript]
|
Prev: Canvas animations - what's up with the "Burst Engine"
Next: FAQ Topic - How do I run a server side script? (2010-07-05)
From: Garrett Smith on 4 Jul 2010 22:25 On 2010-07-04 06:54 PM, RobG wrote: > On Jul 5, 9:40 am, nick<nick...(a)fastmail.fm> wrote: >> On Jul 4, 12:42 pm, William Gill<nos...(a)domain.invalid> wrote: >> >>> I am working on a snippet and in my research I see that the options >>> property of the select object is a collection, not an array. I am >>> having great difficulty finding any good, comprehensive documentation on >>> javascript collections and their methods. Can anyone point me to a good >>> reference? >> >> What makes you call it a "collection?" > > Because in DOM 1 it was an HTML collection and in DOM 2 and HTML5 it > is an HTML options collection. See my earlier post. DOM 2 HTML defines HTMLOptionsCollection. http://www.w3.org/TR/DOM-Level-2-HTML/html.html#HTMLOptionsCollection Though stragely, there is no base Collection. It would be useful to have such object, and to have it specified as a native ECMAScript object in an ECMAScript way, so that it would be said to have [[Get]] and `length`. Garrett
From: nick on 5 Jul 2010 01:13 On Jul 4, 9:54 pm, RobG <rg...(a)iinet.net.au> wrote: > On Jul 5, 9:40 am, nick <nick...(a)fastmail.fm> wrote: >> On Jul 4, 12:42 pm, William Gill <nos...(a)domain.invalid> wrote: > >>> I am working on a snippet and in my research I see that the options >>> property of the select object is a collection, not an array [...] > >> What makes you call it a "collection?" > > Because in DOM 1 it was an HTML collection and in DOM 2 and HTML5 it > is an HTML options collection. See my earlier post. Ah, good to know. I don't really get the part about collections having a readonly length and option collections not having a readonly length but throwing an exception when messed with "if setting the length is not allowed by the implementation." Does that mean it's readonly in ie6 and not in everything else, or what? >> // get a collection of nodes >> var foo = document.getElementsByTagName('div'); > > That returns a NodeList, not a collection. As I noted in the comment you snipped. You're right, though, I naively assumed nodes were nodes and d.gebtn would give me the same type of things as myform.myselect.options, but it seems node collections are slightly beefed up versions of node lists. >> // what kind of object is "foo?" >> console.log(foo.constructor.prototype); > > Replacing console.log with alert in IE 6 returns "undefined". I didn't really expect ie6 to be useful here. What else would that show anyway? something like "[Object object]"? >> // --console output from previous line-- >> // >> // Object >> // constructor: function NodeList() { [native code] } >> // item: function item() { [native code] } >> // __proto__: Object > >> // so it's a NodeList. Looks like NodeList has a method named >> // "item," but not much else. > > Which is per the W3C specification. Good to know. > The above is an unreliable way of > determining that - browsers are notoriously bad at implementing the > finer points of specifications consistently. Try it in IE 6. I wasn't trying to determine whether chrome was doing things by specification, I just wanted to quickly see what it called the constructor and if it had any useful methods. Thanks for linking the relevant docs though. > Try it in IE 6. Maybe later... Don't have it handy. >> foo = [].slice.call(foo); >> // did it work? > > Maybe - in Firefox, yes. IE 6, no. Any Array method that requires > setting length (e.g. shift) will fail as it will try to set length, > which is readonly. foo=[].slice.call(foo) doesn't change the length of the collection or nodelist, so the resulting array 'foo' should have all Array.prototype properties including a mutable length property. Or am I missing something? -- Nick
From: RobG on 5 Jul 2010 02:06 On Jul 5, 3:13 pm, nick <nick...(a)fastmail.fm> wrote: > On Jul 4, 9:54 pm, RobG <rg...(a)iinet.net.au> wrote: > > > On Jul 5, 9:40 am, nick <nick...(a)fastmail.fm> wrote: > >> On Jul 4, 12:42 pm, William Gill <nos...(a)domain.invalid> wrote: > > >>> I am working on a snippet and in my research I see that the options > >>> property of the select object is a collection, not an array [...] > > >> What makes you call it a "collection?" > > > Because in DOM 1 it was an HTML collection and in DOM 2 and HTML5 it > > is an HTML options collection. See my earlier post. > > Ah, good to know. > > I don't really get the part about collections having a readonly length > and option collections not having a readonly length but throwing an > exception when messed with "if setting the length is not allowed by > the implementation." Does that mean it's readonly in ie6 and not in > everything else, or what? No. You can (reasonably confidently) delete options by reducing the collection's length attribute, but you can't do that for a table's rows collection. Maybe some browsers allow it, I've never tried, but it shouldn't work. [...] > >> // what kind of object is "foo?" > >> console.log(foo.constructor.prototype); > > > Replacing console.log with alert in IE 6 returns "undefined". > > I didn't really expect ie6 to be useful here. What else would that > show anyway? something like "[Object object]"? No, undefined is OK if it's undefined. [...] > > The above is an unreliable way of > > determining that - browsers are notoriously bad at implementing the > > finer points of specifications consistently. Try it in IE 6. > > I wasn't trying to determine whether chrome was doing things by > specification, I just wanted to quickly see what it called the > constructor and if it had any useful methods. Thanks for linking the > relevant docs though. The OP may have received the impression that this is how to go about detecting the types of things. I was just trying to point out that while it may work in some browsers, it doesn't in others. Such strategies are interesting to note, but should be tested (very) widely before being used generally. > > Try it in IE 6. > > Maybe later... Don't have it handy. It was rhetorical, I happen to have it handy but not later versions (corporate networks that specify IE 6 don't like to upset things by allowing later versions inside their ivory castle). > >> foo = [].slice.call(foo); > >> // did it work? > > > Maybe - in Firefox, yes. IE 6, no. Any Array method that requires > > setting length (e.g. shift) will fail as it will try to set length, > > which is readonly. > > foo=[].slice.call(foo) doesn't change the length of the collection or > nodelist, so the resulting array 'foo' should have all Array.prototype > properties including a mutable length property. Or am I missing > something? Possibly, just pointing out that because one method worked doesn't mean that they all will in that browser, or at all in others. What a wonderful world it would be if native Array methods could be used to manipulate the DOM and pop, shift, unshift, etc. could be used instead of appendChild, removeChild, etc. If DOM host objects behaved like native objects, if... -- Rob
From: Garrett Smith on 5 Jul 2010 03:25 On 2010-07-04 11:06 PM, RobG wrote: > On Jul 5, 3:13 pm, nick<nick...(a)fastmail.fm> wrote: >> On Jul 4, 9:54 pm, RobG<rg...(a)iinet.net.au> wrote: >> >>> On Jul 5, 9:40 am, nick<nick...(a)fastmail.fm> wrote: >>>> On Jul 4, 12:42 pm, William Gill<nos...(a)domain.invalid> wrote: >> [...] >>>> // what kind of object is "foo?" A program that is at a point where it must ask that question is in a bad situation. >>>> console.log(foo.constructor.prototype); >> >>> Replacing console.log with alert in IE 6 returns "undefined". >> Yep. Instead, it is (in general) better to ask: Can `foo` do what I want it to? It can blow up in certain cases, however, as: typeof foo.slice - was shown to *crash* safari 2. [...] >> >> foo=[].slice.call(foo) doesn't change the length of the collection or >> nodelist, so the resulting array 'foo' should have all Array.prototype >> properties including a mutable length property. Or am I missing >> something? > > Possibly, just pointing out that because one method worked doesn't > mean that they all will in that browser, or at all in others. > Array prototype methods used with a host object have implementation-dependent results. They throw errors in all versions of IE, though IE9 seems to have changed. A feature test for CAN_SLICE_HOST_OBJ might use a try/catch to see if the slice works and, from that, make a generalization that if a collection is sliceable, that all collections are sliceable. Whether or not that generalization gets lucky in IE9 has yet to be seen. Garrett
From: Gregor Kofler on 5 Jul 2010 04:14
Am 2010-07-05 02:27, RobG meinte: > On Jul 5, 5:58 am, Gregor Kofler<use...(a)gregorkofler.com> wrote: >> Am 2010-07-04 18:42, William Gill meinte: >> >>> I am working on a snippet and in my research I see that the options >>> property of the select object is a collection, not an array. >> >> You are looking for a NodeList. > > No, a collection. [details and links snipped] Thanks for pointing out all the details. Like nick I had assumed that nodelists and (HTML)Collections are equivalent (at least "collection" and "nodelist" is frequently used synonymously). Gregor (BTW: Your sig-seperator lacks a space.) -- http://www.gregorkofler.com |