Рандомные элементы массива

@aqostic · Регистрация: 17.10.2016

Студворк — интернет-сервис помощи студентам

Есть массив с 10 именами, нужно рандомно вывести эти 10 имен, но так, чтобы они не повторялись. Пришла идея сделать генератор рандомных чисел от 0 до 9 без повторения. Но при попытке присвоить массиву индекс - выводит undefindet В чем дело?

HTML5
1
2
3
4
5
6
7
8
9
10
<div class="element_one" id="massiv1">1</div>
<div class="element_one" id="massiv2">2</div>
<div class="element_one" id="massiv3">3</div>
<div class="element_one" id="massiv4">4</div>
<div class="element_one" id="massiv5">5</div>
<div class="element_one" id="massiv6">6</div>
<div class="element_one" id="massiv7">7</div>
<div class="element_one" id="massiv8">8</div>
<div class="element_one" id="massiv9">9</div>
<div class="element_one" id="massiv10">10</div>

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
var who =['Вадим', 'Глеб', 'Андрей', 'Максим', 'Миша', 'Влад', 'Слава', 'Дима', 'Олег', 'Артем' ];
 
function generateArrayRandomNumber () {
    var totalNumbers        = who.length,
        arrayTotalNumbers   = [],
        arrayRandomNumbers  = [],
        tempRandomNumber;
 
    while (totalNumbers--) {
        arrayTotalNumbers.push(totalNumbers);
    }
 
    while (arrayTotalNumbers.length) {
        tempRandomNumber = Math.round(Math.random() * (arrayTotalNumbers.length - 1));
        arrayRandomNumbers.push(arrayTotalNumbers[tempRandomNumber]);
        arrayTotalNumbers.splice(tempRandomNumber, 1);
    }
    return arrayRandomNumbers;
    
}
 
  document.getElementById('massiv1').innerHTML = who[generateArrayRandomNumber[0]];
    document.getElementById('massiv2').innerHTML = who[generateArrayRandomNumber[1]];
    document.getElementById('massiv3').innerHTML = who[generateArrayRandomNumber[2]];
    document.getElementById('massiv4').innerHTML = who[generateArrayRandomNumber[3]];
    document.getElementById('massiv5').innerHTML = who[generateArrayRandomNumber[4]];
    document.getElementById('massiv6').innerHTML = who[generateArrayRandomNumber[5]];
    document.getElementById('massiv7').innerHTML = who[generateArrayRandomNumber[6]];
    document.getElementById('massiv8').innerHTML = who[generateArrayRandomNumber[7]];
    document.getElementById('massiv9').innerHTML = who[generateArrayRandomNumber[8]];
    document.getElementById('massiv10').innerHTML = who[generateArrayRandomNumber[9]];

@klopp · 01.02.2018, 04:09

JavaScript
1
2
3
4
5
let a = generateArrayRandomNumber();
document.getElementById('massiv2').innerHTML = who[a[0]];
document.getElementById('massiv2').innerHTML = who[a[1]];
document.getElementById('massiv2').innerHTML = who[a[2]]; 
// etc

@j2FunOnly · 01.02.2018, 09:54

Сообщение от aqostic

JavaScript
1
who[generateArrayRandomNumber[0]];

generateArrayRandomNumber - это функция. Таким образом вы пытаетесь получить значение атрибута "0", но такого атрибута у функции нет - undefined раз. Дальше вы пытаетесь получить элемент массива who с индексом undefined - undefined два.

Можно получить рандомный элемент массива следующим образом:

JavaScript
1
who[Math.round(Math.random() * who.length - 1)];

Такой подход можно применить чтобы перемешать элементы массива. У массива есть методы slice() и splice(). Эти методы позволяют получить заданное количество элементов массива с определённого индекса. Второй изменяет исходный массив - это именно то, что надо в данном случае:

JavaScript
1
2
3
4
5
6
7
8
9
10
var shuffle = function shuffle(arr) {
  var dup = arr.slice(),
    result = [];
 
  while (dup.length) { // 0 - кастуется в boolean false
    result.push(dup.splice(Math.round(Math.random() * dup.length - 1), 1));
  }
 
  return result;
};

Итого:

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
var shuffle = function shuffle(arr) {
  var dup = arr.slice(),
    result = [];
 
  while (dup.length) {
    result.push(dup.splice(Math.round(Math.random() * dup.length - 1), 1));
  }
 
  return result;
};
 
var who = ['Вадим', 'Глеб', 'Андрей', 'Максим', 'Миша', 'Влад', 'Слава', 'Дима', 'Олег', 'Артем'];
 
var elements = document.querySelectorAll('.element_one'),
  shuffleWho = shuffle(who);
 
for (var i = 0, l = elements.length; i < l; i++) {
  elements[i].textContent = shuffleWho[i];
}

https://jsfiddle.net/j2FunOnly/0jmja3yc/

Новые блоги и статьи Все статьи Все блоги /
Хочу заставить корпорации вкладываться в здоровье сотрудников: делаю мат модель здравосохранения anaschu 22.03.2026 e7EYtONaj8Y Z4Tv2zpXVVo https:/ / github. com/ shumilovas/ med2. git	1С: Программный отбор элементов справочника по группе Maks 22.03.2026 Установка программного отбора элементов справочника "Номенклатура" из модуля формы документа. В качестве фильтра для отбора справочника служит группа номенклатуры. Отбор по наименованию группы. . .	Как я обхитрил таблицу Word Alexander-7 21.03.2026 Когда мигает курсор у внешнего края таблицы, и нам надо перейти на новую строку, а при нажатии Enter создается новый ряд таблицы с ячейками, то мы вместо нервных нажатий Энтеров мы пишем любые буквы. . .	Krabik - рыболовный бот для WoW 3.3.5a AmbA 21.03.2026 без регистрации и смс. Это не торговля, приложение не содержит рекламы. Выполняет свою непосредственную задачу - автоматизацию рыбалки в WoW - и ничего более. Однако если админы будут против -. . .
1С: Программный отбор элементов справочника по значению перечисления Maks 21.03.2026 Установка программного отбора элементов справочника "Сотрудники" из модуля формы документа. В качестве фильтра для отбора служит значение перечислений. / / Событие "НачалоВыбора" реквизита на форме. . .	Переходник USB-CAN-GPIO Eddy_Em 20.03.2026 Достаточно давно на работе возникла необходимость в переходнике CAN-USB с гальваноразвязкой, оный и был разработан. Однако, все меня терзала совесть, что аж 48-ногий МК используется так тупо: просто. . .	Оттенки серого Argus19 18.03.2026 Оттенки серого Нашёл в интернете 3 прекрасных модуля: Модуль класса открытия диалога открытия/ сохранения файла на Win32 API; Модуль класса быстрого перекодирования цветного изображения в оттенки. . .	SDL3 для Desktop (MinGW): Рисуем цветные прямоугольники с помощью рисовальщика SDL3 на Си и C++ 8Observer8 17.03.2026 Содержание блога Финальные проекты на Си и на C++: finish-rectangles-sdl3-c. zip finish-rectangles-sdl3-cpp. zip