Shulou(Shulou.com)06/03 Report--

This article is to share with you about the difference between ES5 and Es6 array methods, the editor thinks it is very practical, so I share it with you to learn. I hope you can get something after reading this article.

Original intention: during the interview, the interviewer often asks about the array methods of Es5 and Es6, and many students are always confused. Let's share them today.

Es5 series indexOf

Purpose: to find out whether a value exists in the array, and return the subscript of a value if so, otherwise return-1

Let list = [1,2,3]; console.log (list.indexOf (2)) / / 1 console.log (list.indexOf ("frogman")) / /-1map

Purpose: map is an array function method that receives three parameters, value,index,self, and the return value is the result of processing.

Let list = [1,2,3]; const res = list.map ((value, key, self) = > {console.log (value) / / 1.23 console.log (key) / / 012 console.log (self) / / [1,2,3] return value * 2}) console.log (res) forEach

Purpose: for traversing an array, receiving three parameters, value,index,self, and returning a value of undefined

Let list = [1,2,3]; const res = list.forEach ((value, key, self) = > {console.log (value) / / 123console.log (key) / / 012console.log (self) / / [1,2,3] return 123}) console.log (res) / / undefinedsplice

Purpose: for array deletion or replacement, receive three parameters:

The first parameter is the location where it is deleted or added

The second parameter is the bits to be deleted. If it is 0, it will not be deleted.

The third parameter is to add content to the array

Let list = [1,2,3] List.splice (0,1) / / delete a console.log (list) / / [2,3] list.splice (0,1, "frogman") / / delete the 0th position, add a string console.log (list) / / ["frogman", 2,3] list.splice (0,2, "frogman") / / delete the 0th position to delete 2 bits Add the previous string console.log (list) / / ["frogman", 3] slice

Purpose: used to intercept array values and receive two parameters, the first parameter is the subscript of which value to get, and the second parameter is the first bit of which subscript to intercept.

Let list = [1,2,3]; let res = list.slice (1,3) / / intercept from the first subscript to the first subscript, so the interception is [2,3] console.log (res) / / [2,3] filter

Purpose: it is used to filter the qualified values in the array, and the return value is the array object that meets the condition.

Let list = [1,2,3]; let res = list.filter (item = > item > 1); console.log (res) / / [2,3] every

Purpose: used to check whether all elements of the array meet the specified conditions, and the return value is Boolean. This method is that all value elements in the array must meet the conditions and return true, otherwise false

Let list = [1,2,3]; let res = list.every (item = > item > 0) console.log (res) / / true let res1 = list.every (item = > item > 1) console.log (res1) / / falsesome

Purpose: used to check whether the element in the array meets the specified condition. The return value is Boolean. This method returns true as long as one item in the array meets the condition, otherwise false

Let list = [1,2,3]; let res = list.some (item = > item > 0) console.log (res) / / truereduce

Purpose: this method receives a function as an accumulator, and each value in the array (from left to right) starts to shrink and is finally calculated as a value. The callback function of this method receives four parameters

The first parameter: the initial value, or the return value after the calculation

Second parameter: current element

Second parameter: index of the current element

The fourth parameter: the array object to which the current element belongs, itself

We usually only use the first two, the first parameter callback function of reduce, and the second parameter is the initial value.

Let list = [1,2,3]; let res = list.reduce ((prev, cur) = > prev + = cur, 0) console.log (res) / / 6reverse

Purpose: for array inversion

Let list = [1,2,3]; let res = list.reverse (); console.log (res) / / [3,2,1] join

Purpose: for what form of data stitching

Let list = [1,2,3]; let res = list.join ("-"); console.log (res) / / 1-2-3 let sum = eval (list.join ("+") console.log (sum) / / 6sort

Purpose: used to sort the array, the sorting rules look at the return value

The return value is positive, with the following number in front of it.

The return value is negative, the previous number remains the same, it is still in front.

The return value is 0 and does not move.

Let list = [1,2,3]; let sort = list.sort ((a, b) = > b-a) console.log (sort) / / [3,2,1] concat

Purpose: for merging array originals

Let list = [1,2,3]; let res = list.concat ([1,2,3]) console.log (res) / / [1,2,3,1,2,3] push

Purpose: add elements to the end of the array and return the length of the array

Let list = [1,2,3]; let res = list.push (1) console.log (res) / / 4pop

Purpose: used to delete the element at the end of the array, and the return value is the deleted element

Let list = [1,2,3]; let res = list.pop () console.log (res) / / 3shift

Purpose: used to delete the header of the array, and the returned value is the deleted element

Let list = [1,2,3]; let res = list.shift () console.log (res) / / 1unshift

Purpose: add elements to the head of the array and return the length of the array

Let list = [1,2,3]; let res = list.unshift (1) console.log (res) / / 4toString

Purpose: used to convert array contents to strings

Let list = [1Jing 2Jue 3]; let res = list.toString () console.log (res) / / 1Jing 2Jing 3E6 + includes

Purpose: check whether the element exists in the array and return a Boolean value

Let list = [1,2,3]; let res = list.includes ("frogman") let res1 = list.includes (1) console.log (res, res1) / / false truefind

Purpose: find the elements of the array, return a single value if the condition is met, and return according to the nearest principle.

Let list = [1,2,3]; let res = list.find ((item) = > item > 1) console.log (res) / / 2, return findIndex according to the nearest principle

Purpose: to find the elements in the array and return the array subscript that meets the condition

Let list = [1,2,3]; let res = list.findIndex ((item) = > item > 1) console.log (res) / / 1, return the subscript flat according to the nearest principle

Purpose: for flattening nested array objects

Let list = [1,2,3, [4, [5]]; let res = list.flat (Infinity) console.log (res) / / [1,2,3,4,5] fill

Purpose: used to populate array objects

Let list = [1,2,3]; let res = list.fill (1) console.log (res) / / [1,1,1] Array.isArray

Purpose: check whether the object is an array

Let list = [1,2,3]; let res = Array.isArray (list) console.log (res) / / trueArray.from

Purpose: convert pseudo arrays to true arrays

Let res = Array.from (document.getElementsByTagName ("div")) console.log (res) / / convert to a true array to call the method Array.of of the array prototype

Purpose: used to generate an array object, mainly to make up for the deficiency of Array ()

Let res = Array.of (1,2,3) console.log (res) / / [1,2,3] which changes the value of the original array

Splice 、 reverse 、 sort 、 push 、 pop 、 shift 、 unshift 、 fill

These are the differences between ES5 and Es6 array methods. The editor believes that there are some knowledge points that we may see or use in our daily work. I hope you can learn more from this article. For more details, please follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.