js定时器

复习

• 函数创建

   function 函数名(){ var total = 10+20; } 

• 调用函数

   函数名(); 函数名(); 

• 参数

   function sum(n,m){//形参 var total = n+m; } sum(100,200); sum(100); //形参未赋值,默认 undefined var a; console.log(a); 

• 返回值

   function sum(n,m){//形参 var total = n+m; // return total; console.log(111); } var t = sum(100,200); console.log(t); 

  • 返回值默认值也是undfined

• arguments

   function sum(){//形参 //arguments [10,20] } sum(10,20); 

• 函数不同形式

   命名函数: function sum(){ } 事件处理函数: ele.onclick = function(){ sum(10,20) } ele.onclick = sum; 对象的方法: var obj = {name:'ujiuye',age:18,eat:function(){ },aa:{x:,y:,}} 

• this关键字

   1- 普通函数,this执行window 2- 事件处理函数里面this指向触发事件的元素 3- 对象方法里面的this,指向调用方法的对象 obj.eat() 

• 作用域: 全局作用域 \ 私有作用域(函数作用域)

• 作用域链: 函数中变量查找机制,先从当前作用域查找,如果没有,依次向上级作用域查找,如果找到全局没有,报错

• 两种变量:全局变量\局部变量(在函数里面var 的和函数的形参)

• 预解析(变量提升):

  • 带var 先声明,不赋值(默认值undefined)

     console.log(a);//undefined var a = 10; console.log(a);//10 

  • 带function 声明的同时赋值

     sum(); function sum(){} fn();//报错 var fn = function(){ } fn(); 

• 样式操作

   设置: ele.style.attr = val; 获取: ele.style.width 标准: getComputedStyle(ele)[attr] ie: ele.currentStyle[attr] function getCss(ele,attr){ return ele.currentStyle == "unfdefined" ? getComputedStyle(ele)[attr] : ele.currentStyle[attr]; } getCss(oBox,'width'); 

(一) 定时器

1- setTimeout : 等待一段时间执行function,只执行一次

 setTimeout(function(){},1000); 

2- setInterval: 每隔一段时间执行function,重复执行

 setInterval(function(){},1000); 

3- 清除定时器

• clearTimeout()

   var i = 0; var timer = setInterval(function(){ //console.log('***'+timer); i++; if(i == 5){ //clearInterval(1); //清除定时器传入参数是代表定时器的那个数字 clearInterval(timer); //一般设置定时器时用变量接收一下,清除时传入变量名 } console.log(i); },1000); 

• clearInterval()

  • 这两个方法技术上都可以清除两种定时器,但是为了区分,应该对应起来用

4- 定时器异步

• 定时器时js中的一种异步机制,永远会在同步代码之后运行

   setTimeout(function(){ console.log(111); },0) console.log(222); //先输出222,再输出111