Faisal Vali wrote:
Hi - I'm new to javascript and I was reading the book
Javascript Professional Projects - there is a fragment
that has me a little perplexed, and I was wondering if
anyone could explain why and how it works.
How is it that setting a property to null alters another
property?
For example setting
optionObject.options[optionObject.selectedIndex] = null;
seems to set optionObject.selectedIndex to -1 automagically.
There was once a time when the browser's object model and JavaScript(tm)
where virtually the same thing. Standardisation has acted to separate
the two, and we now have a core language (specified by ECMA 262 3rd
Edition), vendor specific extensions to that language, and the object
model provided by the host of the scripts. This allows a standardised
javascript to be used for scripting more types of host than just web
browser (such as PhotoShop from version 7).
Assuming the above - optionObject - is a reference to the DOM
representation of an HTML SELECT element (which is necessary to explain
the phenomenon described) the behaviour of the object when it is
modified is not determined by javascript at all. It is what is
classified as a "host object", and so is not part of the language.
For the DOM representation of a SELECT element (without the MULTIPLT
attribute) the - selectedIndex - property is the index value of the
currently selected OPTION element. The act of assigning - null - to a
member of the SELECT element's - options - collection is to remove that
OPTION element from the SELECT element. And if you remove the currently
selected OPTION element it can no longer be the currently selected
OPTION element, so the - selectedIndex - property of the SELECT element
must be changed.
As an OPTION element should not become selected unless the user selects
it the - selected Index - property must be set to a value that is not an
index of an OPTION element, and one that can be used to signal to
scripts that no OPTION element is selected. The value of -1 is used for
that purpose.
Can you attach "hooks" in javascript that get called
whenever a property is modified?
<snip>
In the standardised core of javascript you cannot. As a result it is
extremely unlikely that cross-browser code would ever attempt to do so.
However, some implementations have a - watch - extension that could be
used in that way, and the JavaScript(tm) implementation has -
__defineGetter__ - and - __defineSetter__ - extension that can allow
code to react to property changes. JScritp in IE has none of these, but
some of the IE browser's host objects support an - onpropertychange -
event handler that can be triggered by some property changes.
For pure javascript objects it is possible to adopt a design pattern
that provides 'setter' functions and insists that they are exclusively
used to set the values of properties. This allows side-effect code to be
triggered in response to changes in those property values, and it is
possible to then implement event handlers on javascript objects and have
them triggered by the side-effect code in the 'setters'.
Richard.