Почему при доступе к одному и тому же объекту через this и с помощью jQuery по id возвращаются разные объекты?

Question

[big_hasan]

Дано: выпадающий список:

<select id="worker_name">
<option>Петя</option>
<option>Федя</option>
</select>

Задача: повесить на событие выбора пункта выпадающего списка change функцию, возвращающую индекс выбранного пункта. Ниже 2 способа:

function fillWorker ()
			{
				console.log($('#worker_name').selectedIndex+' select index');
				console.log(this.selectedIndex+' this select index');
			}
			
$("#worker_name").on("change", fillWorker);

При возникновении события получаем в консоли:

undefined select index
1 this select index

Если попытаемся вывести в консоль непосредственно сами объекты:

console.log($('#worker_name')+' worker_name - object');
console.log(this+' this object');

то в результате получим:

[object Object] worker_name - object
[object HTMLSelectElement] this object

Скорее всего я не вижу чего-то очевидного или не понимаю каких-то элементарных, базовых вещей. Но хотелось бы узнать, почему так происходит?

Answer 1

[Arman]

$('***')
всегда вернет объект jQuery, а this - это контекст, как вариант можно юзать $(this)

Comments

[big_hasan]

Arik: Оказывается, jQuery-объект - это коллекция!
Дописал квадратные скобки:
$('#worker_name')[0].selectedIndex
и эврика - заработало!!
Спасибо!)