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

This article will explain in detail what the built-in traversal method is in the JS array. The editor thinks it is very practical, so I share it with you as a reference. I hope you can get something after reading this article.

ForEach () (ES6) method

The forEach () (ES6) method executes the given function once on each element of the array.

1. If there are several elements in the array, the callback in this method will be executed several times.

two。 The first parameter is the element in the array, the second parameter is the index of the element in the array, and the third parameter is itself (the third parameter can be used for array deduplication).

3. The traversal method included in the array shows that foreach is more efficient than for loop when the number of loops is unknown or the calculation is complex.

4. The circular array element is the basic data type and will not change the data of the original data. The cyclic array element is an object, which will change the value of the object attribute of the original array.

5. Modification of the index is not supported during the loop, and the use of return in the callback will not report an error, but it is invalid

Note: if you cannot use break and continue to jump out of the entire loop or the current loop, an error will be reported, but you can jump out of the loop with try...catch.

Const array1 = ['averse,' baked,'c']; array1.forEach (element = > console.log (element))

Disadvantages: there is no way to stop or jump out of the `forEach () `cycle

Map () (ES6) method

The map () (ES6) method creates a new array, and the result is that each element in the array is the return value after calling the supplied function once.

Const array1 = [1,4,9,16]; const map1 = array1.map (x = > x * 2); console.log (map1); / / [2,8,18,32]

Three parameters: array element, element index, and the original array itself

FlatMap () method

The flatMap () method first maps each element using a mapping function, and then compresses the result into a new array. It is almost the same as map's flat with a depth of 1, but flatMap is usually slightly more efficient in merging into one method.

Var arr1 = [1,2, [3,4]]; arr1.flatMap (x = > x); / / [1,2,3,4] var arr1 = [1,2,3,4]; arr1.flatMap (x = > [x * 2]]); / / [[2], [4], [6], [8]] for...in...

This loop also uses a lot of people, but is the least efficient (the output key is an array index). If you are traversing an object, the output is the property name of the object.

For...of...

The performance is better than `for.in.`, but still not as good as the ordinary `for` cycle.

  Note: objects cannot be looped, because any data structure can be traversed as long as the Iterator interface is deployed. Some data structures have native Iterator interfaces, such as Array, Map, Set, String, etc., while the Iterator interface is deployed on the Symbol.iterator attribute of the data structure, while the object Object does not have the Symbol.iterator attribute, so it cannot be traversed by for..of.

Filter (ES6) traversal array

Filter (ES6) iterates through the array, filtering out eligible elements and returning a new array, or an empty array if none of the array elements pass the test.

Const result = words.filter (word = > word.length > 6); console.log (result) / / ["exuberant", "destruction", "present"] some () function (ES6) traverses whether there are qualified elements in the array and returns a Boolean value that returns true as long as it finds one that matches the condition. Var arr = [{id: 1, name: 'buy pens', done: true}, {id: 2, name: 'buy notebooks', done: true}, {id: 3, name: 'practice', done: false}] var bool = arr.some (function (item, index) {return item.done}) console.log (bool) / / trueevery () function (ES6)

Test whether the elements of the array pass the test of the callback function

If all pass, return true, otherwise return false

To put it simply, if the callback function returns true each time, every () returns true, otherwise false.

Var arr = [{id: 1, name: 'buy pens', done: true}, {id: 2, name: 'buy notebooks', done: true}, {id: 3, name: 'practice', done: false}] var bool = arr.every ((item, index) = > {return item.done}) console.log (bool) / / falsefind () function (ES6)

Returns the first element that passes the test, or * * undefined** if the element that does not pass the test.

Var arr = [1,1,2,2,3,3,4,5,6] var num = arr.find ((item, index) = > {return item = 3}) console.log (num) / / 3findIndex () function (ES6)

This function works the same as find () above, except that the value it returns is the index of the first element.

Var arr = [1, 1, 2, 2, 3, 3, 4, 5, 6] var num = arr.findIndex (item = > {return item = 3}) console.log (num) / / 4 this article is about "what is the built-in traversal method in the JS array". I hope the above content can be helpful to you, so that you can learn more knowledge, if you think the article is good. Please share it for more people to see.

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.