Выбирает случайный элемент массива из строки, но одна и та же строка всегда возвращает один и тот же элемент. Псевдослучайный

#javascript #arrays #random #ecmascript-6

#javascript #массивы #Случайный #ecmascript-6

Вопрос:

У меня есть массив возможных цветов в Javascript:

 possibleColors = [
        "#10ace3",
        "#f26529",
        "#c62328",
        "#e53434",
        "#ffba49",
        "#99c24d",
        "#7e1d1d"
      ]
  

Учитывая строку (имя пользователя), я хотел бы всегда выбирать один и тот же цвет случайным образом.

В качестве примера:

 "Sergio" would always return the first color.
"Daniel" would always return the fourth color.
etc.
  

Есть предложения о том, как это сделать? Пожалуйста, не воспринимайте мой пример буквально, я просто имею в виду, что одна и та же строка должна возвращать один и тот же цвет.

Комментарии:

1. Не могли бы вы предоставить больше информации о том, чего вы пытаетесь достичь? Моим лучшим ответом было бы сохранить их в localStorage , но без дополнительной информации я потерян.

2. Это предложение определенно сбивает меня с толку: «Я бы хотел всегда выбирать один и тот же цвет случайным образом».

3. Найдите реализацию crc32 и вычислите хэш входной строки, затем умножьте результат по модулю на длину массива.

4. possibleColors меняется ли порядок или количество при каждом запуске?

5. Они могли бы добавить цвет или удалить цвет позже, и если это так, я бы ожидал, что цвет для «Sergio» изменится — это нормально.

Ответ №1:

Если имя задается динамически, вам нужно будет присвоить ему цвет для первой записи, а затем убедиться, что каждая последующая запись возвращает тот же цвет.

Если вы знаете имя заранее, то вы просто создаете карту, возвращающую тот же цвет.

В любом случае, должно быть создано какое-то сопоставление сортировки.

Например:

 const nameColorMap = new Map()
const possibleColors = [ "#10ace3", "#f26529", "#c62328", "#e53434", "#ffba49", "#99c24d", "#7e1d1d"]

function getColorForName(name) {
  if (!nameColorMap.has(name)) {
    const color = possibleColors[Math.round(Math.random() * possibleColors.length)]
    nameColorMap.set(
      name,
      color,
    )
  }

  return nameColorMap.get(name)
}
  

https://repl.it/@baruchvlz/GrubbyAgonizingOffice

Ответ №2:

Просто сохраните имя пользователя и его цвет, если он новый пользователь, пусть принесет ему случайный цвет, в обратном случае верните его цвет.

 const possibleColors = [
  "#10ace3",
  "#f26529",
  "#c62328",
  "#e53434",
  "#ffba49",
  "#99c24d",
  "#7e1d1d"
];

let  getColor = (function() {
  let cache = {};
  let f = function(name) {
    if (!cache[name]) {
      cache[name] = possibleColors[Math.floor(Math.random() * possibleColors.length)];
    }

    return cache[name];
  }
  return f;
})();

console.log(getColor('Sergio'));
console.log(getColor('Sergio'));
console.log(getColor('Sergio'));

console.log(getColor('Daniel'));
console.log(getColor('Daniel'));
console.log(getColor('Daniel'));
  

Ответ №3:

Вам нужно будет воспользоваться каким-либо хранилищем, таким как localStorage или внутренней базой данных, такой как MySQL

Поскольку SO не поддерживает фрагменты localStorage, вот jsfiddle приведенного ниже кода:

 const possibleColors = [
        "#10ace3",
        "#f26529",
        "#c62328",
        "#e53434",
        "#ffba49",
        "#99c24d",
        "#7e1d1d"
      ]

function getColor(str) {
  // Attempt the get the item from local storage (returns null otherwise)
  let color = localStorage.getItem(str)
  if(!color) {
    // Nothing was in local storage, select a random color
    color = possibleColors[Math.floor(Math.random() * possibleColors.length)]
    // Save the color to local storage for use next time
    localStorage.setItem(str, color)
  }
  // Return the color that was or now is in local storage
  return color
}

console.log('jim', getColor('jim'))
console.log('bob', getColor('bob'))

console.log('jim', getColor('jim'))
console.log('brass monkey', getColor('brass monkey'))
console.log('jim', getColor('jim'))

console.log('brass monkey', getColor('brass monkey'))
console.log('brass monkey', getColor('brass monkey'))
  

Многократный запуск скрипта даст одинаковые результаты с одной и той же строкой. Перезагрузка страницы приведет к тому же, поскольку значения хранятся в хранилище.

 // Example possible output:
//
// jim           #7e1d1d
// bob           #c62328
// jim           #7e1d1d
// brass monkey  #e53434
// jim           #7e1d1d
// brass monkey  #e53434
// brass monkey  #e53434