美文网首页前端攻城狮
JavaScript关于数组

JavaScript关于数组

作者: 范小饭_ | 来源:发表于2016-11-19 09:50 被阅读126次

认识数组

所谓数组,就是相同数据类型的元素按一定顺序排列的集合,就是把有限个类型相同的变量用一个名字命名,然后用编号区分他们的变量的集合,这个名字称为数组名,编号称为下标。组成数组的各个变量称为数组的分量,也称为数组的元素,有时也称为下标变量。数组是在程序设计中,为了处理方便, 把具有相同类型的若干变量按有序的形式组织起来的一种形式。这些按序排列的同类数据元素的集合称为数组。

javascript06.jpg

内置对象是JS语言子代对象,提供了一些基本的功能,供开发者来使用。
浏览器上跑的内置对象是Math,String,Array,Date等对象。
对象:属性(变量)和方法(函数)的集合;
数组就是对象
可以储存多个不同类型的数据

创建数组

构造函数法创建数组

1、构造函数法创建空数组
var arr1 = new Array();
2、构造函数法创建确定容量的数组
var arr2 = new Array(10);
3、构造函数法创建一个拥有一些数据的数组
var arr3 = new Array(1, 2, "Tom", true);

字面量法创建数组

1、字面量法创建空数组
var arr4 = [];
2、字面量法创建拥有一些数据的数组
var arr5 = [1,2,3,4];

数组的访问和赋值

访问:数组名[下标]
注意:下标是从0开始的
赋值:

        arr[0] = 18;
        arr[1] = 19;
        arr[2] = 20;
        arr[3] = 21;
        arr[4] = 22;

数组的遍历

1.for循环遍历

        for (var i = 0; i < arr.length; i++) {
            sum += arr[i];
            console.log(arr[i]);
        }

2、for-in 快速遍历
in的前面针对于数组来说是我们的下标

        for (var j in arr) {
            console.log(arr[j]);
        }

3、forEach():MCMAScript5.0加入的,低版本IE中无法使用

        arr.forEach(function(e){
            console.log(e);
        });

注意:前方高能都是数组的用法


1、 push(item1,item2...)
功能:在数组末尾添加一个或多个元素
参数:要添加的元素
返回值:添加数据后数组的长度

        var arr1 = [1,2,3,4,5];
        var ret1 = arr1.push(8);
        console.log(arr1);//[1, 2, 3, 4, 5, 8]
        console.log(arr1.length);//6
        console.log(ret1);//6

2、unshift(item1,item2...)
功能:在数组头添加一个或多个元素
参数:要添加的元素
返回值:添加数据后数组的长度

        var arr2 = [1,2,3,4,5];
        var ret2 = arr2.unshift(8);
        console.log(arr2);//[8, 1, 2, 3, 4, 5]
        console.log(arr2.length);//6
        console.log(ret2);//6

3、pop()
功能:在数组的末尾删除一个元素
参数:无
返回值:被删除的元素

        var arr3 = [1,2,3,4,8];
        var ret3 = arr3.pop();
        console.log(arr3);//[1, 2, 3, 4]
        console.log(arr3.length);//4
        console.log(ret3);//8
```
4、shift()
**功能**:在数组的头删除一个元素
**参数**:无
**返回值**:被删除的元素
```
        var arr4 = [1,2,3,4,5];
        var ret4 = arr4.shift();
        console.log(arr4);//[2, 3, 4, 5]
        console.log(arr4.length);//4
        console.log(ret4);//1
```
5、join(str)
**功能:**将数组的元素用参数字符串拼接成一个新的字符串
**参数:**一个字符串
**返回值:**拼接的结果
```
        var arr5 = [1,2,3,4,5];
        var ret5 = arr5.join(" good ");
        console.log(arr5);//1 good 2 good 3 good 4 good 5
        console.log(arr5.length);//5
        console.log(ret5);//1
        console.log(typeof(ret5));//string
```
6、reverse()
**功能:**倒置数组
**参数:**无
**返回值:**倒置以后的数组
```
        var arr6 = [1,2,3,4,5];
        var ret6 = arr6.reverse();
        console.log(arr6);//[5, 4, 3, 2, 1]
        console.log(arr6.length);//5
        console.log(ret6);//[5, 4, 3, 2, 1]
        console.log(typeof(ret6));//object 对象类型
```
7、slice(startIndex,endIndex)
**功能:**在数组中,从startIndex下标开始一直截取到endIndex下标之前
**参数:**开始和结束的下标
**返回值:**截取的数据数组
**注意:**不包含endIndex下标处的元素    
```
        var arr7 = [1,2,3,4,5,6,7,8,9,10];
        var ret7 = arr7.slice(3,7);
        console.log(arr7);//[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
        console.log(arr7.length);//10
        console.log(ret7);//[4, 5, 6, 7]
        console.log(typeof(ret7));//object 对象类型
```
8、splice(下标,个数,item1,item2...)
**功能:**是在数组的中间添加或者删除一些元素
**参数:**分为必选参数和可选参数
必选参数:下标、个数
可选参数:item1,item2...
######添加元素
添加:个数为0,从下标处开始添加可选参数中的元素
注意:如果下标大于原数组最大的下标,都是在数组最后添加元素
```
    var arr8 = [1,2,3,4,5]//[1,2,8,9,3,4,5]
    var ret8 = arr8.splice(2,0,8,9);
    console.log(arr8);//[1, 2, 8, 9, 3, 4, 5]
    console.log(arr8.length);//7
    console.log(ret8);//空
    console.log(ret8.length);//0
```
**删除元素**
删除:不需要可选参数,从下标开始删除对应个数的数组
返回值:删除的数组元素
```
    var arr10 = [1,2,3,4,5,6,7,8,9,10]
    var ret10 = arr10.splice(2,6);
    console.log(arr10);//[1, 2, 9, 10]
    console.log(arr10.length);//4
    console.log(ret10);//[3, 4, 5, 6, 7, 8]
    console.log(ret10.length);//6
```
9.concat()
**功能**:将多个数组拼接成一个数组
**参数**:一个或多个数组
**返回值**:拼接之后的数组,新的数组是所有数组的元素
```
        var arr9 = [1,2,3];
        var num9 = [4,5,6];
        var str9 = [7,8,9];
        var ret9 = arr9.concat(num9,str9);
        console.log(arr9);//[1, 2, 3]
        console.log(num9);//[4, 5, 6]
        console.log(str9);//[7, 8, 9]
        console.log(ret9);//[1, 2, 3, 4, 5, 6, 7, 8, 9]
```
10.indexOf(item)
**功能:**从数组的左侧开始查找对应第一次出现的参数元素的下标
**参数**:元素值
**返回值**:如果找到了对应的元素则返回该元素的下标值,否则返回-1
```
        var arr11 = [1,2,3,3,4,5,3,7,8]
        var ret11 = arr11.indexOf(3);
        console.log(arr11);//[1,2,3,3,4,5,3,7,8]
        console.log(ret11); //2 
```
11.lastIndexOf(item)
**功能:**从数组的右侧开始查找对应第一次出现的参数元素的下标
**参数**:元素值
**返回值**:如果找到了对应的元素则返回该元素的下标值,否则返回-1 
```
        var arr12 = [1,2,3,3,4,5,3,7,8]
        var ret12 = arr12.lastIndexOf(3);
        console.log(arr12);//[1, 2, 3, 3, 4, 5, 3, 7, 8]
        console.log(ret12); //6
```
###数组的排序
只介绍简单的基本排序,后续有需要会加补
冒泡排序
```
    var arr = [5,4,3,2,1];

    //               i<数组的元素个数-1
    for (var i = 0; i<arr.length-1;i++){
    //                  i<数组的元素个数-1
        for (var j = 0; j<arr.length-1-i;j++){
            if (arr[j]>=arr[j+1]) {
                var temp = arr[j];
                arr[j] = arr[j+1];
                arr[j+1] = temp;
            }
        }
    }
    console.log(arr);
    //升序:大于等于
    //降序:小于等于
```
默认升序排序
```
    var str = [4,5,2,3,1];
    //默认升序排序
    // str.sort ();
    console.log(str)
```
也可以排降序,但是需要给排序的标准
```
        //降序排序
    str.sort (compare);
    function compare(v1,v2){
            if (v1<v2) {
                return 1;
            }
            return -1;
    }
```
###多维数组
多维数组:数组的元素是数组
```
        var a = [1,2,3];
        var b = [4,5,6];
        var c = [7,8,9];

        var arr = [a,b,c];
        console.log(arr);
        console.log(arr[1][2]);
```
#####gao

相关文章

网友评论

    本文标题:JavaScript关于数组

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