javascript第六天定时器

1. 定时器

(1)     我们需要实现一些重复性的功能，或延迟功能 就需要使用定时器

(2)     定义：JavaScript提供了一些原生方法来实现延时去执行某一段代码

(3)     分类：

①    延迟定时器：可以提供延迟指定时间 执行某一代码的操作

1)       用法：setTimeout(function(){要延迟执行的代码}，延迟时间)

2)       延迟时间 单位 为 毫秒(ms)  1s===1000ms 

②    间歇定时器：可以提供间歇指定时间 执行某一代码的操作

1)       用法：setInterval(function(){要间歇执行的代码}，间歇时间)

2)       时间单位为毫秒 ms

3)       间歇定时器如果没有人为控制 会一直执行，会一直占用CPU资源，因此不利于性能的提升。

(4)     清除定时器

①    clearTimeout(要清除的定时器id)

②    clearInterval(要清除的定时器id)

③    定时器id        

1)       定义：就是定时器函数的返回值，是一个数字，从1开始，按照定时器出现的顺序依次向后排列

④     

1. 定时器demo  js的动画

(1)     使用间歇定时器 可以实现每隔一个时间间隔 向前走一步的效果

①    setInterval(function(){走一步的代码},时间间隔)  时间间隔建议设置为15-24ms

②    动画三要素  起点  终点  步长

③    做动画三步走

1)       迈出第一只脚  更新起点值  start += step

2)       跟上第二只脚  将元素定位到新起点  元素.style.left = start + ‘px’

3)       判断是否到达终点 如果到达就清除定时器

④    产生抖动的原因：定时器的叠加

1)       我们只要时刻保持 一个元素身上 只有一个定时器就可以

2)       办法：在添加新的定时器之前 先清除掉先前的定时器

1. Math对象

(1)     Math对象是我们第一个接触到的js内置对象，主要用来处理数学相关问题

①    Math对象中包含很多的方法 我们可以调用方法实现问题的处理

(2)     Math对象中的常用方法

①    Math.ceil/floor: 向上/向下取整  ceil天花板函数  floor地板函数

1)       用法：Math.ceil(数字)/floor(数字)

②    Math.round : 四舍五入（只能控制小数位）

1)       Math.round(数字)

③    Math.pow/sqrt乘方和开方

1)       Math.pow(x,y)  求x的y次方

2)       Math.sqrt(数字)  求数字开根号的值

④    Math.max/min

1)       Math.max(num1,num2,num3......)  在这些数字中选出最大值

2)       Math.min(num1,num2,num3......)  在这些数字中选出最小值

⑤    Math.random

1)       Math.random()   得到的结果是一个0-1之间的随机数 取得到0，取不到1

2)       公式：获取0-x之间的随机数 Math.random()*x

3)       公式：获取x-y之间的随机数 Math.random()*(y-x)+x