JavaScript的数组与循环

JavaScript的数组与循环

数组

数组是JavaScript中一种重要的复合型数据类型。内部对象Array封装了所有与数组相关的方法和属性，其内部存在多个数据段组合存储。可以形象的理解为一种有很多连续的房间的楼层，每个房间都可以存放货物，提取货物时只需要给出楼层编号和房间的编号就可以了。

一、数组的创建

创建数组的方式1：

直接使用new运算符调用Array对象的构造函数，例如创建一个没有任何元素的数组 arr ，代码如下：

var arr = new Array(); //创建数组

创建数组的方式2：

给构造函数传递数组元素为参数，代码如下：

var arr = new Array(10, 20, 30, “string”, 40); //创建带指定元素的数组
给构造函数传递参数的元素参数可以是任何JavaScript数据类型，JavaScript数组各元素的类型可以不一样，上述代码创建了一个具有5个元素的数组 arr

创建数组的方式3：

不调用构造函数，直接将元素放入“[]”即可，元素间用“,”分隔。代码如下：

var arr = [ 10, 20, 30, “string”, 40]; //创建数组
上述代码将创建一个具有5个元素的数组 arr ，效果和方式2完全一样。

创建数组的方式4：

给构造函数传递数组元素个数可以创建具有指定元素个数的数组。代码如下：

var arr = new Array(4); //创建指定长度的数组
上述代码创建了一个有4个元素的数组 arr 。数组元素的下标从0开始，使用“数组名[下标]”的方式访问数组里面的元素。

二.数组的方法

数组原型方法主要有以下这些：

1. join()： join(separator): 将数组的元素组起一个字符串，以separator为分隔符，省略的话则用默认用逗号为分隔符，该方法只接收一个参数：即分隔符。

2. push()和pop()： push(): 可以接收任意数量的参数，把它们逐个添加到数组末尾，并返回修改后数组的长度。
   pop()：数组末尾移除最后一项，减少数组的 length 值，然后返回移除的项

3. shift() 和 unshift()： shift()：删除原数组第一项，并返回删除元素的值；如果数组为空则返回undefined 。
   unshift:将参数添加到原数组开头，并返回数组的长度 。

4. sort()

5. reverse()

6. concat() )：将参数添加到原数组中。这个方法会先创建当前数组一个副本，然后将接收到的参数添加到这个副本的末尾，最后返回新构建的数组。在没有给 concat()方法传递参数的情况下，它只是复制当前数组并返回副本。

7. slice()：返回从原数组中指定开始下标到结束下标之间的项组成的新数组。slice()方法可以接受一或两个参数，即要返回项的起始和结束位置。在只有一个参数的情况下， slice()方法返回从该参数指定位置开始到当前数组末尾的所有项。如果有两个参数，该方法返回起始和结束位置之间的项——但不包括结束位置的项。

8. splice()：可以实现删除、插入和替换。

   • 删除：可以删除任意数量的项，只需指定 2 个参数：要删除的第一项的位置和要删除的项数。例如， splice(0,2)会删除数组中的前两项。

   • 插入：可以向指定位置插入任意数量的项，只需提供 3 个参数：起始位置、 0（要删除的项数）和要插入的项。例如，splice(2,0,4,6)会从当前数组的位置 2 开始插入4和6。

   • 替换：可以向指定位置插入任意数量的项，且同时删除任意数量的项，只需指定 3 个参数：起始位置、要删除的项数和要插入的任意数量的项。插入的项数不必与删除的项数相等。例如，splice (2,1,4,6)会删除当前数组位置 2 的项，然后再从位置 2 开始插入4和6。

   splice()方法始终都会返回一个数组，该数组中包含从原始数组中删除的项，如果没有删除任何项，则返回一个空数组。

9. indexOf()和 lastIndexOf() （ES5新增）

10. forEach() （ES5新增）

11. map() （ES5新增）

12. filter() （ES5新增）

13. every() （ES5新增）

14. some() （ES5新增）

15. reduce()和 reduceRight() （ES5新增）

16. some 判断数组中的所有元素是否满足条件，有一个成立 则返回true 否则false

 let arr3=[10,5,6,1,12,8,3,5,4];
    let bol = arr3.some(function(value){
        if(value>100){
            return value;
        }
    })
    console.log(arr3);
    console.log(bol);

17. includes 判断条件中是否有满足元素 有则返回true 没有则返回false

let arr2=[10,5,6,1,12,8,3,5,4];
let item1= arr2.includes(15);
console.log(item1);

18. find 返回数组中满足条件的第一个元素

  let arr1=[10,5,6,1,12,8,3,5,4];

    let item= arr1.find(function(value){
        if(value>10){
            return value;
        }
    })

    console.log(item);

19. findIndex 返回数组中满足条件的第一个元素下标

   let arr=[10,5,6,1,12,8,3,5,4];

    let index= arr.findIndex(function(value){
        if(value>10){
            return value;
        }
    })
    console.log(index);

三.数组变异和非变异：

变异：push()和pop()，shift() 和 unshift()，sort()，splice()

非变异：join()，concat()，slice()，indexOf()和 lastIndexOf() （ES5新增），forEach() （ES5新增），some() （ES5新增）,fliter() (ES5新增)，map() （ES5新增），every() （ES5新增），reduce()和 reduceRight() （ES5新增）

循环

循环分类：

1 for循环

  for(let i=0;i<arr.length;i++){

​    document.write(arr[i]+"<br/>");

  }

2 while循环 循环次数未知

let i=0;

  while(i<arr.length){

​    document.write(arr[i]+"<br/>");

​    i++;

  }

3 do while()循环 下标 / key / 键 【至少执行一次（先执行，后判断）】

let i = 0;
do{
    //循环代码块
    document.write(arr[i]+"<br/>");
    i++;
}

while(i < arr.length); 

4 for of 【循环遍历数组】

  for(let value of arr){

​    document.write(value+"<br/>");

  }

5 for in 循环 下标 / key/ 键 【循环遍历对象】

  for(let i in arr){

​    document.write(i);

  }

6 forEach() 数组方法 匿名回调函数 【循环遍历数组】

arr.forEach(function(value,index,oldarr){

​    document.write(index+"--"+value+"--"+oldarr+"<br/>");

  });