JS中数组那些事~
Posted Mrspao
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JS中数组那些事~相关的知识，希望对你有一定的参考价值。
今天闲的没事，看了一些关于数组的操作，好久木有用过，很多都已经忘记的差不多了，所以今天花了一个小时写了一些demo，准备备份一下方便以后使用~~~
下面是一些工作当中，经常用到的数组的方法，小伙伴可以自行选择自己的喜好~~~
<!DOCTYPE html> <html> <head> <title>array</title> </head> <body> </body> <script type="text/javascript"> var arr = [1,2,3,4,5], arr1 = [10,4,5,2,8,99]; /* A instanceof B A是不是B造出来的 */ console.log(arr instanceof Array) //true /* Array.isArray(a) 变量a是否是数组 */ console.log(Array.isArray(arr)) //true console.log(Array.isArray(2)) //false /* toString() 数组转为字符串，用“ ， ”链接; join也能达到这种效果 */ console.log(arr.toString()) /* 数组.join(‘符号‘) 将数组以符号链接形成字符串 */ console.log(arr.join(‘$‘)) console.log(arr.join(‘ ‘)) /* push 在数组末尾添加 pop 在数组末尾删除 */ arr.push(‘paoAfter‘) console.log(arr); arr.pop() console.log(arr); /* unshift 在数组最前面添加 shift 在数组最前面删除 */ arr.unshift(‘paoUnshift‘) console.log(arr) arr.shift() console.log(arr) /* 数组的排序 */ /* reverse 数组翻转 */ console.log(arr.reverse()) /* sort() ???? 数组排序，从小到大 */ console.log(arr.sort()) //利用回调函数对数组大小进行排序 arr1.sort(function (a,b) { return a - b; }) console.log(arr1) /* 数组元素的操作 */ /* 数组1.concat(数组2) 拼接两个数组 */ console.log(arr.concat(arr1)) //数组去重1： Array.prototype.arrUnique = function () { // 先排序 this.sort(); // 定义一个新数组从排序后的数组的第一个开始接收值 var arr = [this[0]]; // 从第二个数值开始比较 for (var i = 1; i < this.length; i++) { //比较相邻的值不一样时，新数组接收值，达到去重效果 //原数组的第一个与新数组的最后一个相比较 if( this[i] !== arr[arr.length - 1]) { arr.push(this[i]) } } return arr; } var arrnew = arr.concat(arr1).arrUnique() console.log(arrnew) // 数组去重2 var r=[], arr = [‘apple‘, ‘strawberry‘, ‘banana‘, ‘pear‘, ‘apple‘, ‘orange‘, ‘orange‘, ‘strawberry‘]; for(var i=0,len=arr.length;i<len;i++){ //如果新的数组中找不到arr数组中的元素，将数组元素存放在新数组中 if(r.indexOf(arr[i])===-1){ r.push(arr[i]); } } /* slice 数组的截取 数组.slice(开始的索引，结束的索引) */ console.log(arr.slice(3)) //从索引值为3截取到最后 console.log(arr.slice(0,3)) //从索引值为1到3截取 console.log(arr.slice(-2)) //负数后几个 /* 数组.splice (开始索引值，删除几个，替换内容1，替换内容2，....) 同slice有点雷同 */ console.log(arr.splice(3)) //从索引值为3截取到最后 console.log(arr) console.log(arr.splice(0,3)) //从索引为0开始删除3个 console.log(arr) console.log(arr1) console.log(arr1.splice(1,2,‘a‘,‘b‘)) //从索引为1开始删除2个，并用‘a’，‘b’替换删除的内容 console.log(arr1) /* 数组.indexOf(元素) （从左往右） 数组中是否包含元素，如果包含，返回对应的索引；如果不包含，返回-1 数组.lastIndexOf(元素) （从右往左） */ console.log(arr1.indexOf(2)) //index：0 console.log(arr1.indexOf(990)) //-1；查不到 console.log(arr1.lastIndexOf(2)) //index：0 console.log(arr1.lastIndexOf(990)) //-1；查不到 /* 数组迭代 */ /* 数组.map(function (item,index,array) { return newArr}) */ var sporter =[{ name:‘aa‘, isHell:null },{ name:‘bb‘, isHell:null },{ name:‘cc‘, isHell:true }]; var arr2 = []; sporter.map(function (item,index,array) { if ( item.isHell ) { arr2.push(item.name); } }) console.log(arr2) // es6写法 sporter.map( item => { if ( item.isHell ) { arr2.push(item.name); } }) console.log(arr2) /* 数组.filter(function (item,index,array) { return newArr}) 返回符合条件的元素为true的数组 */ var arr = sporter.filter( item => {return item.isHell}); console.log(arr) var arr = sporter.filter( item => item.isHell); console.log(arr) console.log(‘-1‘ == false) //false // 数组去重3 var arr3 = [1,2,3,2,3,5,6,6]; var arr = arr3.filter(function(item,index,self) { console.log(item+‘----------------‘+self) return self.indexOf(item) == index; }); console.log(arr) /* every() 数组中的每一项运行给定函数，如果该函数对每一项都返回true，则返回true ; some() 对数组中的每一项运行给定函数，如果该函数对任一项返回true，则返回true; */ var arr = sporter.every(function (item) { return item.isHell; }) console.log(arr) var arr = sporter.some(function (item) { return item.isHell; }) console.log(arr) /* forEach() 和for循环一样，没有返回值 */ var arr = sporter.forEach(function(item) { item.sex = ‘man‘ }) console.log(arr) //因为forEach没有返回值，所以是undefined /* 数组.redval(a,b) 这个方法一般用在累计累加上，实用技巧暂时还没发现。比如，数字数组求和，字符串数组连接上 */ // 数组求和，数组的拼接 var sum=0,arr=[1,2,3,4,5,6]; sum = arr.reduce(function (a,b) { return a + b; }) /* 数组.find(val) 方法返回传入一个测试条件（函数）符合条件的数组第一个元素。 */ var arr4 = [1,2,3,4]; var a = arr4.find(function(val){ return val > 2; }) console.log(a) /* 数组.findIndex(val) findIndex：方法返回传入一个测试条件（函数）符合条件的数组第一个元素位置。 如果不存在，则返回-1；如果存在满足条件的，返回符合条件的第一个索引； */ var a = arr4.findIndex(function(val) { return val > 4; }) console.log(a) //-1 /* 数组的清空 */ var arr5 = [‘a‘,‘b‘,‘c‘,1]; arr5.length = 0; //伪数组无法清空 console.log(arr5) arr5.splice(0); //从索引为0开始截取到最后一个，伪数组无法清空 console.log(arr5); arr5 = []; //推荐使用，伪数组可用 // 伪数组：就是长的像数组，不过没有数组的方法，不能添加删除元素 fn(111,222,333); function fn() { arguments.length = 0; //无法清空 console.log(arguments); arguments.splice(0) console.log(arguments); //报错 arguments = [] console.log(arguments) } </script> </html>
好啦，有需要了解的
以上是关于JS中数组那些事~的主要内容，如果未能解决你的问题，请参考以下文章