js中遍历数组的方法总结，以及数组中常用方法总结

1. 数组的常用方法

Array.isArray() —检测是不是数组

// Array.isArray 方法返回一个布尔值，表示参数是否为数组。它可以弥补typeof 运算符的不足
        var arr = ["hello"];
        console.log(typeof arr); // 数组是特殊类型的对象,不能用typeof检测

        console.log(arr instanceof Array); // true   instanceof是检测某个实例是不是某个对象的实例化对象
        console.log(Array.isArray(arr));// true    返回boolean类型值：true/false

pop push —末端删除/末端添加 会改变原数组,返回数组长度

        var arr1 = ['11'];
        var result = arr1.push('22'); // push返回值：数组长度用result来接收
        console.log(arr1); // ['11', '22']

		var arr2 = ['11','22','33'];
        var element = arr2.pop();// pop返回值：被删除的元素的文本信息
        console.log(element);// 33
        console.log(arr2); // ['11','22']

shift unshift ----首端删除/首端添加 会改变原数组,返回被删除元素值

        var arr = ['11','22','33'];
        var element = arr.shift();
        console.log(arr); // ['22','33']
        console.log(element);// 11  

		arr.unshift("00");
        console.log(arr); // ['00', '11', '22', '33']

join —拼接数组成字符串

        var arr = ['11','22'];
        console.log(arr.join()); //11,22
        console.log(arr.join("")); //1122
        console.log(arr.join("&")); //11&22

// 数组的join 配合字符串的split 可以实现数组与字符串的互换
        var arr = ["a","b","c"];
        //console.log(arr.join(""));// abc
        var result = arr.join("");
        console.log(result.split(""));//["a","b","c"]

concat —合并数组，将新数组添加到原数组尾部，返回新数组，【原数组不变】

// 除了数组作为参数， concat 也接受其他类型的值作为参数，添加到目标数组尾部。
        var arr4 = [1,2,3];
        console.log(arr4.concat(4,5,6,7));// [1, 2, 3,4, 5, 6, 7]
        console.log(arr4); // [1,2,3]
// 合并数组类型和数字类型的数据
		console.log([1,2,3].concat(4,5,6,[7,8,9]));// [1, 2, 3, 4, 5, 6, 7,8,9]

reverse —颠倒元素排列，改变原数组

        var arr = ["11","22","33"];
        console.log(arr.reverse()); // ['33', '22', '11']
        console.log(arr); // 原数组被改变了 //  ['33', '22', '11']

splice —删除数组元素，会改变原数组

        var arr = ['a','b','c','d','e','f'];
        var result = arr.splice(2,2,"cc","dd");
        console.log(arr); // ['a', 'b', 'cc', 'dd', 'e', 'f']
        console.log(result); // ['c', 'd']

sort —按照字典方式排列，会改变原数组

//sort 方法不是按照大小排序，而是按照字典顺序。即先比较数字的第一位，逐位比较。所以101 排在11 的前面
        var arr3 = [123,45,76,2,66,788];
        console.log(arr3.sort()); // [123, 2, 45, 66, 76, 788]

// sort 方法改进
        var arr4 = [13,4,77,1,7];
        // 数组排序固定写法，可以解决sort问题
        arr4.sort(function(a,b){
            //return a - b; // 按升序顺序排列
            return b - a; // 按降序顺序排列  [77, 13, 7, 4, 1]
        });

        console.log(arr4); //[1,4,7,13,77]

indexOf / lastIndexOf — 返回数组所在位置的索引值

// 【indexOf 方法】返回给定元素在数组中第一次出现的位置，如果没有找到，则返回-1
// 【lastIndexOf 方法】返回给定元素在数组中最后一次出现的位置，如果没有找到则返回-1
    <script>
        var arr = [10,20,30,40,50,60];
        console.log(arr.indexOf(60)); // 5    所在位置
        console.log(arr.indexOf(70)); // -1   不存在
//indexOf 方法还可以接受第二个参数，表示搜索的开始位置
        console.log(arr.indexOf(20,3)); // -1


//lastIndexOf方法
        var arr1 = [10,10,20,20,50,10];
        console.log(arr1.indexOf(10)); // 0
        console.log(arr1.lastIndexOf(10)); // 5
/*这两个方法不能用来搜索NaN 的位置，即它们无法确定数组成员是否包含NaN,
这是因为这两个方法内部，使用严格相等运算符（ === ）进行较，而NaN 是唯一一个不等于自身的值*/
        var arr2 = [10,20,NaN];
        console.log(arr2.indexOf(NaN )); // -1
        console.log(arr2.lastIndexOf(NaN )); // -1

2. for循环

        var arr = ["11","22","33"];
        console.log(arr[0]);// 读取第1位置的数据
        console.log(arr[1]);// 读取第2位置的数据
        console.log(arr[2]);// 读取第3位置的数据

// for循环遍历数组
        for(var i = 0; i < 3; i++){
            console.log(arr[i]);
        }
//遍历数组改进  将for中的i<3,变为i
        for(var j = 0; j < arr.length; j++){
            console.log(arr[j]);
        }

3. while循环

//  while循环遍历数组
        var m = 0;
        while(m < arr.length){
            console.log(arr[m]);
            m++;
        }

4. for…in…遍历数组

// for...in遍历数组
        for(var item in arr){// item是数组中的下标，也可以写成i
            console.log(arr[item]);
        }

for…in…遍历对象

// for...in 循环用来遍历一个对象的全部属性,【一般遍历对象都会用for..in..形式】
        var user5 = {
            name:"wangwu",
            age:18,
            sex:"man"
        }
        for(var i in user5){ // i是字符串形式
            console.log(i);
            console.log(user5[i]);//wangwu  18  man
        }

5. es6的扩展运算符遍历数组

// 利用扩展运算符(...)，直接展开数组【更方便】
   var arr1 = [100,200,300];
   console.log(...arr1); // 100  200  300

6. es6 — find()遍历数组

var arr1 = [10,20,30,40,50];
arr1.find(function(value,index,arr){
    if(value > 20){
        console.log(value); // 30 40 50
    }
})

7.es6 — findIndex()遍历数组 :可以遍历到NaN

// 查一个数组中是否有NaN,indexOf()无法索引到NaN
         var arr2 = [10,20,NaN];
         console.log(arr2.indexOf(NaN)); // -1  

// findIndex可以遍历NaN(了解性知识)
         arr2.findIndex(function(value,index,arr){
             if(Number.isNaN(NaN)){
                 console.log(index); // 2
             }
         })

8. es6 – for…of …遍历数组，

唯一的区别是keys() 是对键名的遍历、values() 是对键值的遍历， entries() 是对键值对的遍历

// entries()，keys() 和 values()遍历数组
         var arr5 = [10,20,30,40];
        //  遍历键（索引号）
         for(let item of arr5.keys()){
             console.log(item); // 0 1 2 3
         }
        //  遍历值
         for(let item of arr5.values()){
             console.log(item); // 10 20 30 40
         }
        // 遍历键值对应关系
         for(let item of arr5.entries()){
             console.log(item); // [0, 10][1, 20][2, 30][3, 40]
         }

for…of… 遍历字符串

	let str = "hello";
	for(let i of str){
	   console.log(i); // i代表每一个字符 // h e l l o
	}