美文网首页
javascript进阶

javascript进阶

作者: 潇潇雨歇_安然 | 来源:发表于2018-06-26 22:39 被阅读0次

    1. 数组及操作方法

    数组就是一组数据的集合,javascript中,数组里面的数据可以是不同类型的。

    • 定义数组的方法

    //对象的实例创建
    var aList = new Array(1,2,3);

    //直接量创建
    var aList2 = [1,2,3,'asd'];

    • 操作数组中数据的方法
      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、reverse() 将数组反转
      var aList = [1,2,3,4];
      aList.reverse();
      alert(aList); // 弹出4,3,2,1
      6、indexOf() 返回数组中元素第一次出现的索引值
      var aList = [1,2,3,4,1,3,4];
      alert(aList.indexOf(1));
      7、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;

    2.循环语句

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

    3. 字符串处理方法

    1、字符串合并操作:“ + ”

    var iNum01 = 12;
    var iNum02 = 24;
    var sNum03 = '12';
    var sTr = 'abc';
    alert(iNum01+iNum02);  //弹出36
    alert(iNum01+sNum03);  //弹出1212 数字和字符串相加等同于字符串相加
    alert(sNum03+sTr);     // 弹出12abc
    

    2、parseInt() 将数字字符串转化为整数

    var sNum01 = '12';
    var sNum02 = '24';
    var sNum03 = '12.32';
    alert(sNum01+sNum02);  //弹出1224
    alert(parseInt(sNum01)+parseInt(sNum02))  //弹出36
    alert(parseInt(sNum03))   //弹出数字12 将字符串小数转化为数字整数
    

    3、parseFloat() 将数字字符串转化为小数

    var sNum03 = '12.32'
    alert(parseFloat(sNum03));  //弹出 12.32 将字符串小数转化为数字小数
    

    4、split() 把一个字符串分隔成字符串组成的数组

    var sTr = '2017-4-22';
    var aRr = sTr.split("-");
    var aRr2= sTr.split("");
    
    alert(aRr);  //弹出['2017','4','2']
    alert(aRr2);  //弹出['2','0','1','7','-','4','-','2','2']
    

    5、indexOf() 查找字符串是否含有某字符

    var sTr = "abcdefgh";
    var iNum = sTr.indexOf("c");
    alert(iNum); //弹出2
    

    6、substring() 截取字符串 用法: substring(start,end)(不包括end)

    var sTr = "abcdefghijkl";
    var sTr2 = sTr.substring(3,5);
    var sTr3 = sTr.substring(1);
    
    alert(sTr2); //弹出 de
    alert(sTr3); //弹出 bcdefghijkl
    
    1. 字符串反转
    var str = 'asdfj12jlsdkf098';
    var str2 = str.split('').reverse().join('');
    
    alert(str2);
    

    4.定时器

    定时器在javascript中的作用
    1、定时调用函数
    2、制作动画

    定时器类型及语法

    /*
        定时器:
        setTimeout  只执行一次的定时器 
        clearTimeout 关闭只执行一次的定时器
        setInterval  反复执行的定时器
        clearInterval 关闭反复执行的定时器
    
    */
    
    var time1 = setTimeout(myalert,2000);
    var time2 = setInterval(myalert,2000);
    /*
    clearTimeout(time1);
    clearInterval(time2);
    */
    function myalert(){
        alert('ok!');
    }
    

    5. 变量作用域

    变量作用域指的是变量的作用范围,javascript中的变量分为全局变量和局部变量。

    1、全局变量:在函数之外定义的变量,为整个页面公用,函数内部外部都可以访问。
    2、局部变量:在函数内部定义的变量,只能在定义该变量的函数内部访问,外部无法访问。

    <script type="text/javascript">
        // 定义全局变量
        var a = 12;
        function myalert()
        {
            // 定义局部变量
            var b = 23;
            alert(a);
            // 修改全局变量
            a++;
            alert(b);
        }
        myalert(); // 弹出12和23
        alert(a);  // 弹出13    
        alert(b);  // 出错
    </script>
    

    6.封闭函数

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

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

    function myalert(){
        alert('hello!');
    };
    
    myalert();
    

    封闭函数:

    (function(){
        alert('hello!');
    })();
    

    还可以在函数定义前加上“~”和“!”等符号来定义匿名函数

    !function(){
        alert('hello!');
    }()
    ~function(){
        alert('hello!');
    }()
    
    • 封闭函数的作用
      封闭函数可以创造一个独立的空间,在封闭函数内定义的变量和函数不会影响外部同名的函数和变量,可以避免命名冲突,在页面上引入多个js文件时,用这种方式添加js文件比较安全,比如:
    var iNum01 = 12;
    function myalert(){
        alert('hello!');
    }
    
    (function(){
        var iNum01 = 24;
        function myalert(){
            alert('hello!world');
        }
        alert(iNum01);
        myalert()
    })()
    
    alert(iNum01);
    myalert();
    

    相关文章

      网友评论

          本文标题:javascript进阶

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