Javascript之数组

简介

// 数组字面量创建数组(推荐) var empty = []; // 没有元素的数组 var primes = [2, 3, 5, 7, 11]; // 有5个数值的数组 var misc = [1.1, true, "a"]; // 3个不同类型的元素 // 数组直接量中的值不一定要是常量,可以是任意的表达式 var base = 1024; var table = [base, base+1, base+2, base+3]; // 也可以包含对象直接量或其他数组直接量 var b = [[1, {x:1, y:2}], [2, {x:3, y:4}]]; // new 关键字创建数组 // 调用时没有参数 var a = new Array(); // 调用时有一个数值参数,它指定长度 var a = new Array(10); // 显式指定多个数组元素或者数组的一个非数值元素 var a = new Array(5, 4, 3, 2, 1, "testing");

常用方法

数组Array属性和方法整理

判断是否为数组

  • 方法一:instanceof
const arr = [1, 2, 3] console.log(arr instanceof Array)
  • 方法二:constructor
const arr = [1, 2, 3] console.log(arr.constructor === Array)
  • 方法三:toString
const arr = [1, 2, 3] console.log(Object.prototype.toString.call(arr) === '[object Array]')
  • 方法四:Array.isArray()
const arr = [1, 2, 3] console.log(Array.isArray(arr))

案例

数组去重

  • 方法一:利用Set
const unique = arr => Array.from(new Set(arr)) const arr = [1, 2, 2, 3, 4, 2, '1', 1] console.log(unique(arr))
  • 方法二:双层循环,外层循环元素,内层循环时比较值。值相同时,则删去这个值
function unique(arr) { for (let i = 0; i < arr.length; i++) { for (let j = i + 1; j < arr.length; j++) { if (arr[i] === arr[j]) { arr.splice(j, 1) j-- } } } return arr }
  • 方法三:利用indexOf
function unique(arr) { if (!Array.isArray(arr)) return const resArr = [] arr.forEach(item => { if (resArr.indexOf(item) === -1) { resArr.push(item) } }) return resArr }
  • 方法四:利用includes
function unique(arr) { if (!Array.isArray(arr)) return const resArr = [] arr.forEach(item => { if (!resArr.includes(item)) { resArr.push(item) } }) return resArr }
  • 方法五:利用hasOwnProperty
function unique(arr) { if (!Array.isArray(arr)) return const obj = {} return arr.filter((item, index, arr) => { const key = typeof item + item return obj.hasOwnProperty(key) ? false : (obj[key] = true) }) }
  • 方法六:使用filter
function unique(arr) { return arr.filter((item, index, array) => { return array.indexOf(item) === index }) }

多维数组去重

  • 一维数组去重
var arr = [2,3,4,2,3,5,6,4,3,2]; var unique = function(arr) { var result = []; arr.forEach(function(item){ if(result.indexOf(item) < 0){ result.push(item); } }); return result; } console.log(unique(arr)); // [2,3,4,5,6]
  • 二维数组去重
var arr = [2,3,4,[2,3,4,5],3,5,[2,3,4,2],4,3,6,2]; var unique = function(arr){ var result = []; arr.forEach(function(item) { if (Array.isArray(item)) { item.forEach(function(i) { if (result.indexOf(i) < 0) { result.push(i); } }); } else { if (result.indexOf(item) < 0) { result.push(item); } } }); return result; } console.log(unique(arr)); // [2,3,4,5,6]
  • 三维或多维数组去重
var arr = [2,3,4,[2,3,[2,3,4,2],5],3,5,[2,3,[2,3,4,2],2],4,3,6,2]; var unique = function(arr) { var result = []; var f = function(i) { i.forEach(function(item) { if (Array.isArray(item)) { f(item); } else { if (result.indexOf(item) < 0) { result.push(item); } } }); }; f(arr); return result; } console.log(unique(arr)); // [2,3,4,5,6]

数组扁平化

数组扁平化是指将一个多维数组变为一维数组,例如:[1, [2,3, [4,5]]] ------> [1,2,3,4,5]

  • 方法一:使用数组的toString方法,将数组变为字符串然后再用split分割还原为数组
const flatten = arr => arr.toString().split(',').map(item => Number(item)) const arr = [1, [2, 3, [4, 5]]] console.log(flatten(arr))
  • 方法二:和上面的toString一样,join也可以将数组转换为字符串
const flatten = arr => arr.join(',').split(',').map(item => Number(item))
  • 方法三:递归的遍历每一项,若为数组则继续遍历,否则concat
function flatten(arr) { let resArr = [] arr.forEach(item => { if (Array.isArray(item)) { resArr = resArr.concat(flatten(item)) } else { resArr.push(item) } }) return resArr }
  • 方法四:使用reduce改写上面的方法
function flatten(arr) { return arr.reduce((result, item) => { if (Array.isArray(item)) { result = result.concat(flatten(item)) } else { result.push(item) } return result }, []) } // 简化写法一 function flatten(arr) { return arr.reduce((result, item) => { return Array.isArray(item) ? result.concat(flatten(item)) : [...result, item] }, []) } // 简化写法二 function flatten(arr) { return arr.reduce((result, item) => { return result.concat(Array.isArray(item) ? flatten(item) : [item]) }, []) }
  • 方法五:做一个遍历,若arr中含有数组则使用一次扩展运算符,直至没有为止
function flatten(arr) { while(arr.some(item => Array.isArray(item))) { // concat参数可以有多个。不是输入的话相当于push arr = [].concat(...arr) } return arr }
  • 方法六:借助 apply/call
function flatten(arr) { while(arr.some(item => Array.isArray(item))) { arr = Function.apply.call([].concat, [], arr) } return arr }
  • 方法七:ES6 flat
// 慎用:比如node就不支持 const flatten = arr => arr.flat(Infinity)

某对象是否在对象数组中

文章列表articleList,文章obj1obj2是否在文章列表数组中
判断条件:文章id相同即可

const articleList = [ { id: 1, title: '文章一', content: 'this is a test page'}, { id: 2, title: '文章二', content: 'this is a test page'}, { id: 3, title: '文章三', content: 'this is a test page'}, { id: 4, title: '文章四', content: 'this is a test page'}, { id: 5, title: '文章五', content: 'this is a test page'}, { id: 6, title: '文章六', content: 'this is a test page'}, { id: 7, title: '文章七', content: 'this is a test page'}, { id: 8, title: '文章八', content: 'this is a test page'}, { id: 9, title: '文章九', content: 'this is a test page'}, { id: 10, title: '文章十', content: 'this is a test page'} ] const obj1 = { id: 5, title: '文章5', content: 'this is a test page'} const obj2 = { id: 20, title: '文章20', content: 'this is a test page'} const itemInList = (item, list) => list.some(obj => item.id === obj.id) console.log(itemInList(obj1, articleList)) // true console.log(itemInList(obj2, articleList)) // false

对象数组合并去重

两个对象数组合并并去除重复项,然后根据id排序
重复条件:对象的id相同

const list1 = [ { id: 1, title: '文章一', content: 'this is a test page'}, { id: 2, title: '文章二', content: 'this is a test page'}, { id: 3, title: '文章三', content: 'this is a test page'}, { id: 4, title: '文章四', content: 'this is a test page'}, { id: 5, title: '文章五', content: 'this is a test page'}, { id: 10, title: '文章六', content: 'this is a test page'}, { id: 15, title: '文章七', content: 'this is a test page'}, ] const list2 = [ { id: 3, title: '文章三', content: 'this is a test page'}, { id: 4, title: '文章四', content: 'this is a test page'}, { id: 5, title: '文章五', content: 'this is a test page'}, { id: 6, title: '文章六', content: 'this is a test page'}, { id: 7, title: '文章七', content: 'this is a test page'}, { id: 8, title: '文章八', content: 'this is a test page'}, { id: 9, title: '文章九', content: 'this is a test page'}, { id: 10, title: '文章十', content: 'this is a test page'} ] // 方法一:从list2筛选出不在list1的项。跟list1进行拼接 // let arr = list2.filter(item => { // return !list1.some(obj => obj.id === item.id) // }) // let list = list1.concat(arr) // 合并去重后的结果 // list.sort((a, b) => a.id - b.id) // 根据id递增排序 // console.log(list) // 方法二:list2循环,每一项判断是否在list1中,如果不在,往list1里面插 list2.forEach(item => { !list1.some(obj => obj.id === item.id) && list1.push(item) // 若该项不在list1中,push进去 }) list1.sort((a, b) => a.id - b.id) // 根据id递增排序 console.log(list1)

对象数组去除指定项

去除id为4、6、9的项

const arr = [4, 6, 9] let list = [ { id: 1, title: '文章一', content: 'this is a test page'}, { id: 2, title: '文章二', content: 'this is a test page'}, { id: 3, title: '文章三', content: 'this is a test page'}, { id: 4, title: '文章四', content: 'this is a test page'}, { id: 5, title: '文章五', content: 'this is a test page'}, { id: 6, title: '文章六', content: 'this is a test page'}, { id: 7, title: '文章七', content: 'this is a test page'}, { id: 8, title: '文章八', content: 'this is a test page'}, { id: 9, title: '文章九', content: 'this is a test page'}, { id: 10, title: '文章十', content: 'this is a test page'} ] list = list.filter(item => arr.indexOf(item.id) === -1) console.log(list)

创作不易,若本文对你有帮助,欢迎打赏支持作者!

 分享给好友: