常用Array数组操作方法

定义一个测试数组

constplayers=[{name:'科比',num:24},{name:'詹姆斯',num:23},{name:'保罗',num:3},{name:'威少',num:0},{name:'杜兰特',num:35}]复制代码

1、forEach

参数代表含义

item：遍历项

index：遍历项的索引

arr：数组本身

Array.prototype.sx_forEach=function(callback){for(leti=0;i<this.length;i++){callback(this[i],i,this)}}players.sx_forEach((item,index,arr)=>{console.log(item,index)})//{name:'科比',num:24}0//{name:'詹姆斯',num:23}1//{name:'保罗',num:3}2//{name:'威少',num:0}3//{name:'杜兰特',num:35}4复制代码

2、map

参数代表含义

item：遍历项

index：遍历项的索引

arr：数组本身

Array.prototype.sx_map = function (callback) {
    const res = []
    for (let i = 0; i < this.length; i++) {
        res.push(callback(this[i], i, this))
    }
    return res
}

console.log(players.sx_map((item, index) =>`${item.name}--${item.num}--${index}`))
// [ '科比--24--0', '詹姆斯--23--1', '保罗--3--2', '威少--0--3', '杜兰特--35--4' ]
复制代码

3、filter

参数代表含义

item：遍历项

index：遍历项的索引

arr：数组本身

Array.prototype.sx_filter = function (callback) {
    const res = []
    for (let i = 0; i < this.length; i++) {
        callback(this[i], i, this) && res.push(this[i])
    }
    return res
}

console.log(players.sx_filter(item => item.num >= 23))
// [//     { name: '科比', num: 24 },//     { name: '詹姆斯', num: 23 },//     { name: '杜兰特', num: 35 }// ]
复制代码

4、every

参数代表含义

item：遍历项

index：遍历项的索引

arr：数组本身

Array.prototype.sx_every = function (callback) {
    let flag = truefor (let i = 0; i < this.length; i++) {
        flag = callback(this[i], i, this)
        if (!flag) break
    }

    return flag
}

console.log(players.sx_every(item => item.num >= 23)) // falseconsole.log(players.sx_every(item => item.num >= 0)) // true
复制代码

5、some

参数代表含义

item：遍历项

index：遍历项的索引

arr：数组本身

Array.prototype.sx_some = function (callback) {
    let flag = falsefor (let i = 0; i < this.length; i++) {
        flag = callback(this[i], i, this)
        if (flag) break
    }

    return flag
}

console.log(players.sx_some(item => item.num >= 23)) // trueconsole.log(players.sx_some(item => item.num >= 50)) // false
复制代码

6、reduce

参数代表含义

pre：前一项

next：下一项

index：当前索引

arr：数组本身

Array.prototype.sx_reduce = function (callback, initValue) {
    let start = 0, pre
    if (initValue) {
        pre = initValue
    } else {
        pre = this[0]
        start = 1
    }
    for (let i = start; i < this.length; i++) {
        pre = callback(pre, this[i], i, this)
    }
    return pre
}

// 计算所有num相加const sum = players.sx_reduce((pre, next) => {
    return pre + next.num
}, 0)
console.log(sum) // 85
复制代码

7、findIndex

参数代表含义

item：遍历项

index：遍历项的索引

arr：数组本身

Array.prototype.sx_findIndex = function (callback) {
    for (let i = 0; i < this.length; i++) {
        if (callback(this[i], i, this)) {
            return i
        }
    }
    return-1
}

console.log(players.sx_findIndex(item => item.name === '科比')) // 0console.log(players.sx_findIndex(item => item.name === '安东尼')) // -1
复制代码

8、find

参数代表含义

item：遍历项

index：遍历项的索引

arr：数组本身

Array.prototype.sx_find = function (callback) {
    for (let i = 0; i < this.length; i++) {
        if (callback(this[i], i, this)) {
            returnthis[i]
        }
    }
    returnundefined
}

console.log(players.sx_find(item => item.name === '科比')) // { name: '科比', num: 24 }console.log(players.sx_find(item => item.name === '安东尼')) // undefined
复制代码

9、fill

用处：填充数组

参数代表含义

initValue：填充的值

start：开始填充索引，默认0

end：结束填充索引，默认length - 1

Array.prototype.sx_fill = function (value, start = 0, end) {
  end = end || this.length
  for (let i = start; i < end; i++) {
      this[i] = value
  }
  returnthis
}

console.log(players.sx_fill('林三心', 1, 3))
// [//     { name: '科比', num: 24 },//     '林三心',//     '林三心',//     '林三心',//     { name: '杜兰特', num: 35 }// ]
复制代码

10、includes

用处：查找元素，查到返回true，反之返回false，可查找NaN

Array.prototype.sx_includes = function (value, start = 0) {
    if (start < 0) start = this.length + start
    constisNaN = Number.isNaN(value)
    for (let i = start; i < this.length; i++) {
        if (this[i] === value || Number.isNaN(this[i]) === isNaN) {
            returntrue
        }
    }
    returnfalse
}

console.log([1, 2, 3].sx_includes(2)) // trueconsole.log([1, 2, 3, NaN].sx_includes(NaN)) // trueconsole.log([1, 2, 3].sx_includes(1, 1)) // false
复制代码

11、join

用处：将数组用分隔符拼成字符串，分隔符默认为,

Array.prototype.sx_join = function (s = ',') {
    let str = ''for(let i = 0; i < this.length; i++) {
        str = i === 0 ? `${str}${this[i]}` : `${str}${s}${this[i]}`
    }
    return str
}

console.log([1, 2, 3].sx_join()) // 1,2,3console.log([1, 2, 3].sx_join('*')) // 1*2*3
复制代码

12、flat

Array.prototype.sx_flat = function () {
    let arr = thiswhile (arr.some(item =>Array.isArray(item))) {
        arr = [].concat(...arr)
    }
    return arr
}

const testArr = [1, [2, 3, [4, 5]], [8, 9]]

console.log(testArr.sx_flat())
// [1, 2, 3, 4, 5, 8, 9]
复制代码

13、splice

难点

截取长度和替换长度的比较，不同情况

Array.prototype.sx_splice = function (start, length, ...values) {
  length = start + length > this.length - 1 ? this.length - start : length
  const res = [], tempArr = [...this]
  for (let i = start; i < start + values.length; i++) {
    this[i] = values[i - start]
  }
  if (values.length < length) {
    const cha = length - values.length
    for (let i = start + values.length; i < tempArr.length; i++) {
      this[i] = tempArr[i + cha]
    }
    this.length = this.length - cha 
  }
  if (values.length > length) {
    for (let i = start + length; i < tempArr.length; i++) {
      this.push(tempArr[i])
    }
  }
  for (let i = start; i < start + length; i++) {
    res.push(tempArr[i])
  }
  return res
}