Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 28.10.2012, 22:40
Новичок на форуме
Отправить личное сообщение для Teol Посмотреть профиль Найти все сообщения от Teol
 
Регистрация: 28.10.2012
Сообщений: 8

Непонятное поведение математики в JS
Здравствуйте,
делал скрипт для изменения прозрачности в JS (учусь),
вот скрипт:

function opacify(x_opacity, y_opacity, time) {
	var steps = 10,
			time = (!time) ? 1000 : time,
			x_opacity = (!x_opacity) ? 1 : x_opacity,
			y_opacity = (!y_opacity) ? 0 : y_opacity,
			anim_step = (y_opacity - x_opacity) / steps,
			counter = 0,
			new_opacity,
			interval_id = setInterval(
				function() {
					x_opacity += anim_step;
					new_opacity = x_opacity.toFixed(1);
                                        console.log('x_opacity = ' + new_opacity);
					document.getElementById('animation').style.opacity = new_opacity;
					counter++
					if (counter >= steps) { clearTimeout(interval_id)}
			}, time / steps);
}


Мне пришлось изрядно помучится, прежде чем я решил проблему, добавив обработку переменной:
x_opacity += anim_step;					
new_opacity = x_opacity.toFixed(1);


Только в этом случае результат уравнения цикла 1 - ((0-1)/10) стал равен:
0.9
0.8
0.7
...
0.0

Если убрать эту обработку(переменную new_opacity) и поставить напрямую:
document.getElementById('animation').style.opacity = x_opacity;

то результат (из логов консоли) цикла такой:
x_opacity = 0.9
x_opacity = 0.8
x_opacity = 0.7000000000000001
x_opacity = 0.6000000000000001
x_opacity = 0.5000000000000001
x_opacity = 0.40000000000000013
x_opacity = 0.30000000000000016
x_opacity = 0.20000000000000015
x_opacity = 0.10000000000000014
x_opacity = 1.3877787807814457e-16

Считается странно, и соответственно в конце прозрачность не убирается в ноль, а остается еле видной.

Я, повторюсь, что проблема, как таковая решена обработкой через доп. переменную, однако меня интересует совет более опытных разработчиков - почему это происходит и почему приходится ее вводить вообще. А в целом буду рад любым добротным советам.

Спасибо!

Последний раз редактировалось Teol, 28.10.2012 в 22:44.
Ответить с цитированием
  #2 (permalink)  
Старый 29.10.2012, 11:05
Кандидат Javascript-наук
Отправить личное сообщение для Your Посмотреть профиль Найти все сообщения от Your
 
Регистрация: 03.10.2012
Сообщений: 147

Number, Math
Ответить с цитированием
  #3 (permalink)  
Старый 29.10.2012, 11:30
Аватар для walik
Профессор
Отправить личное сообщение для walik Посмотреть профиль Найти все сообщения от walik
 
Регистрация: 09.11.2009
Сообщений: 1,101

Так же желательно почитать эту статейку, полезно будет.
Основы программной анимации на JavaScript
__________________
"Всегда пишите код так, будто сопровождать его будет склонный к насилию психопат, который знает, где вы живете."
Мой сертификат :-D клацай
Ответить с цитированием
  #4 (permalink)  
Старый 29.10.2012, 23:33
Новичок на форуме
Отправить личное сообщение для Teol Посмотреть профиль Найти все сообщения от Teol
 
Регистрация: 28.10.2012
Сообщений: 8

Дзен-трансгуманист,
большое спасибо за ответ (:
И, да уж, там должен быть clearInterval, - я до этого делал интервал через setTimeout и в запарке написал по-старому. Потом увидел и что-то там нехорошее про себя подумал.

Я пока не понял, почему число не приводилось к округленному сразу в первой переменной, а пришлось вводить вторую, однако сейчас буду переваривать и осмысливать.

И остальным спасибо за ссылки!
Уже читаю и, надеюсь, все вопросы по этой теме отпадут.
Ответить с цитированием
  #5 (permalink)  
Старый 30.10.2012, 01:09
Новичок на форуме
Отправить личное сообщение для Teol Посмотреть профиль Найти все сообщения от Teol
 
Регистрация: 28.10.2012
Сообщений: 8

Сообщение от Дзен-трансгуманист Посмотреть сообщение
К тому же, если у вас, например, будут аргументы 0.4 и 0.5, то использование toFixed(1) вообще обессмыслит всю функцию.
Отличная подсказка, спасибо еще раз. Вообще очень интересная тема вскрылась.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Непонятное поведение плагина flexcroll maximale AJAX и COMET 11 31.05.2012 20:29
Непонятное поведение переменных внутри for/while xfantom Общие вопросы Javascript 2 15.05.2012 23:23
непонятное поведение bpystep Общие вопросы Javascript 7 01.05.2012 21:42
непонятное поведение скрипта bpystep Общие вопросы Javascript 2 02.04.2012 00:48
Непонятное поведение javascript Autosof Общие вопросы Javascript 4 04.09.2008 19:00