Some commonly used methods in handling JavaScript arrays

1. toString () values to the array to an array (comma delimited) string.

= arr2 is the let [ 'Zhao', 'Qian', 'Sun', 'Li' ]; 
the console.log (arr2.toString ()); // Zhao, Qian, Sun, Li

2. the Join () method can also be all combined into a string array elements.

  • Elements are separated by a specified delimiter.
  • The default is','
= arr2 is the let [ 'Zhao', 'Qian', 'Sun', 'Li' ]; 
the console.log (arr2.join ()); // Zhao, Qian, Sun, Li 

the console.log (arr2.join ( ' ')); // Zhao Li Sun Qian

 

3.pop () method removes the last element from an array

pop () method removes arrayObject last element of the array length minus 1, and returns the value of its elements removed.

let arr2 = ['zhao','qian','sun','li'];
console.log(arr2.pop()); //li
console.log(arr2) // ["zhao", "qian", "sun"]

If the array is already empty, the pop () array is not changed, and returns the undefined value.

let arr3 = [];
console.log(arr3.pop()); //undefined
console.log(arr3) // []

 

4. Push () method (at the end of the array) to add a new element to the Array

  • push () after advanced methods and pop () method using an array provided by the stack function.
  •  push () method returns the length of the new array
var arr3 = ['zhao','qian','sun','li'];
arr3.push("zhou");
// 5
console.log(arr3); // ["zhao", "qian", "sun", "li", "zhou"];

5.shift () method deletes the first element of the array, and all the other elements "shift" to a lower index.

  • shift () method returns the string is "shifted out" of the
var arr4 = [ 'Zhao', 'Qian', 'Sun', 'Li' ]; 
arr4.shift (); 
// "Zhao"

6.unshift () method (in the beginning) to add a new element to the array, and "reverse displacement" old elements.

  • unshift () method returns the length of the new array
var arr5 = ['zhao','qian','sun','li'];
arr5.unshift('zhou') ;
// 5
console.log(arr5); // ["zhou", "zhao", "qian", "sun", "li"]

7. Change Element

  • To access array elements by using their index number;
var arr6 = ['zhao','qian','sun','li'];
arr6[0] = 'shi' ; //"shi"
console.log(arr6); //  ["shi", "qian", "sun", "li"];  // 把 arr6的第一个元素改为 "shi"

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[4] = "Kiwi";  //Liwi
console.log(fruits) ; // ["Banana", "Orange", "Apple", "Mango", "Kiwi"]   // 在 fruits 的数组内增加 "Kiwi"
  • The length property provides an easy way to add a new element to the array.
var arr7 = ['zhao','qian','sun','li'];
arr7[arr7.length] = 'shi'; //shi
console.log(arr7); // ["zhao", "qian", "sun", "li", "shi"]

8.delete remove elements

  • Use  delete the array will void left undefined. Please use  pop () or  shift () instead.
var fruits = ["Banana", "Orange", "Apple", "Mango"];
delete fruits[0];
//true
console.log(fruits); // [empty, "Orange", "Apple", "Mango"]

9.splice() 

1. Can be used to add a new item to the array.

splice(index,count,para1,para2..);

The first parameter (index) defines the position (splicing) the new element should be added.

The second parameter (count) define how many elements should be removed.

The new elements of the remaining parameters (para1, para2) is defined to be added.

splice () method returns an array that contains the deleted items

var arr8 = [ 'Zhao', 'Qian', 'Sun', 'Li' ]; 
arr8.splice ( 2,0, 'Love', 'you'); // is removed at two element index 0 It returns the array is deleted [] 
the console.log (arr8); // [ "Zhao", "Qian", "Love", "you", "Sun", "Li"]; 

var arr9 = [ 'Zhao ',' Qian ',' Sun ',' Li ' ]; 
arr9.splice ( 2,2 &,' Love ',' you ') // is removed at 2 is an array of two elements to be deleted in the index returned [ "Sun", "Li"] 
the console.log (arr9); //   [ "Zhao", "Qian", "Love", "you"]

2 Use the splice () to remove elements.

var Fruits = [ "Banana", "Orange", "the Apple", "Mango" ]; 
fruits.splice ( 0,. 1);   // [ "Banana"]; 
the console.log (Fruits); // [ "Orange "," Apple "," Mango "]; // delete the first element of fruits, delete the number 1

10. The the concat () method to create a new array by combining (connecting) an existing array.

  • This method does not change the existing array , but only returns a copy of the array is connected.
let arr = [1,2,3];
console.log(arr.concat(4,5)); //[1, 2, 3, 4, 5]

let arr2 = ['zhao','qian','sun','li'];
console.log(arr2.concat('zhou')); //["zhao", "qian", "sun", "li", "zhou"]
//concat() 连接两个数组
console.log(arr.concat(arr2)); //[1, 2, 3, "zhao", "qian", "sun", "li"]

11. The Slice () method of cutting out a segment with a new array of the array.

  • slice () method of cutting out a segment with a new array of the array.
  • slice () method creates a new array. It does not remove any elements from the source array.
  • slice (start, end) was cut out directly new array

 This embodiment starts from a cut-out section of the array element array 1 ( "Orange"). 

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1); 
console.log(citrus)  //["Orange", "Lemon", "Apple","Mango"];返回新数组
console.log(fruits ); //  ["Banana", "Orange", "Lemon", "Apple", "Mango"] 原数组不发生变化

slice () two acceptable parameters, such as (1, 3) interposed between the two elements of the specified index.

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1, 3); 
console.log(citrus); // ["Orange", "Lemon"]
console.log(fruits); // ["Banana", "Orange", "Lemon", "Apple", "Mango"]

12. The Sort () array sorting

Alphabetically sort the array.

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
fruits.sort(); // ["Apple", "Banana", "Lemon", "Mango", "Orange"]

sort () method produces incorrect results when ordering value;

If the digital sorted string, then "3" is greater than "11", because "3" is greater than "1."

was arr = [3,5,1,6 ]; 
arr.sort (); // [1, 3, 5, 6], 

was arr = [3,5,11,6 ]; arr.sort (); //  [11, 3, 5, 6];

Let's fix this problem by a ratio function

var points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return a - b}); 
(6) [1, 5, 10, 25, 40, 100]

Use the same technique to the array in descending order

var points = [40, 100, 1, 5, 25, 10];
points.sort(function(a, b){return b - a});//[100, 40, 25, 10, 5, 1]

Added: ARR .sort ( [the compareFunction] ) to specify the function are arranged in some order

If you pointed out  compareFunction , the array will follow the call of the sort function's return value. I.e., a and b are two elements to be compared:

  • If  compareFunction(a, b) less than 0, then a is arranged before B;
  • If  compareFunction(a, b) equal to 0, the relative position of a and b unchanged. Note: ECMAScript standard does not guarantee this behavior, but not all browsers will follow (eg Mozilla versions prior to 2003);
  • If  compareFunction(a, b) greater than 0, b is arranged before a.
  • compareFunction(a, b) It must always return the same result of the comparison to the same input, otherwise the sort of result will be uncertain.

13. Reverse () method of inverting elements in an array.

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

14.every () method to test all the elements in an array to test whether a given function can pass. It returns a Boolean value.

  • Syntax: arr .ev ERY ( callback [, thisArg ])

Example: determining whether an array of 40 values ​​are less than the inside

function isBelowThreshold(currentValue) {
  return currentValue < 40;
}
var array1 = [1, 30, 39, 29, 10, 13];
console.log(array1.every(isBelowThreshold));
//true

17. A filter() method of creating a new array that all the elements comprising the function implemented by testing provided. 

语法: var newArray = arr.filter(callback(element[, index[, array]])[, thisArg]);

callback function for each element of the test array. Returns true if the element tested, to retain the element, is not preserved to false

 

var words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];
const result = words.filter(word => word.length > 6);
console.log(result);
// ["exuberant", "destruction", "present"]

The following example uses  filter creates a new array element of the array is greater than the original values in the array of elements 10 is composed.

function isBigEnough(element) {
  return element >= 10;
}
var filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
// filtered is [12, 130, 44] 
 

18.find () method returns an array of the first element satisfies the test functions provided. Otherwise undefined

var array1 = [5, 12, 8, 130, 44];
var found = array1.find(function(element) {
  return element > 10;
});
console.log(found);
// 12
function isBigEnough(element) {
  return element >= 999;
}
var filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
//undefined

19.findIndex () method returns an array index of the first element satisfies the test function provided. Otherwise, it returns -1.

var array1 = [5, 12, 8, 130, 44];
function isLargeNumber(element) {
  return element > 10;
}
console.log(array1.findIndex(isLargeNumber));
//1

 

14. entries () method returns a new Array Iterator object comprising for each array index key / value pairs

var array1 = ['a', 'b', 'c'];

var iterator1 = array1.entries();

console.log(iterator1.next().value);
// expected output: Array [0, "a"]

console.log(iterator1.next().value);
// expected output: Array [1, "b"]

 

15.copyWinthin()方法浅复制数组的一部分到同一数组中的另一个位置,并返回它,不会改变原数组的长度。

var array1 = ['a', 'b', 'c', 'd', 'e'];
console.log(array1.copyWithin(0, 3, 4));  // c

3-4, taken between the elements of the subscript, d, replace the array element at index position 0, i.e., replacing a; the output is [ "d", "b", "c", "d", " e "]

16. A fill() method for filling a fixed value in an array of all elements within the index from the index to the starting termination. Excluding the terminating index.

Syntax: arr.fill (value [, start [, end]]); without changing the length of the array

var array1 = [1, 2, 3, 4];

// fill with 0 from position 2 until position 4
console.log(array1.fill(0, 2, 4));
// expected output: [1, 2, 0, 0]

// fill with 5 from position 1
console.log(array1.fill(5, 1));
// expected output: [1, 5, 5, 5]

console.log(array1.fill(6));
// expected output: [6, 6, 6, 6]

 

Guess you like

Origin www.cnblogs.com/imMeya/p/11507932.html