Порядок использования «это» для объекта ссылки

Question

В руководстве JavaScript на MDN Я нашел пример

<form name="myForm"> 
    <label>Form name:<input type="text" name="text1" value="Beluga"></label> 
    <input name="button1" type="button" value="Show Form Name" 
    onclick="this.form.text1.value = this.form.name"> 
</form> 

Когда мы кликаем <input> мы имеем эту странную обратную ссылку на его родителей (this.form...). Это кажется странным для меня, поскольку я всегда видел, используя ссылку на объект «упорядоченным» способом. Как свойство объекта (вход узла формы) относится к этому объекту таким образом (this.form)? Или я путаю объектно-ориентированное программирование с DOM-моделью?

Answer 1

Вы можете сделать это, потому что this внутри обработчика событий ссылается на элемент DOM (HTMLInputElement) для кнопки, и те DOM элементы имеют свойство, form, что относится к форме они (если они в одной). Именно так определяется DOM. (Не позволяйте этим ссылкам обманывать вас, это не новая вещь HTML5, так было на протяжении веков: Older HTMLInputElement spec.)

В древовидных структурах (DOM и др.), Это не редкость для листовых узлов имеют ссылку на их родителя (поскольку в дереве у них может быть только один родитель). Это просто расширение этой концепции.