美文网首页Java 杂谈IT@程序员猿媛程序员
Javascript第三章数组Array常用方法第三课

Javascript第三章数组Array常用方法第三课

作者: 您好简书 | 来源:发表于2019-07-11 18:22 被阅读2次
    在这里插入图片描述

    第一种JavaScript sort() 方法

    在这里插入图片描述

    实例
    例子 1
    在本例中,我们将创建一个数组,并按字母顺序进行排序:

    <script type="text/javascript">
    
    var arr = new Array(6)
    arr[0] = "George"
    arr[1] = "John"
    arr[2] = "Thomas"
    arr[3] = "James"
    arr[4] = "Adrew"
    arr[5] = "Martin"
    
    document.write(arr + "<br />")
    document.write(arr.sort())
    
    </script>
    

    输出:

    George,John,Thomas,James,Adrew,Martin
    Adrew,George,James,John,Martin,Thomas
    亲自试一试

    例子 2
    在本例中,我们将创建一个数组,并按字母顺序进行排序:

    <script type="text/javascript">
    
    var arr = new Array(6)
    arr[0] = "10"
    arr[1] = "5"
    arr[2] = "40"
    arr[3] = "25"
    arr[4] = "1000"
    arr[5] = "1"
    
    document.write(arr + "<br />")
    document.write(arr.sort())
    
    </script>
    ```javascript
    输出:
    
    10,5,40,25,1000,1
    1,10,1000,25,40,5
    请注意,上面的代码没有按照数值的大小对数字进行排序,要实现这一点,就必须使用一个排序函数:
    ```javascript
    <script type="text/javascript">
    
    function sortNumber(a,b)
    {
    return a - b
    }
    
    var arr = new Array(6)
    arr[0] = "10"
    arr[1] = "5"
    arr[2] = "40"
    arr[3] = "25"
    arr[4] = "1000"
    arr[5] = "1"
    
    document.write(arr + "<br />")
    document.write(arr.sort(sortNumber))
    
    </script>
    

    输出:

    10,5,40,25,1000,1
    1,5,10,25,40,1000

    在这里插入图片描述

    此方法先从左向右比较,先比较第一个字母的大小,如果是一样的,就比较第二个字母

    第二种JavaScript reverse() 方法

    在这里插入图片描述

    实例
    在本例中,我们将创建一个数组,然后颠倒其元素的顺序:

    <script type="text/javascript">
    
    var arr = new Array(3)
    arr[0] = "George"
    arr[1] = "John"
    arr[2] = "Thomas"
    
    document.write(arr + "<br />")
    document.write(arr.reverse())
    
    </script>
    

    输出:

    George,John,Thomas
    Thomas,John,George

    第三种 JavaScript join() 方法

    是所有元素的拼接


    在这里插入图片描述

    实例
    例子 1
    在本例中,我们将创建一个数组,然后把它的所有元素放入一个字符串:

    <script type="text/javascript">
    
    var arr = new Array(3)
    arr[0] = "George"
    arr[1] = "John"
    arr[2] = "Thomas"
    
    document.write(arr.join())
    
    </script>
    

    输出:

    George,John,Thomas
    例子 2
    在本例中,我们将使用分隔符来分隔数组中的元素:

    <script type="text/javascript">
    
    var arr = new Array(3)
    arr[0] = "George"
    arr[1] = "John"
    arr[2] = "Thomas"
    
    document.write(arr.join("."))
    
    </script>
    

    输出:

    George.John.Thomas

    练习:

    <!DOCTYPE html>
    <html lang="zh">
    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <meta http-equiv="X-UA-Compatible" content="ie=edge" />
        <title>Document</title>
        <script type="text/javascript">
            //sort排序
            var nums=[25,6,98,78,23];
            var nums1=["dfsdf","dsfd","sdfdsf"];
            var aa=nums.join("-");
            console.log(aa)
            console.log(typeof nums);
        </script>
    </head>
    <body>
        
    </body>
    </html>
    

    输出的结果:


    在这里插入图片描述

    第四种 JavaScript concat() 方法

    两个或多个数组的元素,拼接一起 输出一起的内容 不怎么常用


    在这里插入图片描述

    实例
    例子 1
    在本例中,我们将把 concat() 中的参数连接到数组 a 中:

    <script type="text/javascript">
    
    var a = [1,2,3];
    document.write(a.concat(4,5));
    
    </script>
    

    输出:

    1,2,3,4,5
    例子 2
    在本例中,我们创建了两个数组,然后使用 concat() 把它们连接起来:

    <script type="text/javascript">
    
    var arr = new Array(3)
    arr[0] = "George"
    arr[1] = "John"
    arr[2] = "Thomas"
    
    var arr2 = new Array(3)
    arr2[0] = "James"
    arr2[1] = "Adrew"
    arr2[2] = "Martin"
    
    document.write(arr.concat(arr2))
    
    </script>
    

    输出:

    George,John,Thomas,James,Adrew,Martin
    例子 3
    在本例中,我们创建了三个数组,然后使用 concat() 把它们连接起来:

    <script type="text/javascript">
    
    var arr = new Array(3)
    arr[0] = "George"
    arr[1] = "John"
    arr[2] = "Thomas"
    
    var arr2 = new Array(3)
    arr2[0] = "James"
    arr2[1] = "Adrew"
    arr2[2] = "Martin"
    
    var arr3 = new Array(2)
    arr3[0] = "William"
    arr3[1] = "Franklin"
    
    document.write(arr.concat(arr2,arr3))
    
    </script>
    
    

    输出:

    George,John,Thomas,James,Adrew,Martin,William,Franklin

    方法五 JavaScript toString() 方法

    默认拼接是逗号连接


    在这里插入图片描述

    实例

    <script type="text/javascript">
    
    var arr = new Array(3)
    arr[0] = "George"
    arr[1] = "John"
    arr[2] = "Thomas"
    
    document.write(arr.toString())
    
    </script>
    

    输出:

    George,John,Thomas

    方法六 JavaScript valueOf() 方法

    跟直接输出数组名一样--默认的


    在这里插入图片描述
    方法七 JavaScript push() 方法
    在这里插入图片描述

    示和注释
    注释:该方法会改变数组的长度。

    提示:要想数组的开头添加一个或多个元素,请使用 unshift() 方法。

    实例
    在本例中,我们将创建一个数组,并通过添加一个元素来改变其长度:

    <script type="text/javascript">
    
    var arr = new Array(3)
    arr[0] = "George"
    arr[1] = "John"
    arr[2] = "Thomas"
    
    document.write(arr + "<br />")
    document.write(arr.push("James") + "<br />")
    document.write(arr)
    
    </script>
    

    输出:

    George,John,Thomas
    4
    George,John,Thomas,James

    方法八 JavaScript pop() 方法

    不常用


    在这里插入图片描述
    在这里插入图片描述

    实例
    在本例中,我们将创建一个数组,然后删除数组的最后一个元素。请注意,这也会改变数组的长度:

    <script type="text/javascript">
    
    var arr = new Array(3)
    arr[0] = "George"
    arr[1] = "John"
    arr[2] = "Thomas"
    
    document.write(arr)
    
    document.write("<br />")
    
    document.write(arr.pop())
    
    document.write("<br />")
    
    document.write(arr)
    
    </script>
    

    输出:

    George,John,Thomas
    Thomas
    George,John

    API文档:参考http://www.w3school.com.cn/jsref/jsref_pop.asp

    相关文章

      网友评论

        本文标题:Javascript第三章数组Array常用方法第三课

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