Найти объект с помощью перебора массива

06 февраля 2022, 09:00

Есть select нужно с помощью перебора массива вывести ключ(red,blue,green) к которому относится значение select, то-есть если мы выбираем в select "Академгородок" то при нажатии на кнопку должен вывестись red(ключ там где находится этот объект).HTML:

<select id="select_2">
    <option value="Академгородок">Академгородок</option>
    <option value="ТЧ-2 «Оболонь»">ТЧ-2 «Оболонь»</option>
    <option value="Сырец">Сырец</option>
</select>
<button class="btn_2">Push</button>

Js:

let sel_2 = document.querySelector('#select_2');
let btn_2 = document.querySelector('.btn_2');
btn_2.onclick = function func_2() {
  stat = sel_2.value;
  for(let key in metro) {
      for(let i = 0; i < metro[key]; i++) {
      }
   }
}

массив:

const metro = {
"red" : [
  'Академгородок', 'Житомирская', 'Святошин', 'Нивки',
  'Берестейская', 'Шулявская', 'Политехнический институт',
  'Вокзальная', 'Университет', 'Крещатик', 'Арсенальная',
  'Гидропарк', 'Левобережная', 'Дарница', 'Лесная'
  ],
"blue" : [
  'ТЧ-2 «Оболонь»', 'Героев Днепра', 'Оболонь', 'Почайна',
  'Тараса Шевченко', 'Почтовая площадь', 'Майдан Незалежности', 'Олимпийская',
  'Дворец «Украина»', 'Лыбедская', 'Демиевская', 'Голосеевская', 'Теремки'
],
"green" : [
  'Сырец', 'Дорогожичи', 'Герцена', 'Лукьяновская',
  'Львовская брама', 'Золотые ворота', 'Дворец спорта', 'Крещатику',
  'Печерская', 'Дружбы народов', 'Выдубичи', 'Теличка',
  'Славутич', 'Красный хутор', 'Улица Горбунова',
]
}

Answer 1

const metro = { 
	"red" : [ 
	  'Академгородок', 'Житомирская', 'Святошин', 'Нивки', 
	  'Берестейская', 'Шулявская', 'Политехнический институт', 
	  'Вокзальная', 'Университет', 'Крещатик', 'Арсенальная', 
	  'Гидропарк', 'Левобережная', 'Дарница', 'Лесная' 
	  ], 
	"blue" : [ 
	  'ТЧ-2 «Оболонь»', 'Героев Днепра', 'Оболонь', 'Почайна', 
	  'Тараса Шевченко', 'Почтовая площадь', 'Майдан Незалежности', 'Олимпийская', 
	  'Дворец «Украина»', 'Лыбедская', 'Демиевская', 'Голосеевская', 'Теремки' 
	], 
	"green" : [ 
	  'Сырец', 'Дорогожичи', 'Герцена', 'Лукьяновская', 
	  'Львовская брама', 'Золотые ворота', 'Дворец спорта', 'Крещатику', 
	  'Печерская', 'Дружбы народов', 'Выдубичи', 'Теличка', 
	  'Славутич', 'Красный хутор', 'Улица Горбунова', 
	] 
}; 
 
let btn = document.querySelector(".btn_2"); 
 
btn.addEventListener("click", () => { 
	let select = document.querySelector("#select_2"); 
	let text = select.options[select.selectedIndex].textContent; 
 
	window.console.log(getKey(metro, text)); 
}); 
 
function getKey(obj, val) { 
	for (let prop of Object.keys(obj)) { 
		if (metro[prop].includes(val)) return prop; 
	} 
}

<!DOCTYPE html> 
<html> 
<head> 
	<title></title> 
</head> 
<body> 
	<select id="select_2"> 
	    <option value="Академгородок">Академгородок</option> 
	    <option value="ТЧ-2 «Оболонь»">ТЧ-2 «Оболонь»</option> 
	    <option value="Сырец">Сырец</option> 
	</select> 
	<button class="btn_2">Push</button> 
</body> 
</html>