美文网首页
数组,循环语句,定时器,闭包

数组,循环语句,定时器,闭包

作者: 幸而0407 | 来源:发表于2018-09-17 19:37 被阅读0次

    创建数组

    • 面向对象的方式创建
    var aRr01 = new Array(1,2,3,'abc');
    
    • 直接创建(推荐使用,性能更高)
    var aRr02 = [1,2,3,'def'];
    
    • 获取数组的成员数量(长度)
    alert(aRr02.length);
    alert(aRr02[3]);
    

    数组常用方法

    1、获取数组的长度:aList.length;

    var aList = [1,2,3,4];
    alert(aList.length); // 弹出4
    

    2、用下标操作数组的某个数据:aList[0];

    var aList = [1,2,3,4];
    alert(aList[0]); // 弹出1
    

    3、join() 将数组成员通过一个分隔符合并成字符串

    var aList = [1,2,3,4];
    alert(aList.join('-')); // 弹出 1-2-3-4
    

    4、push() 和 pop() 从数组最后增加成员或删除成员

    var aList = [1,2,3,4];
    aList.push(5);
    alert(aList); //弹出1,2,3,4,5
    aList.pop();
    alert(aList); // 弹出1,2,3,4
    

    5、unshift()和 shift() 从数组前面增加成员或删除成员

    var aList = [1,2,3,4];
    aList.unshift(5);
    alert(aList); //弹出5,1,2,3,4
    aList.shift();
    alert(aList); // 弹出1,2,3,4
    

    6、reverse() 将数组反转

    var aList = [1,2,3,4];
    aList.reverse();
    alert(aList);  // 弹出4,3,2,1
    

    7、indexOf() 返回数组中元素第一次出现的索引值

    var aList = [1,2,3,4,1,3,4];
    alert(aList.indexOf(1));
    

    8、splice() 在数组中增加或删除成员

    var aList = [1,2,3,4];
    aList.splice(2,1,7,8,9); //从第2个元素开始,删除1个元素,然后在此位置增加'7,8,9'三个元素
    alert(aList); //弹出 1,2,7,8,9,4
    

    多维数组
    多维数组指的是数组的成员也是数组的数组。

    var aList = [[1,2,3],['a','b','c']];
    
    alert(aList[0][1]); //弹出2;
    

    获取元素的第二种方法
    document.getElementsByTagName(''),获取的是一个选择集,不是数组,但是可以用下标的方式操作选择集里面的dom元素。

    循环语句

    程序中进行有规律的重复性操作,需要用到循环语句。

    • for循环
    for(var i=0;i<len;i++)
    {
        ......
    }
    
    • while循环
    var i=0;
    
    while(i<8){
    
        ......
    
        i++;
    
    }
    

    字符串处理方法

    • 1、字符串合并操作:“ + ”
    • 2、parseInt() 将数字字符串转化为整数
    • 3、parseFloat() 将数字字符串转化为小数
    • 4、split() 把一个字符串分隔成字符串组成的数组
    • 5、charAt() 获取字符串中的某一个字符
    • 6、indexOf() 查找字符串是否含有某字符
    • 7、substring() 截取字符串 用法: substring(start,end)(不包括end)
    • 8、toUpperCase() 字符串转大写
    • 9、toLowerCase() 字符串转小写

    定时器

    • 定时器在javascript中的作用
      1、制作动画
      2、异步操作
      3、函数缓冲与节流

    • 定时器类型及语法
      定时器:
      setTimeout 只执行一次的定时器
      clearTimeout 关闭只执行一次的定时器
      setInterval 反复执行的定时器
      clearInterval 关闭反复执行的定时器

    var time1 = setTimeout(myalert,2000);
    var time2 = setInterval(myalert,2000);
    /*
    clearTimeout(time1);
    clearInterval(time2);
    */
    function myalert(){
        alert('ok!');
    }
    

    定时器制作时钟

    <script type="text/javascript">
        window.onload = function(){    
            var oDiv = document.getElementById('div1');
            function timego(){
                var now = new Date();
                var year = now.getFullYear();
                var month = now.getMonth()+1;
                var date = now.getDate();
                var week = now.getDay();
                var hour = now.getHours();
                var minute = now.getMinutes();
                var second = now.getSeconds();
                var str = '当前时间是:'+ year + '年'+month+'月'+date+'日 '+toweek(week)+' '+todou(hour)+':'+todou(minute)+':'+todou(second);
                oDiv.innerHTML = str;
            }
            timego();
            setInterval(timego,1000);
        }
    
        function toweek(n){
            if(n==0)
            {
                return '星期日';
            }
            else if(n==1)
            {
                return '星期一';
            }
            else if(n==2)
            {
                return '星期二';
            }
            else if(n==3)
            {
                return '星期三';
            }
            else if(n==4)
            {
                return '星期四';
            }
            else if(n==5)
            {
                return '星期五';
            }
            else
            {
                return '星期六';
            }
        }
    

    封闭函数

    封闭函数是javascript中匿名函数的另外一种写法,创建一个一开始就执行而不用命名的函数。

    一般定义的函数和执行函数:

    function changecolor(){
        var oDiv = document.getElementById('div1');
        oDiv.style.color = 'red';
    }
    changecolor();
    
    • 还可以在函数定义前加上“~”和“!”等符号来定义匿名函数
    !function(){
        var oDiv = document.getElementById('div1');
        oDiv.style.color = 'red';
    }()
    

    闭包

    • 闭包就是函数嵌套函数,内部函数可以引用外部函数的参数和变量,参数和变量不会被垃圾回收机制收回
    function aaa(a){      
          var b = 5;      
          function bbb(){
               a++;
               b++;
             alert(a);
             alert(b);
          }
          return bbb;
      }
    
     var ccc = aaa(2);
    
     ccc();
     ccc();
    

    改写成封闭函数的形式:

    var ccc = (function(a){
    
      var b = 5;
      function bbb(){
           a++;
           b++;
         alert(a);
         alert(b);
      }
      return bbb;
    
    })(2);
    
    ccc();
    ccc();
    
    • 用处
      1、将一个变量长期驻扎在内存当中,可用于循环中存索引值
    <script type="text/javascript">
        window.onload = function(){
            var aLi = document.getElementsByTagName('li');
            for(var i=0;i<aLi.length;i++)
            {
                (function(i){
                    aLi[i].onclick = function(){
                        alert(i);
                    }
                })(i);
            }
        }
    </script>
    ......
    <ul>
        <li>111</li>
        <li>222</li>
        <li>333</li>
        <li>444</li>
        <li>555</li>
    </ul>
    
    • 2、私有变量计数器,外部无法访问,避免全局变量的污染
    <script type="text/javascript">
    
    var count = (function(){
        var a = 0;
        function add(){
            a++;
            return a;
        }
    
        return add;
    
    })()
    
    count();
    count();
    
    var nowcount = count();
    
    alert(nowcount);
    
    </script>
    

    相关文章

      网友评论

          本文标题:数组,循环语句,定时器,闭包

          本文链接:https://www.haomeiwen.com/subject/ttqdnftx.html