Javascript-форум (https://javascript.ru/forum/)
-   Javascript под браузер (https://javascript.ru/forum/css-html/)
-   -   Скрипт: при наведении меняем цвет на один из заданных (https://javascript.ru/forum/css-html/69089-skript-pri-navedenii-menyaem-cvet-na-odin-iz-zadannykh.html)

рони 30.05.2017 23:08

j0hnik,
ошибок нет, и вполне достаточно, но можно и без while, код будет длиннее, но без лишних генераций, что производительнее.

j0hnik 30.05.2017 23:14

Цитата:

Сообщение от рони (Сообщение 453886)
j0hnik,
ошибок нет, и вполне достаточно, но можно и без while, код будет длиннее, но без лишних генераций, что производительнее.

напишите как вы видите =)

еще можно если переменные равны прерывать функцию и запускать заново. но вроде цикл лучше в плане производительности.
Как вы производительность оцениваете? может сервис какой есть?

рони 30.05.2017 23:35

Цитата:

Сообщение от j0hnik
Как вы производительность оцениваете?

если повторения не нужны, зачем их генерировать? скрипт будет "ждать" пока rand == rand2 - сервис https://jsperf.com/
<!DOCTYPE html>

<html>
<head>
  <meta charset="utf-8">
</head>
<body>
  <div id="id" style="display: block; width: 200px; height: 200px; border: 1px solid grey;"></div>
  <script>
function rand(a) {
    a = a.slice(0);
    var c = a.length - 1;
    return function() {
        var b = Math.floor(Math.random() * c),
            b = a.splice(b, 1)[0];
        a.push(b);
        return b
    }
};
  var color = ['red','green','blue','orange','yellow','violet','cyan'];
  var r = rand(color);
    document.getElementById("id").onmouseover = function(){
    this.style.backgroundColor = r();
  };
</script>
</body>

</html>

j0hnik 31.05.2017 00:05

Спасибо за ссылку =) буду тестить! :thanks:

рони 31.05.2017 00:08

Цитата:

Сообщение от j0hnik
буду тестить!

с while в данном случае не критично, на 100 генераций будет примерно 5-8 лишних.

рони 31.05.2017 00:12

количество повторов на 100 генераций
 
j0hnik,
var rand2, rand;
    var n = 0;
    for (var i=0; i<100; i++)  { rand = Math.floor(Math.random() * 6);if(rand2==rand)n++; rand2=rand}
    alert(n);

j0hnik 31.05.2017 02:41

Рони друг мой я протестил:
и вот какие результаты
1место скрипт пост 7
2место -10% пост 10
3 место -66% твой скрипт
МБ я что нитак сделал. (прокоментируй пжл)
https://jsperf.com/do

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

рони 31.05.2017 03:04

j0hnik,
пост №7 -- обращается к несуществующим элементам массива.
пост №10 от 5 до 20 % лишних генераций.
пост №13 количество повторов и ошибок на 100 генераций ноль!!! по скорости не знаю, что быстрее.

j0hnik 31.05.2017 03:14

Цитата:

Сообщение от рони (Сообщение 453920)
j0hnik,
обращается к несуществующим элементам массива.

почему? мы же сначала отняли 1 поэтому потом можем добавить и не вылетим за рамки color.length

рони 31.05.2017 03:31

Цитата:

Сообщение от j0hnik
почему?

потому что когда rand2 === rand и rand = 6 то ++rand будет 7 --- а элемента с таким индексом нет

исправленный вариант

<head>
  <meta charset="utf-8">
</head>
<body>
  <div id="id" style="display: block; width: 200px; height: 200px; border: 1px solid grey;"></div>
  <script>
  var rand2;
    document.getElementById("id").onmouseover = function(){
    var color = ['red','green','blue','orange','yellow','violet','cyan']
    var rand = Math.floor(Math.random()*color.length);
    if (rand2 === rand) rand = ++rand%color.length;
    this.style.backgroundColor = color[rand];
    rand2 = rand;
  };
</script>
</body>


Часовой пояс GMT +3, время: 23:24.