js数组&字符串常用方法（一）

数组常用方法

includes()
用于判断数组中是否存在某个元素，返回布尔值

const arr = [1, 2, 3, 4, 5]
console.log(arr.includes(4))
// true

forEach()
最常用的遍历数组的方法，该方法不会改变原数组，且无返回值。

const arr = [1, 2, 3, 4, 5]
arr.forEach( item => console.log(item) )
// 1
// 2
// 3
// 4
// 5

map()
map()也是常用的数组遍历方法，该方法会返回一个新的数组，但不会改变原来的数组，默认返回undefined。

const arr = [1, 2, 3, 4, 5, 6]
const newArr = arr.map( item => item + 1 )
newArr // [2, 3, 4, 5, 6, 7]

// 若没有隐式或显示返回指的话，得到的数组是所有元素都为 undefined 的数组
const arr = [1, 2, 3]
const newArr = arr.map( item => console.log(item) )
newArr // [undefined undefined undefined]

find()
该方法根据检索条件，找到数组中第一个满足条件的元素并返回，若找不到则返回 undefined。

const arr = [1, 23, 45, 6, 7, 34]
const item = arr.find( item => item > 6 )
item // 23

findeIndex()
该方法根据检索条件返回第一个符合条件的元素的索引，若找不到则返回-1。

const arr = [1, 23, 45, 6, 7, 34]
const item1 = arr.findIndex( item => item > 24 )
const item2 = arr.findIndex( item => item > 50 )
item1 // 2
item2 // -1

filter()
该方法用来过滤数组，返回一个新的数组，不改变原数组，若无符合条件的返回一个空数组。

const arr = [1, 2, 3, 4, 6, 8, 9, 12]
const newArr1 = arr.filter( item => item % 2 === 0 )
const newArr2 = arr.filter( item => item % 5 === 0 )
newArr1 // [2, 4, 6, 8, 12]
newArr2 // []

push() & pop()

• push()方法在数组末尾添加一个元素，返回数组的长度。

const arr = [1, 2, 3, 4, 5]
const pushArr = arr.push(6)
arr // [1, 2, 3, 4, 5, 6]
pushArr // 6

• pop()方法删除数组最后一个元素，并返回该元素。

const arr = [1, 2, 3, 4, 5, 6]
const popArr = arr.pop()
arr // [1, 2, 3, 4, 5]
popArr // 6

unshift() & shift()

• unshift()方法在数组开头添加一个元素，返回数组的长度。

const arr = [1, 2, 3]
const unshiftArr = arr.unshift(9)
arr // [9, 1, 2, 3]
unshiftArr // 4

• shift()方法删除数组第一个元素并返回该元素

const arr = [1, 2, 3]
const shiftArr = arr.shift()
arr // [2, 3]
shiftArr // 1

concat()
该方法在一个数组的后面拼接新的元素，可接收n个参数，参数可以是任意类型，如果是数组，则将数组与原数组拼接，如果是其他数据类型，则将该元素添加到元素组后面。该方法不改变原数组，会返回拼接好的新数组，因此可以进行链式操作。

const arr1 = [1, 2, 3]
const arr2 = ['a', 'b', 'c']
const newArr = arr1.concat(arr2, '哈哈哈').concat('hello world')

arr1 // [1, 2, 3]
newArr // [1, 2, 3, 'a', 'b', 'c', '哈哈哈', 'hello world']

reverse()
该方法能够将数组倒置，返回新的数组，并且会改变原数组。

const arr = [1, 2, 3, 4]
const reverseArr = arr.reverse()
arr // [4, 3, 2, 1]
reverseArr // [4, 3, 2, 1]

sort()
sort()方法用法语将数组排序，可以接收一个函数作为参数，当不传递参数时，sort方法将按照内部定义的升序的规则进行排序，该方法返回排序后的数组，元素组将被改变。

const arr = [3, 5, 2, 7, 1, 0, 10, 2, 100, 76]
const sortArr = arr1.sort()
arr // [0, 1, 10, 100, 2, 2, 3, 5, 7, 76]
sortArr // [0, 1, 10, 100, 2, 2, 3, 5, 7, 76]
//默认的排序算法是调用每个数组项的 toString() 转型方法，比较得到的字符串的编码大小，按照最小的值在前面，最大值在后面的方式排序。也就是正序与倒序。

//正序
sortArr = arr.sort((c, d) => c - d)
//倒序
sortArr = arr.sort((c, d) => d - c)

//举例：
const arr = [
  { id: 4, name: 'michael' },
  { id: 2, name: 'kangkang' },
  { id: 3, name: 'meria' },
  { id: 1, name: 'jane' },
]
const newArr = arr.sort((a, b) => b.id - a.id)
newArr /* [
  { id: 4, name: 'michael' },
  { id: 3, name: 'meria' },
  { id: 2, name: 'kangkang' },
  { id: 1, name: 'jane' }
] */

join() & split()

• join()方法将数组的元素组成一个字符串，只接收一个参数：即分隔符，该方法返回拼接后的字符串，不改变元素组。

const arr = [1, 2, 3, 'hello', 'world']
const joinArr = arr.join(' ')
joinArr // 1 2 3 hello world

// 通过join()方法可以实现重复字符串
const repeatStr = (str, n) => new Array(n).join(str)
const newArr = repeatStr('hi', 3)
newStr /*
'hihi'  只打印两个hi，这两个hi是作为分隔符存在的，
 Array(3)给了一个长度为3的数组，但是数组中的3个元素是空白，
而hi分隔这3个空白，也就达到了重复字符串的效果。*/

• split()方法将一个字符串分割为数组，接收一个参数，以该参数为分割符

const str = 'hello world'
const arr = str.split('w')
// 作为分割符的参数会被截取掉
arr // ['hello', 'orld']

every() & some()

• every()方法接收一个函数作为参数，判断数组中每一项是否满足条件，只有数组中的所有项都满足条件，才会返回true。

const arr = [1, 2, 3, 4, 5]
const trueArr = arr.every( item => item >= 1 )
const falseArr = arr.every( item => item > 5 )
trueArr // true
falseArr // false

• some()方法接收一个函数作为参数，数组中只要有一项满足条件，就返回true，如果都不满足，则返回false。

const arr = [1, 2, 3, 4, 5]
const trueArr = arr.some(item => item > 1)
const falseArr = arr.some(item => item > 5)
trueArr // true
falseArr //false

indexOf() & lastIndexOf()
两个方法都用来查找索引，接收两个参数，第一个参数就是要查找的元素，第二个参数是查找的起始位置（默认第一项和最后一项的位置）。都会返回该元素的正索引，不同的是当有第二个参数时，indexOf()只查找该元素之后的元素，lastIndexOf()只查找该元素之前的元素。若找到该元素返回索引，若找不到则返回-1。

const arr = ['a', 'b', 'c', 'd', 'e', 'f', 'g']
//从 索引0 开始往后查找 b 这个元素
const index = arr.indexOf('b', 0)
//从 索引0 开始往前查找 b 这个元素
const lastIndex = arr.lastIndexOf('b', 0)

index // 1
lastIndex // -1

slice()
slice(start, end)接收两个参数(元素的索引)，返回[start, end)之间的元素数组，不改变元素组。

const arr = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h']
const sliceArr = arr.slice(2, 6)
sliceArr // ["c", "d", "e", "f"]

//slice() 还可以接收负数作为参数， -1 为倒数第一个元素， -2 为倒数第二个元素，以此类推

splice()
该方法向/从数组中添加/删除项目，然后返回被删除的项目，该方法会改变原始数组。

arr.splice(index, howmany, item)
index // 必需。整数，规定添加/删除项目的位置，可使用负数
howmany //必需。要删除的项目数量。如果设置为 0，则不会删除项目
item //可选，项数组添加的新项目
const arr = [1, 2, 3, 4, 5]
// 从索引为2的位置开始，删除3个，再将6，7，8添加进去
const spliceArr = arr.splice(2, 3, 6, 7, 8)
arr // [1, 2, 6, 7, 8]
spliceArr // [3, 4, 5]

reduce()
reduce 为数组中的每一个元素依次执行回调函数，不包括数组中被删除或从未被赋值的元素，接受四个参数：初始值（或者上一次回调函数的返回值），当前元素值，当前索引，调用 reduce 的数组。
语法：

arr.reduce(callback,[initialValue])
callback （执行数组中每个值的函数，包含四个参数）

    1、previousValue （上一次调用回调返回的值，或者是提供的初始值（initialValue））
    2、currentValue （数组中当前被处理的元素）
    3、index （当前元素在数组中的索引）
    4、array （调用 reduce 的数组）

initialValue （作为第一次调用 callback 的第一个参数。）

应用：

arr.reduce((prev, current, index, array) => {}, initaialValue)

数组求和
const arr = [1, 2, 3, 4]
const sum = arr.reduce((prev, current) => prev + current, 0)
sum // 10

数组求积
const arr = [1, 2, 3, 4]
const pow = arr.reduce((prev, current) => prev * current)
pow //24

数组去重
const arr = [1, 2, 4, 4, 5, 6, 2, 4, 3]
const slimArr = arr.reduce((prev, current) => {
    if(prev.includes(current)) {
        return prve
    } else {
        return prev.concat(current)
    }
})