查漏补缺系列--js数组操做

昨天学弟去某公司面试实习，回来讲竟然被一些基础题给绊了脚，幸亏本身慢慢回忆起来，没有致使太尴尬的局面。其中有一题就是问：js数组操做中，有哪些会影响到数组自己？哪些不会影响？分别举例说明。其实这个问题咱们平时都能接触到不少，项目中处处都有数组，追加、截取、替换、遍历不少，但是忽然被问起这种问题可能还会心中咯噔一下，因此咱们今天就来好好梳理一下，js数组操做中的几个容易忽略的知识点。

1.建立数组的三种方法

（1）建立定长空数组：初始化一个长度为10的空数组

// 语法： var arr = new Array(len)
var arr = new Array(10); // 建立一个长度为10的空数组，每一项都为undefined复制代码

（2）建立一个包含有数据的数组：每一项都被初始化了赋值了

// 语法： var cols = new Array(data1,data2,……)
// 数组中的数据类型能够不一样，可是通常建立一个数组建议是同一类数据
var arr = new Array(1, 'a', 'hello', true);复制代码

（3）简单语法糖

var arr = []; // 建立一个空数组，长度为0复制代码

2.数组的操做

（1）遍历

for循环：

for(var i=0; i<arr.length; i++){
    console.log(arr[i]);
}复制代码

map：

打标记：返回一个新的数组，不影响原来的数组

（2）push/pop末尾追加/删除

打标记：修改的是原数组

push()：追加不会去重，返回值是追加后的数组长度

pop()：删除数组最后一个元素，返回值是被删除的那个元素

（3）unshift/shift

打标记：修改的是原数组

unshift()：将参数顺序添加到数组开头，返回值是新数组的长度

shift()：删除数组的第一个元素，返回值是被删除的那个元素

（4）join：

用于把数组中的全部元素放入一个字符串，元素是经过指定的分隔符进行分隔的,若是不指定，则默认为逗号（','）

打标记：获得一个新的字符串，不修改原来的数组

（5）reverse：反排序

打标记：影响原来的数组

（6）sort排序：对数组中元素进行排序 arrayObject.sort(sortBy)

打标记：影响原来的数组

• 即便数组中的每一项都是数值，sort()方法比较的也是字符串sort()
• 方法能够接受一个比较函数做为参数
• sortBy必须是函数

降序排列（升序排列同理）：

var arr=[1,5,8,2,-3,20,15];
// 降序
arr.sort(function(a,b){console.log(a,b); return b-a})复制代码

我特地把每次比较的数据打印出来，不难看出，这是符合冒泡排序的，两两比较，true则换位，继续和前一个比较，直到顶部，而后下一个值开始进行第二轮比较。

（7）concat：用于链接两个或多个数组

打标记：返回一个新的数组，不影响原来的数组，同时不会去重

附加：若是须要去重，ES5能够利用for循环，ES6能够运用拓展运算符、

数组的from和set方法进行处理，具体from()，set用法就在这里不赘述了，代码以下：

（8）slice：从已有数组中返回选定的元素

打标记：返回一个新的数组，不影响原来的数组

// 语法 arrayObject.slice(start, end);复制代码

start必填：规定从何处开始选取，若是是负数，从数组尾部开始算起

end选填，给定从何处结束选取，是数组片断结束处的数组下标（不包含该元素）

w3c中说明start是必填项，可是实际上slice()中若是不填写参数的话，也能正常返回结果，返回的是数组自己。

（9）splice

打标记：会修改原来的数组

• 删除：arrayObject.splice(index, count); 删除从index开始的0个或多个元素，返回值是被删除的元素的数组
• 插入：arrayObject.splice(index, 0, item1,……,itemX) 在指定的位置插入值，index：起始位置，0：要删除的项数，item1……itemX：要插入的项
• 替换：arrayObject.splice(index,count,item1,……,itemX); 指定位置插入值，同时删除任意数量的项

（10）其余

length：返回数组长度

indexOf()：从数组的指定位置开始向后查找，第一个命中值所在的位置

   返回值：查找项在数组中的位置，没有找到返回-1

// 语法： arrayObject.indexOf(searchValue, startIndex)复制代码

   lastIndexOf：从数组的末尾开始查找

   indexOf和lastIndexOf支持IE9+浏览器

这种查询方法和属性都不会影响数组自己

总结：经过上面的整理，咱们应该能很清晰地知道，map、join、concat、slice这些方法在操做数组的时候是返回一个新的对象，而不会影响到被操做的数组自己。而push、pop、shift、unshift、reverse、sort、splice这种增删改性质的方法会直接修改数组自己，因此在项目中进行这一类数组操做的时候须要特别注意，防止一处修改，致使其余引用的异常。

附：感谢您的阅读，也但愿对您有所帮助。同时若是以上内容中存在疑问和错误，欢迎留言或者私信。