Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Вопрос по объектам и DOM (https://javascript.ru/forum/events/1225-vopros-po-obektam-i-dom.html)

Hawk 14.05.2008 11:49

Вопрос по объектам и DOM
 
function button(el) {
level = this;
this.el = el;
this.buttonGet = document.createElement("input");
this.buttonGet.type = "button";
this.buttonGet.value = "MyButton";
this.buttonGet.modelObj = this;
this.buttonGet.onclick = this.ButGetClick;
document.documentElement.appendChild(this.buttonGe t);
}
button.prototype.ButGetClick = function() {
alert(level.el);
}
var but1 = new button("a1");

var but2 = new button("a2");

Такой вопрос:
При нажатии на кнопку мы всегда будем видеть вылетающее окошко с a2, как сделать чтобы каждая кнопка работала со своим объектом, т.е. жмем на первую кнопку выскакиевает а1, на вторую а2.

и еще маленький вопросик правильно ли используется переменная level, или как то можно сделать по другому, более красиво?

Заранее спасибо, а так же спасибо автарам проекта за возможность создавать темы без регистрации.

Dmitry A. Soshnikov 14.05.2008 12:40

Hawk, level попадает в глобальную область видимости (становится свойством объекта window), поскольку объявлена внутри функции без var. Таким образом, при создании первого объекта (а1), level ссылается на but1, при создании второго (а2), level "перезатирается" объектом but2. В функции ButGetClick анализируется эта переменная (level), которая имеет последнее присвоенное значение (т.е. значение ссылки this второго объекта).

Не понятно, зачем вообще нужен этот level? this внутри ButGetClick будет ссылаться не на объект "класса" button, а на созданную кнопку (поскольку есть присваивание this.buttonGet.onclick = this.ButGetClick;. Подробней о работе this можно почитать здесь - http://javascript.ru/tutorial/object/thiskeyword)

Поэтому можно, либо 1) поместить el в this.buttonGet:

this.buttonGet.el = el;


И тогда в ButGetClick:

алерт(this.el);


- либо 2) создать замыкание (подробней - здесь - http://javascript.ru/tutorial/basic/closure):

this.el = el;
var thisObj = this;
this.buttonGet.onclick = function() {
  alert(thisObj.el);
};


но тогда для каждого нового объекта будет создана своя функция, а это совсем не оптимально (так что, подобного способа лучше избегать - если семантика метода одинаковая, его нужно выносить в прототип, поэтому больше подойдет первый способ)

- либо 3) - заbind'ить метод на нужный this (посмотреть пример можно, например, в библиотеке Prototype.js), но и здесь будет создана новая функция.

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

Hawk 14.05.2008 14:56

Большое спасибо за ответ, это был пример из кода, решив который я смог двигаться дальше:)
Но возник другой вопрос, нужно сделать ссылку которая будет вызывать метод объекта, делаю такую:
"javascript:"+objName+".showXML();"
Создав 2 ссылки на 2 объекта, жму на первую срабатывает первый объект, жму на вторую второй, а потом всегда срабатывает второй...
Подскажите пожалуйсто как создать ссылку чтобы она ссылалась на нужный объект?

Hawk 14.05.2008 15:04

Вопрос не корректен я сам ошибся, извините(как удалять не нашел:( )!


Часовой пояс GMT +3, время: 20:51.