JavaScript-数组

1. JS数组的概念

数组的字面意思就是一组数据,一组数据(一般情况下是相同类型的数据, 不一定都是数字)

2. 数组的作用

使用单独的变量名来存储一系列的值, 数组是特殊的变量,它可以同时保存一个以上的值。

如上节课中我们学过的arguments就是一个数组, 里面保存了多个参数.

数组的定义和使用

1.数组的定义

方式一:  
      new Array(参数,参数,...): 只有一个数字参数时是数组的长度(new可以省略,但一般尽量写上)
例如: 
     var arr = new Array();   //定义一个空数组 
     var arr = new Array(10);  //创建一个包含 10 个元素的数组,没有赋值
     var arr = new Array(“芙蓉姐姐”,30);  //创建一个数组有两个元素
方式二: 
     var arr = [1,2,3,4,5];  //字面量定义方式

2.数组元素的获取(访问)

arr[0]: 表示数组的第一个元素,0是下标,也叫索引
arr[1]: 表示数组的第二个元素,1是下标 

3.数组的赋值
给数组赋值,就是给数组的元素赋值,需要通过给数组的每个元素一一赋值,

    如:arr[0] = 20;  //让数组的第一个元素的值为20;
           arr[1] = 12;  //让数组的第二个元素的值为12;

以下为通过for循环给数组的每个元素赋值,赋成下标的平方。

for(var i=0;i<10;i++){
       arr[i] = i*i;
  }

4.数组的使用
使用数组就是在使用数组的每个元素,因为数组相当于若干个相同类型的变量。
遍历数组:
之前我们讲过通过下标获取单个数组元素, 但有时候我们需要批量使用数组, 这个时候我们需要遍历整个数组.

1, 普通for循环
   for(var i=0; i<5; i++){
        console.log(arr[i]);
   }
  2, for...in遍历:  用于遍历数组或者对象
   for(var i in arr){
        console.log(arr[i]);
   }

3、数组的方法

1.concat() 用于连接两个或多个数组

注意:concat()该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本。

   var arr=[1,2,3,4];
   var arr1=[5,6];
   console.log(arr.concat(arr1))   // [1,2,3,4,5,6]
   //多个合并
   var arr3=arr.concat(arr1,99,true,[])  //[1, 2, 3, 4, 5, 6, 99, true]

l

2.join() 根据指定分隔符将数组中的所有元素放入一个字符串,并返回这个字符串。
    var arr = [1,2,3,4,5];
    console.log(arr.join());         //1,2,3,4,5
    console.log(arr.join("-"));      //1-2-3-4-5
    console.log(arr);                //[1,2,3,4,5]---原数组未改变

l

3.slice(a,b) 截取原数组的元素

注意:a和b都可以为负数,负数时表示从最后一位开始算起,如-1表示最后一位。

 var arr = [1,2,3,4,5];
    console.log(arr.slice(1,3));         //[2,3]
    console.log(arr.slice(-3,-1));      //[3,4]

l

4.splice() 向数组中添加,删除,或替换元素,然后返回被切割的部分。
var arr =[11,22,33,44,55];
    console.log(arr.splice());       //[]
    console.log(arr);                  //[11, 22, 33, 44, 55]
    console.log(arr.splice(1));           //[22, 33, 44, 55]
    console.log(arr);                  //[11]
    var arr =[11,22,33,44,55];
    console.log(arr.splice(2,2));  //[33, 44]
    console.log(arr);               //[11, 22, 55]

l

5.toString() 将数组转换成字符串.

注意:该方法会在数据发生隐式类型转换时被自动调用,如果手动调用,就是直接转为字符串。

var arr = [1,2,3,4,5];
    console.log(arr.toString());         //1,2,3,4,5
    console.log(arr);                      //[1,2,3,4,5]

l

6.indexOf(a,b) 查询数值在数组中出现的位置,

a为要查询的数据;b为开始查询的位置,
注意:如果不存在指定的数据,返回-1,indexOf()不会对数组产生改变。

   var arr = [1,2,3,4,5,5,5,6,7,8,9];
    console.log(arr.indexOf(5));        //4
    console.log(arr.indexOf(5,7));      //-1 5的位置是4,5,6 ,所以参数位置7取不到5

l

7.lastIndexOf(a,b) 从后面往前面查询数值在数组中出现的位置,

a为要查询的数据;b为开始查询的位置,
注意:如果不存在指定的数据,返回-1,indexOf()不会对数组产生改变。

    var arr = [1,2,3,4,5,5,5,6,7,8,9];
    console.log(arr.lastIndexOf(5));        //6
    console.log(arr.lastIndexOf(5,3));      //-1 5的位置是4,5,6,所以参数位置3取不到5

l

8.pop() 删除数组的最后一位

注意:pop()方法会返回被删除的元素,并改变原来数组

var arr=[1,2,3,4];
arr.pop();//  4会被删除
console.log(arr)   // [1,2,3]

l

9.push() 往数组的最后一位添加新的多个成员,

注意:push()方法会返回新数组的长度,并改变原来数组

  var arr=[1,2,3,4];
  arr.push("这里是4.5",5); // 数组的长度会被增加到6
  console.log(arr)// [1,2,3,4,"这里是4.5",5];

l

10.unshift() 往数组的地第一个位置添加多个成员,

注意:unshift()方法会返回新数组的长度,并改变原来数组

var arr=[1,2,3,4,5];
  arr.unshift("11","22"); //长度会增加到7
  console.log(arr) // ["11","22",1,2,3,4,5];

l

11.shift() 删除数组第一个位置的成员,

注意:shift()方法返回被删除的成员,并且会改变原来数组

  var arr=[1,2,3,4,5];
  arr.shift() // 1 被删除
  console.log(arr)  // [2,3,4,5]

l

12.sort() 它是根据ASCII码的码值,进行比较,如果成员十位数以上的,就不准备,就需要在 sort()里定义一个函数,改函数2个参数, a-b,升序,否则b-a 降序

但是在排序前,会先调用数组的toString方法,将每个元素都转成字符之后,再进行排序,此时会按照字符串的排序,逐位比较,进行排序。

  var arr=[1,2,5,4,3,6];
  arr.sort(function(a,b){
      retrun a-b; //升序    
      //如果是b-a则会降序
 }) 

  var arr=[1,2,5,4,3,6];
console.log(arr.sort());    //[1,2,3,4,5,6]
 console.log(arr);            //[1,2,3,4,5,6]---原数组改变

l

13.reverses() 倒序排列数组
  var arr=["1","3","2"];
  arr.reverses() // ['2','3','1']

4.数组的高阶函数

什么是高阶函数?
1.把一个函数当做另一个函数
2.一个函数,内部返回另外一个函数

1.forEach(a,b,c) 用来遍历数组

注意:forEach()没有返回值,是ES5新增方法,不会修改原数组
a表示遍历到的数组的数据,b表示对应的索引,c表示数组自身。

 var arr=[1,2,3,4];
//forEach  纯粹遍历
    var res =arr.forEach(function (el,index,self) {
        console.log(el,index,self)
    })
//1-0-1,2,3,4   //el-index-aaa,其中aaa表示函数自身
//2-1-1,2,3,4
//3-2-1,2,3,4
//4-3-1,2,3,4
//undefined       //undefined---forEach没有返回值
2.map(a,b,c) 也是做遍历,有返回值,返回新数组

注意:map的回调函数会将执行结果返回,并将执行结果组成新数组返回。
a表示遍历到的数组的数据,b表示对应的索引,c表示数组自身。

var arr =[11,22,33,44,55];
    //返回一个新数组,请将每个元素放大10倍,得到一个新数组
    var arr1=arr.map(function (el,index) {
        return el*10;
    })
    console.log(arr1)  //[110, 220, 330, 440, 550]
    console.log(arr)  //[11, 22, 33, 44, 55]
3.some(a,b,c) 判断数组中是否存在满足条件的项,只要有一项满足条件,就会返回true。

a表示遍历到的数组的数据,b表示对应的索引,c表示数组自身。
注意:
1.some 如果有一个条件满足,就返回ture
2.some() 不会对空数组进行检测。

    var arr = [11, 22, 33, 44, 55];
    //el,每个成员
    // index,每个成员下标
    // aaa,原来的数组

    var res = arr.some(function (el, index, self) {
        return el == 33;
    })
    console.log(res)
4.every(a,b,c) 判断数组中每一项是否都满足条件,只有所有项都满足条件,才会返回true。

a表示遍历到的数组的数据,b表示对应的索引,c表示数组自身。

 var arr =[11,22,33,44,55];
    var res = arr.every(function (el, index, self) {
    return el>33;
    })
    console.log(res)   //false
5.filter(a,b,c) 过滤,返回一个过滤后的新数组

a表示遍历到的数组的数据,b表示对应的索引,c表示数组自身。

 var arr =[11,22,33,44,55];    
var newArr= arr.filter(function (el) {
        return el>20
    })
    console.log(newArr)  //22,33,44
6.reduce() 从数组的第一项开始,逐个遍历到最后,迭代数组的所有项,然后构建一个最终返回的值。
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 本文主要介绍js数组元素的一些基本操作,常用的一些方法 关键词:创建数组、新增数组元素、删除数组元素、将数组变成字...
    家里有棵核桃树阅读 659评论 1 9
  • 一、数组的概念 所谓数组,是有序的元素序列。(一组有序 数据) JavaScript的Array可以包含任意数据类...
    MJ的小世界阅读 298评论 0 1
  • 数组 1.特性 。数组是一组按顺序排列的集合,集合中的每个值称为元素 。JavaScript数组可以包含任意数据类...
    Demetris阅读 136评论 0 0
  • 每天一句: 如果你不是领头羊,那么看到的东西都是一样的。 Array数组类型,这和其他语言中的数组有着很大的区别。...
    EndEvent阅读 327评论 0 0
  • 1、以构造数组的形式来构建数组,有以下几种方式 定义一个空的数组:var array1 = new Array()...
    _我爱吃柠檬_阅读 419评论 0 1