Array Methods
There are many methods inside js array, usually develop in common, such as forEach, map, filter, etc., followed by an array of methods and summary of some use for future access.
1. join()
- All elements in the array and connected together into a string, the string returned last generated
- Can specify an optional string generated in the string to separate the individual elements of the array, the default is a comma
var a = [1,2,3,4]
console.log(a.join()); // "1,2,3,4"
console.log(a.join(""); // "1234"
console.log(a.join(" ")); // "1 2 3 4"
console.log(a.join("-")); // "1-2-3-4"
复制代码2. reverse()
- The elements in the array sorting flashback, return data inversions
- Not regenerate array, but rearrange the array on the basis of the original
var a = ['a','b','c','d']
console.log(a.reverse()); // ["d", "c", "b", "a"]
复制代码3. sort()
- The sorted array element in the array (in ascending order) after sorting and returns
- When invoked with no parameters sort, the array elements sorted in alphabetical order
var a = ['aa', 'dd', 'bb', 'cc']
console.log(a.sort()); // ["aa", "bb", "cc", "dd"]
var a = [20,10,5,2,3,4]
console.log(a.sort()); // [10,2,20,3,4,5] ???? 没有进行排序？？？
复制代码- this is why?
The reason: [in the sort time, sort the array method calls the toString method to each item, no matter what type of array elements, will turn into a string compare]
You can solve the problem in the following ways
var a = [20,10,5,2,3,4]
function sequence(a,b){
5 return a - b;
6 }
7 console.log(arr.sort(sequence)); // [2,3,4,5,10,20]
//[总结]：
// A.若 a 小于 b，在排序后的数组中 a 应该出现在 b 之前，则返回一个小于 0 的值。
// B.若 a 等于 b，则返回 0。
// C.若 a 大于 b，则返回一个大于 0 的值
复制代码4. concat()
- Connecting two or more arrays
- It returns a new array does not change the original array
var a = ['a','b']
console.log(a.concat([3,4,5])) // ["a", "b", 3, 4, 5]
console.log(a) // ['a','b']
复制代码5. push () and pop ()
- push (): additive element in the end of the array, return the array length, will change the original array
- pop (): Delete the last item array, returns the element removed, it will change the original array
var a = ['a','b']
console.log(a.push('c')) // 3 返回数组长度
console.log(a) // ['a','b','c']
console.log(a.pop()) // 'c' 返回末尾删除的元素
console.log(a) // ['a','b']
复制代码6.shift()和unshift()
- shift (): The first item to delete an array and returns remove elements of value, will change the original array
- unshift (): added element in front of the first array, return the array length is added, will change the original array
var a = ['a','b']
console.log(a.shift()) // 'a' 返回删除第一项元素
console.log(a) // ['b','c']
console.log(a.unshift()) // 3 返回添加元素后数组长度
console.log(a) // ['a','b','c']
var a = []
console.log(a.shift()) // undefined 当数组为空时，返回undefined
复制代码7.slice
- Returns an array of the specified range (index) of the array elements in the new array
- 1 or 2 can accept parameters
- When the current position of an array parameter indicates the start until the end of the array of all the items
- 2 parameter indicates the starting position to the end position from among all items, but the item does not include an end position
- It does not change the original array
var a = [1,3,5,7,9]
console.log(a.slice(2)) // [5,7,9] 从下标2开始一直截取到最后
console.log(a) // [1,3,5,7,9]
console.log(a.slice(2,4)) [5,7] // 从下标2开始截取到下标4的元素，不包含下标为4的值
console.log(a.slice()) // [1,3,5,7,9]
console.log(a.slice(1,-2)) // [3,5] 终止下标为负数，出现负数时，将负数加上数组长度的值来替换该位置的数（1，3）
console.log(a.slice(-4,-1)) // [3,5,7] 两个值都为负数时，都加上数组长度值（1，4）
复制代码8.splice
- You can achieve an array insertions, deletions and substitutions
- When the two parameters, the delete operation may be made, they indicate a position of the first element of the array and the number of items to be deleted
- When a number of three parameters, the insertion operation can be done, respectively, representing the starting position, deletion (0), inserting the item
- Several three parameters, the replace operation may be made, respectively, representing the starting position, deleted, inserted item
- Change the original array
var a = [1,3,5,7,9]
console.log(a.splice(1,3)) // [3,5,7]
console.log(a) // [1,9]
var a = [1,3,5,7,9]
console.log(a.splice(1,0,2,3)) // [1,2,3,3,5,7,9]
var a = [1,3,5,7,9]
console.log(a.splice(1,2,2,3) // [1,2,3,7,9]
复制代码9.indexOf()和 lastIndexOf()
- indexOf (): takes two arguments, the first represents the element you want to find, and the second index represents the starting position, looking back from the top of the array, returns the element index
- lastIndexOf (): takes two arguments, the first represents the element you want to find, and the second index represents the starting position, looking forward from the end of the array, returns the element index
var a = [1,3,5,7,9]
console.log(a.indexOf(9)) // 4
console.log(a.lastIndexOf(9)) // 4
var a = [1,3,3,5,7,7,9]
console.log(a.indexOf(3)) // 1 默认从前向后找
console.log(a.lastIndexOf(3)) // 2 默认从后向前找
复制代码10.forEach()
- To traverse the array cycle
var arr = [1,3,5,7,9];
arr.forEach(function(item, index, arr){
console.log(item + '-' + index + '-' + (arr === arr));
});
// 1-0-true 3-1-true 5-2-true 7-3-true 9-4-true
// item表示数组每项的值，index表示下标，arr原数组
复制代码11.map()
- An array of arrays run on each item in a given function, returns the result of the composition of each function call
var arr = [1,3,5,7,9];
var arr2 = arr.map(function(item){
return item*2
});
console.log(arr2) // [2,6,10,14,18]
复制代码12.filter()
- Each array of a given operation of the function, returns the element satisfies the condition of an array
var arr = [1,3,5,7,9];
var arr2 = arr.filter(function(item,index){
return item > 3
});
console.log(arr2) // [5,7,9]
复制代码13.every()
- Each entry in the array to determine whether the conditions are satisfied, it returns true only if each and every one meet
var arr = [1,3,5,7,9];
var arr2 = arr.every(function(item){
return item < 10
});
console.log(arr2) // true
var arr2 = arr.every(function(item){
return item > 1
});
console.log(arr2) // false
复制代码14.some()
- Each entry in the array is determined whether the condition is satisfied as long as one is satisfied and returns true
var arr = [1,3,5,7,9];
var arr2 = arr.some(function(item){
return item = 9
});
console.log(arr2) // true
var arr2 = arr.some(function(item){
return item > 10
});
console.log(arr2) // false
复制代码15.reduce()和 reduceRight()
- These two methods are used for all iterations of the array, eventually there will be a return value
- reduce (): starting from the first item in the array, one by one to traverse the last item
- reduceRight (): The last item in the array from the beginning, the first to traverse
- It accepts two parameters: (1) each function call (2) Initial value
- Function which includes four parameters: the previous value, the current value, and the array element indexed objects, any value returned by the function will be used as a parameter to the next one, it occurs on the first iteration of the second array, thus the first parameter is the first item in the array, the second parameter is the second array
var arr = [1,3,5,7,9];
var sum = arr.reduceRight(function(prev, cur, index, array){
return prev + cur;
},10);
console.log(sum) // 35
复制代码Reproduced in: https: //juejin.im/post/5d0c3604f265da1b6f437c59