Почему объекты js так себя ведут?

Question

[Александр Маджугин]

Даже не знаю как сформулировать вопрос...
Я только начал изучать js и много не знаю, поэтому извиняюсь если спрашиваю банальность.

Пример:

<div id="obj1">1</div>
<div id="obj2">2</div>

$(document).ready(function() {
	new MyFunction($('#obj1'));
	new MyFunction($('#obj2'));
});

var MyFunction = function (obj) {
	this.obj.objDOM = obj;
	this.objDirect = obj;
	
	var ths = this;
	this.obj.objDOM.on('click', function(){ths.func();})
	
}

MyFunction.prototype = {
	obj: {objDOM:{}},
	objDirect: {},
	func: function () {
		console.log(this.objDirect.attr('id')+':'+this.obj.objDOM.attr('id'))
	}
};

И что мы получим в консоли при клике сначала по 2, а потом по 1?
Правильный ответ:

"obj2:obj2"
"obj1:obj2"

Но какого дьявола?

Почему создание второго объекта изменило прототип?

Answer 1

[rmaksim]

потому что obj заданный в MyFunction.prototype.obj - не меняется
меняется свойство obj -> this.obj.objDOM = obj;
соотв при втором вызове затираем то что было записано при первом
можно записать вот так (если не противоречит вашей задумке)

var MyFunction = function (obj) {
  this.obj = { objDOM: obj }
  ...
}
MyFunction.prototype = {
  objDirect: {},
  ...
};

Comments

[Александр Маджугин]

Ну да, я примерно так и сделал. Я в прототип добавил сеттеры для объектов свойств типа:
func2: function (obj) {
var rr = {
objDOM: obj,
}
this.obj = rr;
}

С сеттером мне показалось аккуратнее.
Задумке не противоречит, но я таким поведением был удивлен и поставлен в тупик почти на пару часов...

Где-то можно про это подробнее почитать? Я просто даже что гуглить не пойму - все время попадают на наследование прототипов от прототипов...

[rmaksim]

Александр Маджугин: javascript.ru/tutorial/object/inheritance#metody-obekta
чуть ниже пример про хомяка )

[Александр Маджугин]

rmaksim: ага, спасибо!

[Александр Маджугин]

rmaksim: Прочитал на свежую голову - да, теперь гораздо понятнее. Еще раз, спасибо.

Answer 2

[dtestyk]

лучше спросите почему не изменило: jsfiddle
objDirect переопределяется у самого объекта: такой полимофизм
objDirect прототипа остается нетронутым

obj не переопределяется, поэтому берется из прототипа

обычно данные в прототипах не хранят:

this.obj = {objDOM:{}}
this.objDirect = {}

Comments

[Александр Маджугин]

Ну тут более менее понятное и ожидаемое поведение. Спасибо за пример.