JS数组的常用方法总结

1.创建数组

let arr = ['apple', 'banana'];
console.log(arr, '---------访问数组'); //[ 'apple','banana' ]

2.通过索引访问元素

let arr = ['apple', 'banana'];
let first = arr[0];
console.log(first, '----通过索引访问数组'); //'apple'
console.log(arr[arr.length - 1], '-------访问数组中最后一位元素') //'banana'

3.遍历数组

let arr = ['apple', 'banana'];
arr.forEach((item, index, array) => {
    console.log(item, '------item')  //'apple' 'banana'
    console.log(index, '------index') // 0,1
    console.log(array, '-----array') //['apple','banana']
})

4.push() 添加元素到数组末尾

let arr = ['apple', 'banana'];
arr.push('orange');
console.log(arr, '----添加元素到数组末尾'); // ['apple', 'banana', 'orange' ]

5.pop() 删除数组末尾元素

let arr = ['apple', 'banana','orange'];
arr.pop();
console.log(arr, '----删除数组末尾元素'); //['apple', 'banana']

6.shift() 删除数组最前面的元素

let arr = ['apple', 'banana'];
arr.shift();
console.log(arr, '----删除数组最前面的元素') //[ 'banana' ]

7.unshift() 添加元素到数组的头部

let arr = ['banana'];
arr.unshift('eggs');
console.log(arr, '----添加元素到数组的头部')  //[ 'eggs', 'banana' ]

8.indexOf() 查看某个某个元素在数组中的位置,存在就是当前下标，如果不存在就为-1；

let arr = [ 'eggs','banana'];
let index = arr.indexOf('banana');
console.log(index, '------查看某个某个元素在数组中的位置；') //1
//--------------------
let index1 = arr.indexOf('watermelon');
console.log(index1, '------查看某个某个元素在数组中的位置；') //-1

9.splice是数组中最强大的功能之一，增，删，改

let arr = [ 'eggs','banana'];
splice(index,howmany,string1,string2) 
//index整数，规定添加/删除项目的位置，使用负数可从数组结尾处规定位置,end要删除的项目数量。如果设置为 0，则不会删除项目。string1,string2是插入或替换的元素
arr.splice(0, 1, 'grapes'); //在0的位置删除一个元素，并且加入一个元素 ，删除插入
console.log(arr,'------') //[ 'grapes', 'banana' ] '------'
arr.splice(1, 2, 'fruits'); //在下标为1的位置插入2个元素，如果后面只传了一个就插入一个
console.log(arr,'------') //[ 'grapes', 'fruits' ] '------'
arr.splice(2, 2, 'fruits', 'fruits'); //在下标为2的位置插入2个元素
console.log(arr,'------') //[ 'grapes', 'fruits' ] '------'
arr.splice(0, 1);  //删除元素
console.log(arr, '---通过索引删除某个元素')

• splice() 方法可删除从 index 处开始的零个或多个元素，并且用参数列表中声明的一个或多个值来替换那些被删除的元素。
• 如果从 arrayObject 中删除了元素，则返回的是含有被删除的元素的数组。
• 该方法会改变原始数组

10.slice 不会改变原数组()

let arr=[ 'fruits', 'fruits', 'fruits' ];
let copyArr = arr.slice();  //拷贝数组
console.log(copyArr) //[ 'fruits', 'fruits', 'fruits' ]
let sliceArr = arr.slice(0, 1);  //获取元素 
console.log(sliceArr)  //[ 'fruits' ]

• slice( start,end ) 方法可从已有的数组中返回选定的元素。

• 返回一个新的数组，包含从 start 到 end （不包括该元素）的 arrayObject 中的元素。

• 该方法并不会修改数组，而是返回一个子数组。如果想删除数组中的一段元素，应该使用方法 Array.splice()。

11.Array.from() 方法从一个类似数组或可迭代对象中创建一个新的数组实例。

const bar = ['a', 'b', 'c'];
Array.from(bar);
const foo = Array.from('foo');
console.log(foo); //[ 'f', 'o', 'o' ] 

• es6新特性中Array类多了一个静态方法from

12.Array.isArray() 用于确定传递的值是否是一个 Array。

console.log(Array.isArray([1, 2, 3])) //true
console.log(Array.isArray('str')) //false
console.log(Array.isArray({ 'foo': '1' })) //false
console.log(Array.isArray(null)) //false
console.log(Array.isArray(undefined)) //false

13.Array.of() 方法创建一个具有可变数量参数的新数组实例

console.log(Array.of(5)) //[5] 创建一个数组为[5]
console.log(Array.of(1, 2, 3)) //[1,2,3]
console.log(Array.of(1, [1, 23], 3)) //[ 1, [ 1, 23 ], 3 ]

14.concat() 方法用于合并两个或多个数组。此方法不会更改现有数组，而是返回一个新数组。

let array1 = ['a', 'b'];
let array2 = ['1', '2'];
let array3 = [].concat(array1, array2);
console.log(array3) //[ 'a', 'b', '1', '2' ]

15.array.copyWithin(target, start, end)

• target 必需。：从该位置开始替换数据。
• start 必需。从该位置开始读取数据，默认为 0 。如果为负值，表示倒数。
• end 可选。到该位置前停止读取数据，默认等于数组长度。如果为负值，表示倒数。 (默认为 array.length)
  *es6 特性

let copyWithinArr = ["alpha", "beta", "copy", "delta"].copyWithin(1, 2, 3);
1=='beta'
2=='copy'
3=='delta'
console.log(copyWithinArr) // [ 'alpha', 'copy', 'copy', 'delta' ]
let copyWithinArr1 = ["alpha", "beta", "copy", "delta"].copyWithin(2, 0);
console.log(copyWithinArr1) //[ 'alpha', 'beta', 'alpha', 'beta' ]

16.entries() 方法返回一个新的Array Iterator对象(可迭代对象)，该对象包含数组中每个索引的键/值对。迭代对象中数组的索引值作为 key， 数组元素作为 value。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.entries();

var entries = ["a", "b", "c"];
var iterator = entries.entries();
console.log(iterator, '---')
console.log(iterator.next().value, '---')
console.log(iterator.next())
var iter = entries.entries();
var a = [];
// for(var i=0; i< arr.length; i++){   // 实际使用的是这个 
for (var i = 0; i < arr.length + 1; i++) {    // 注意，是length+1，比数组的长度大
    var tem = iter.next();             // 每次迭代时更新next
    console.log(tem.done);             // 这里可以看到更新后的done都是false
    if (tem.done !== true) {             // 遍历迭代器结束done才是true
        console.log(tem.value);
        a[i] = tem.value;
    }
}
console.log(a);  // [ [ 0, 'a' ], [ 1, 'b' ], [ 2, 'c' ] ] 遍历完毕，输出next.value的数组

• keys()方法返回一个新的Array迭代器，它包含数组中每个索引的键。 返回的是下标
• values() 方法返回一个新的 Array Iterator 对象，该对象包含数组每个索引的值

for (let index of ['a', 'b'].keys()) {
  console.log(index);
}
// 0  
// 1  

17.every() 方法测试数组的所有元素是否都通过了指定函数的测试。

function isBigEnough(element, index, array) {
    return (element >= 10);
}
var passed = [12, 5, 8, 130, 44].every(isBigEnough);
// passed is false
passed = [12, 54, 18, 130, 44].every(isBigEnough);
// passed is true

18.some() 方法测试数组中的某些元素是否通过由提供的函数实现的测试。

console.log([1,2,3,4,5].some(isBigEnough),'----some'); //一个都没有通过false 
// passed is false
console.log([12, 54, 18, 1,2].some(isBigEnough),'--------some'); //只要有一个通过即为true
// passed is true

19.fill() 方法用一个固定值填充一个数组中从起始索引到终止索引内的全部元素。

arr.fill(value，start，end)
let fillArr = [1, 2, 3, 4, 5];
console.log(fillArr.fill(3)) //[ 3, 3, 3, 3, 3 ]
console.log(fillArr.fill(2, 0, 2)) //[ 2, 2, 3, 3, 3 ]
console.log(fillArr.fill(5, 1)) // 2, 5, 5, 5, 5 ]

20.filter() 方法创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。

let filter = (value) => {
    return value > 10
}
console.log([15, 13, 2, 16, 3].filter(filter))  // 15, 13, 16 ]

21.find() 方法返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。

console.log([15, 13, 2, 16, 3].find(filter))  // 15 返回第一个满足条件的值  否则undefined

22.findIndex()方法返回数组中满足提供的测试函数的第一个元素的索引。否则返回-1。

console.log([15, 13, 2, 16, 3].findIndex(filter))  // 0 返回第一个满足条件的下表  否则-1

23.forEach() 方法对数组的每个元素执行一次提供的函数。 //item是值,index下标,array是原数组

fillArr.forEach((item, index, array) => console.log(item))

24.includes() 方法用来判断一个数组是否包含一个指定的值，根据情况，如果包含则返回

console.log(fillArr.includes(2)) //true 检查数组中是否有该值有为true，否则false
console.log(fillArr.includes(4)) //false  

25.indexOf()方法返回在数组中可以找到一个给定元素的第一个索引，如果不存在，则返回-1。

console.log(fillArr.indexOf(2))  //0
console.log(fillArr.indexOf(4))  //-1 

26.join() 方法将一个数组（或一个类数组对象）的所有元素连接成一个字符串并返回这个字符串。

let joinArr = ['Wind', 'Rain', 'Fire'];
console.log(joinArr.join());  //Wind,Rain,Fire

27.lastIndexOf() 方法返回指定元素（也即有效的 JavaScript 值或变量）在数组中的最后一个的索引，如果不存在则返回 -1。从数组的后面向前查找，从 fromIndex 处开始。

console.log(['a','b'].lastIndexOf('a'));   //0  从后面往前面找

28.map() 方法创建一个新数组，其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。

let numbers=[1,2,3,45,7,8,9];
let doubles=numbers.map(x=>x+1);
console.log(doubles,'------map') //[ 2, 3, 4, 46, 8, 9, 10 ] '------map'

29.reduce() 方法对累加器和数组中的每个元素（从左到右）应用一个函数，将其减少为单个值。

const reduceArr=[1,2,3,4,5,6];
const reduce=(accumulator,currentValue)=>{
    console.log(accumulator,'-------accumulator'); //累加的值
    console.log(currentValue,'-------currentValue'); //当前元素
    return accumulator+currentValue
};
console.log(reduceArr.reduce(reduce))  //21 从左往右

30.reduceRight() 方法接受一个函数作为累加器（accumulator）和数组的每个值（从右到左）将其减少为单个值。

console.log(reduceArr.reduceRight(reduce))  //21 从右往左

31.reverse() 方法将数组中元素的位置颠倒。

console.log(reduceArr.reverse()) //[ 6, 5, 4, 3, 2, 1 ] 数组顺序颠倒

32.sort() 数组的元素进行排序，并返回数组

let items = [
    { name: 'Edward', value: 21 },
    { name: 'Sharpe', value: 37 },
    { name: 'And', value: 45 },
    { name: 'The', value: -12 },
    { name: 'Magnetic' ,value :0},
    { name: 'Zeros', value: 37 }
  ];
  items.sort((a,b)=>{
      return a.value-b.value
  })

  console.log(items)

  items.sort((a,b)=>{
    var nameA = a.name.toUpperCase(); // ignore upper and lowercase
    var nameB = b.name.toUpperCase(); // ignore upper and lowercase
    if (nameA < nameB) {
        return -1;
      }
      if (nameA > nameB) {
        return 1;
      }
    // names must be equal
    
      return 0;
    // return   nameA-nameB  转成NAN
  })
  console.log(items)

33.toLocaleString()返回一个字符串表示数组中的元素。数组中的元素将使用各自的 toLocaleString 方法转成字符串，

  let str=[1,2,3,4,5];
  console.log(str.toLocaleString())  //1,2,3,4,5