Traversal in JavaScript

One, Object traversal

ES6 there are altogether 5 ways to traverse the properties of an object.

1 , For-in

When you use the for-in loop, you return all the enumerable (enumerated) attributes that can be accessed through the object, including the attributes that exist in the instance, as well as the attributes that exist in the prototype, without the symbol attribute. Instance properties that block non-enumerable properties in the prototype (that is, properties that have the [[Dontenum]] tag set) are also returned in the for-in loop because, as a rule, all developer-defined attributes are enumerable-except IE.

2 , Object.keys (obj)

The Object.keys () method gets all the enumerable instance properties on the object. The method receives an object as a parameter and returns an array of strings containing all the enumerable properties, without the symbol attribute.

3 , Object.getownpropertynames (obj)

Object.getownpropertynames () Gets all instance properties, whether enumerable or not, without the symbol attribute.

4 , Object.getownpropertysymbols (obj)

Object.getownpropertysymbols (obj) returns an array that contains the properties of all the Symbol types of the object itself (excluding inherited properties)

5 , Reflect.ownkeys (obj)

The Reflect.ownkeys (obj) method is used to return all instance properties of an object, essentially equivalent to the sum of Object.getownpropertynames and object.getownpropertysymbols, including the symbol attribute.

The 5 methods above traverse the properties of the object, all following the same order rules for property traversal

L First iterate through all attributes named numeric, sorted by number

L Next traverse all attributes named string, sorted by build time

L finally traverse all attributes named symbol values, sorted by build time

Second, array traversal

An array is actually an object, so you can also use any of the methods that the object traverses above (but pay attention to the scale), and the array has other methods of traversal.

L most basic for loop, while loop traversal (bug is adding a count variable more)

L ES6 Introduction: For...of

1 , some of the traversal methods built into the array:

1.1. ForEach () Method: Runs the given function for each item in the array. This method has no return value.

var numbers=[1,2,3,4,5];    Numbers.foreach (function(item,index,array) {    Console.log ("Item:" +item+ "index:" +index + "Array:" +Array);});

Results:

1.2. Map () Method: Each item in the array runs the given function, returning an array of the results of each function call, the original array unchanged.

var numbers=[1,2,3,4,5];     var result=numbers.map (function(item,index,array) {    return item* 2;}); Console.log (numbers); Console.log (result);

Results:

2 , some useful array built-in methods

2.1, every () method: Runs the given function for each item in the array, and returns True if the function returns true for each item.

2.2. Filter () method: Each item in an array runs the given function, and returns the list of items that the function returns True.

2.3, some () method: Runs the given function for each item in the array, and returns True if the function returns true for either item.

2.4. Find () Method: Returns the first element to pass a test

2.5, FindIndex () method: Returns the index of the first element passed test

2.6, Reduce () method: Habitually called the accumulator function, each element of an array executes a callback function, and finally returns a value (this value is the value returned when the callback function was last called)

The callback function for this function has 4 parameters

Accumulator: The value returned by the last call to the callback function

CurrentValue: The value currently in process

Currentindex: The index of the value currently being processed

Array

InitialValue: Optional, whose value is used to first call the first parameter of callback

Example:

[1,10,5,3,8].reduce (function(accumulator,currentvalue) {    return accumulator*  CurrentValue;});   //  -

2.7 ,reduceright (): Use the same function as above, except that the traverse direction is just the opposite.

Third, set traversal operation

ES6 provides a new Set of data structures. It is similar to an array, but the values of the members are unique and have no duplicate values.

The set itself is a constructor that is used to generate a set data structure.

An instance of the set structure has four traversal methods that can be used to traverse members.

L keys (): The iterator that returns the key name

L values (): The iterator that returns the key value

L entries (): The iterator that returns the key-value pair

L ForEach (): Use callback function to traverse each member

It should be noted that the order in which the set is traversed is the insertion order.

1. The keys method, the values method, and the entries method return all the iterator objects. Because the SET structure does not have a key name, only the key value (or the key name and key value is the same value), so the keys method and the values method behave exactly the same.

Let set =NewSet ([' Red ', ' green ', ' blue ']); for(Let item of Set.keys ()) {Console.log (item);}//Red//Green//Blue for(Let item of Set.values ()) {Console.log (item);}//Red//Green//Blue for(Let item of Set.entries ()) {Console.log (item);}//["Red", "red"]//["Green", "green"]//["Blue", "blue"]

2. ForEach ()

A foreach method for an instance of the set structure that performs an operation on each member without a return value.

New Set ([1, 2, 3= Console.log (value * 2))//  2//  4// 6

Four, MAP traversal operation

Map data structure. It is similar to an object and a collection of key-value pairs, but the scope of the key is not limited to strings, and the various types of values (including objects) can be treated as keys. That is, the object structure provides a "string-value" correspondence, the map structure provides "value-value" correspondence, is a more perfect hash structure implementation. If you need a "key-value pair" data structure, map is more appropriate than object.

Map native provides three iterator generation functions and a traversal method.

L keys (): The iterator that returns the key name.

L values (): The iterator that returns the key value.

L entries (): Returns the iterator for all members.

L ForEach (): Iterates through all the members of the map.

It is important to note that the order in which maps are traversed is the insertion order.

Let map =NewMap ([[' F ', ' no '],  [' T ', ' yes '],]); for(Let key of Map.keys ()) {Console.log (key);}//"F"//"T" for(Let value of Map.values ()) {Console.log (value);}//"No"//"Yes" for(Let item of Map.entries ()) {Console.log (item[0], item[1]);}//"F" "No"//"T" "Yes"//or for(Let [key, value] of map.entries ()) {Console.log (key, value);}//equivalent to using map.entries () for(Let [key, value] of map) {Console.log (key, value);}

Traversal in JavaScript