Which of the following method call gives the position of X that occurs after?
|
That’s natural, because Show So, special methods should be used. The arr.splice method is a swiss army knife for arrays. It can do everything: insert, remove and replace elements. The syntax is: It modifies This method is easy to grasp by examples. Let’s start with the deletion: Easy, right? Starting from the index In the next example we remove 3 elements and replace them with the other two: Here we can see that The Negative indexes allowed Here and in other array methods, negative indexes are allowed. They specify the position from the end of the array, like here: sliceThe method arr.slice is much simpler than similar-looking The syntax is: It returns a new array copying to it all items from index It’s similar to a string method For instance: We can also call it without arguments: concatThe method arr.concat creates a new array that includes values from other arrays and additional items. The syntax is: It accepts any number of arguments – either arrays or values. The result is a new array containing items from If an argument For instance: Normally, it only copies elements from arrays. Other objects, even if they look like arrays, are added as a whole: …But if an array-like object has a special Iterate: forEachThe arr.forEach method allows to run a function for every element of the array. The syntax: For instance, this shows each element of the array: And this code is more elaborate about their positions in the target array: The result of the function (if it returns any) is thrown away and ignored. Searching in arrayNow let’s cover methods that search in an array. indexOf/lastIndexOf and includesThe methods arr.indexOf and arr.includes have the similar syntax and do essentially the same as their string counterparts, but operate on items instead of characters:
Usually these methods are used with only one argument: the For instance: Please note that If we want to check if The method arr.lastIndexOf is the same as The A minor, but noteworthy feature of That’s because find and findIndex/findLastIndexImagine we have an array of objects. How do we find an object with the specific condition? Here the arr.find(fn) method comes in handy. The syntax is: The function is called for elements of the array, one after another:
If it returns For example, we have an array of users, each with the fields In real life arrays of objects is a common thing, so the Note that in the example we provide to The arr.findIndex method has the same syntax, but returns the index where the element was found instead of the element itself. The value of The arr.findLastIndex method is like Here’s an example: filterThe If there may be many, we can use arr.filter(fn). The syntax is similar to For instance: Transform an arrayLet’s move on to methods that transform and reorder an array. mapThe arr.map method is one of the most useful and often used. It calls the function for each element of the array and returns the array of results. The syntax is: For instance, here we transform each element into its length: sort(fn)The call to arr.sort() sorts the array in place, changing its element order. It also returns the sorted array, but the returned value is usually ignored, as For instance: Did you notice anything strange in the outcome? The order became The items are sorted as strings by default. Literally, all elements are converted to strings for comparisons. For strings, lexicographic ordering is applied and indeed To use our own sorting order, we need to supply a function as the argument of The function should compare two arbitrary values and return: For instance, to sort as numbers: Now it works as intended. Let’s step aside and think what’s happening. The The By the way, if we ever want to know which elements are compared – nothing prevents from alerting them: The algorithm may compare an element with multiple others in the process, but it tries to make as few comparisons as possible. A comparison function may return any number Actually, a comparison function is only required to return a positive number to say “greater” and a negative number to say “less”. That allows to write shorter functions: Arrow functions for the best Remember arrow functions? We can use them here for neater sorting: This works exactly the same as the longer version above. Use Remember strings comparison algorithm? It compares letters by their codes by default. For many alphabets, it’s better to use For example, let’s sort a few countries in German: reverseThe method arr.reverse reverses the order of elements in For instance: It also returns the array split and joinHere’s the situation from real life. We are writing a messaging app, and the person enters the comma-delimited list of receivers: The str.split(delim) method does exactly that. It splits the string into an array by the given delimiter In the example below, we split by a comma followed by space: The Split into letters The call to The call arr.join(glue) does the reverse to For instance: reduce/reduceRightWhen we need to iterate over an array – we can use When we need to iterate and return the data for each element – we can use The methods arr.reduce and arr.reduceRight also belong to that breed, but are a little bit more intricate. They are used to calculate a single value based on the array. The syntax is: The function is applied to all array elements one after another and “carries on” its result to the next call. Arguments:
As function is applied, the result of the previous function call is passed to the next one as the first argument. So, the first argument is essentially the accumulator that stores the combined result of all previous executions. And at the end it becomes the result of Sounds complicated? The easiest way to grasp that is by example. Here we get a sum of an array in one line: The function passed to Let’s see the details of what’s going on.
The calculation flow:  Or in the form of a table, where each row represents a function call on the next array element: Here we can clearly see how the result of the previous call becomes the first argument of the next one. We also can omit the initial value: The result is the same. That’s because if there’s no initial, then The calculation table is the same as above, minus the first row. But such use requires an extreme care. If the array is empty, then Here’s an example: So it’s advised to always specify the initial value. The method arr.reduceRight does the same, but goes from right to left. Array.isArrayArrays do not form a separate language type. They are based on objects. So …But arrays are used so often that there’s a special method for that: Array.isArray(value). It returns Most methods support “thisArg”Almost all array methods that call functions – like That parameter is not explained in the sections above, because it’s rarely used. But for completeness we have to cover it. Here’s the full syntax of these methods: The value of For example, here we use a method of If in the example above we used A call to SummaryA cheat sheet of array methods:
Please note that methods These methods are the most used ones, they cover 99% of use cases. But there are few others:
For the full list, see the manual. From the first sight it may seem that there are so many methods, quite difficult to remember. But actually that’s much easier. Look through the cheat sheet just to be aware of them. Then solve the tasks of this chapter to practice, so that you have experience with array methods. Afterwards whenever you need to do something with an array, and you don’t know how – come here, look at the cheat sheet and find the right method. Examples will help you to write it correctly. Soon you’ll automatically remember the methods, without specific efforts from your side. |
