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

你可能感兴趣的