conclusion

  • Method to change the original array

    Push, POP, Shift, unshift, reverse, splice, sort

  • Do not change the original array

    join(),slice(),map(),filter

Static method

  • Array.isArray()

Return Boolean to recognize arrays, compensating for Typeof

var arr = [1.2.3];

typeof arr // "object"
Array.isArray(arr) // true
Copy the code

Second, the instance method

  1. ValueOf(), toString()

    The valueOf method is a method owned by all objects and represents an evaluation of that object. ValueOf methods vary from object to object; valueOf methods on arrays return the array itself.

    var arr = [1, 2, 3]; Arr. ToString () / / "1, 2, 3" var arr = [1, 2, 3, [4, 5, 6]]. Arr. ToString () / / "6"Copy the code
  2. Push (),pop(), shift(),unshift(),reverse(),splice(),sort()
  3. Join (),slice(),map(), and filter methods are used to filter the members of an array.
    var a = [1.2.3.4];

a.join(' ') // '1 2 3 4'
a.join('|') / / "1 | 2 | 3 | 4." "
a.join() / / "1, 2, 3, 4"
a / / [1, 2, 3, 4]
Copy the code
    • Pay attention to

    If the array member is undefined or null or empty, it is converted to an empty string

    [undefined.null].join(The '#')
/ / '#'

['a'.'b'].join(The '-')
// 'a--b'
Copy the code
    • With the call method, this method can be used on strings or array-like objects
    Array.prototype.join.call('hello'.The '-')
// "h-e-l-l-o"

var obj = { 0: 'a'.1: 'b'.length: 2 };
Array.prototype.join.call(obj, The '-')
// 'a-b'
Copy the code
  4. Concact () (original array unchanged)

    The concat method is used to merge multiple arrays. It adds the new array member to the back of the original array member, and returns a new array, unchanged.

    ['hello'].concat(['world'])
// ["hello", "world"]

['hello'].concat(['world'], ['! '])
    	// ["hello", "world", "!"]

[].concat({a: 1}, {b: 2})
    	// [{ a: 1 }, { b: 2 }]

[2].concat({a: 1})
		// [2, {a: 1}]
[1.2.3].concat(4.5.6)
// [1, 2, 3, 4, 5, 6]
Copy the code
    If the array members contain objects, the concat method returns a shallow copy of the current array. A “shallow copy” means that the new array copies references to objects.
    var obj = { a: 1 };
var oldArray = [obj];

var newArray = oldArray.concat();

obj.a = 2;
newArray[0].a / / 2
Copy the code

    In the above code, the original array contains an object, and the new array generated by the concat method contains a reference to this object. So, when you change the original object, the new array changes.

  5. The slice() slice() method extracts a portion of the target array and returns a new array, unchanged

  6. map

The map method passes all the members of the array to the parameter function in turn, and returns the result of each execution as a new array

var numbers = [1.2.3];

numbers.map(function (n) {
  return n + 1;
});
/ / [2, 3, 4]

numbers
/ / [1, 2, 3]
Copy the code

The map method takes as an argument a function that, when called, takes three arguments: the current member, the current location, and the array itself

[1, 2, 3].map(function(elem, index, arr) { return elem * index; }); / / [0, 2, 6]Copy the code

The map method can also take a second argument to bind the this variable inside the callback function.

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

[1, 2].map(function (e) {
  return this[e];
}, arr)
// ['b', 'c']
Copy the code

If the array is empty, the map callback does not execute at that location and skips the array empty.

var f = function (n) { return 'a' };

[1, undefined, 2].map(f) // ["a", "a", "a"]
[1, null, 2].map(f) // ["a", "a", "a"]
[1, , 2].map(f) // ["a", , "a"]
Copy the code

In the above code, the map method does not skip undefined and NULL, but does skip empty Spaces

  1. forEach()

The forEach method is similar to the Map method in that it takes arguments to each member of the array. However, the forEach method does not return a value and is only used to manipulate data. That is, if the purpose of array traversal is to get a return value, use the map method, otherwise use the forEach method. ForEach is used in the same way as the map method. The argument is a function that again takes three arguments: the current value, the current position, and the entire array.

  • The forEach method can also take a second argument, binding the this variable of the argument function.
var out = [];

[1, 2, 3].forEach(function(elem) {
  this.push(elem * elem);
}, out);

out // [1, 4, 9]
Copy the code

In the code above, the empty array out is the second argument to the forEach method. As a result, the this keyword inside the callback refers to out

  • Note that the forEach method cannot interrupt execution and always iterates through all members. If you want to break traversal when certain conditions are met, use a for loop.
var arr = [1, 2, 3]; for (var i = 0; i < arr.length; i++) { if (arr[i] === 2) break; console.log(arr[i]); } / / 1Copy the code

The forEach method also skips arrays of empty Spaces. The forEach method does not skip undefined and NULL, but does skip empty Spaces.

The chain operation

Many of these array methods return arrays, so they can be chained.

var users = [
  {name: 'tom'.email: '[email protected]'},
  {name: 'peter'.email: '[email protected]'}]; users .map(function (user) {
  return user.email;
})
.filter(function (email) {
  return /^t/.test(email);
})
.forEach(function (email) {
  console.log(email);
});
Copy the code