The traversal in JS

Object traversal:

First, to understand the object's ' enumerable properties ', each property of an object has a Description object (descriptor) that controls the behavior of that property. Object.getOwnPropertyDescriptormethod to get the description object for the property.

var obj = {foo:123};console.log (object.getownpropertydescriptor (obj,' foo ')); // {value:123,//     writable:true,//     enumerable:true,        Configurable:true}

Describes an object's enumerable properties, called "Enumerable," which, if the property is false , indicates that some operations ignore the current property.

Then, write a test object objtest

Object.prototype.userProp = ' Userprop '; Object.prototype.getUserProp=function() {    returnObject.prototype.userProp;};//defines an object that implicitly inherits from Object.prototypevarObjtest ={name:' Minna ', Age:21st, [Symbol (' symbol attribute ')]: ' Symbolprop ', unenumerable:' I am a non-enumerable attribute ', skills: [' HTML ', ' CSS ', ' JS '], Getskills:function() {        return  This. Skills; }};//set the Unenumerable property to a non-enumerable propertyObject.defineproperty (objtest, ' unenumerable '), {enumerable:false});

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

1. for...in iterate through the object's own and inherited enumerable properties (without the Symbol attribute).

 for inch objtest) {    console.log (key);     Console.log (Objtest.key);    Console.log (Objtest[key]);}

Do not use for...in to iterate through an array, although you can traverse it, but if you set an enumerable property for Object.prototype, these properties are also traversed, such as the length property of the array, because the array is also an object.

2. Object.keys returns an array that includes all enumerable properties (without the Symbol attribute) of the object itself (without inheritance).

Console.log (Object.keys (objtest)); // [' name ', ' age ', ' skills ', ' getskills ']

3. Object.getOwnPropertyNames returns an array that contains all the properties of the object itself (without the Symbol attribute, but includes non-enumerable properties).

Console.log (Object.getownpropertynames (objtest)); // [' name ', ' age ', ' unenumerable ', ' skills ', ' getskills ']

4. Object.getOwnPropertySymbols returns an array that contains all the Symbol properties of the object itself.

Console.log (Object.getownpropertysymbols (objtest)); // [symbol attribute]

5. Reflect.ownKeys returns an array that contains all the properties of the object itself, regardless of whether the property name is a Symbol or a string, or if it is enumerable.

Console.log (Reflect.ownkeys (objtest)); // [' name ',//     ' age ',//     ' unenumerable ',//      ' Skills ',//     ' getskills ',//     symbol (symbol attribute)]

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.

The most basic has a for,while loop (with a count variable), and the ES6 adds the for ... of, and there is no count variable.

var arr  = [1,2,3,4] for (let value of arr) {    console.log (value)}//  1//  2//  3//  4

Array of built-in traversal methods:

1: ARray.prototype.forEach (): Each element of an array executes a provided function once, but the ForEach function has a flaw: the Continue is not handled correctly (skipping this loop), break (interrupt loop), The logic of the return (returned to the outer function) statement

2:array.prototype.map (): Returns a new array with each element being the value returned by the callback function;

Arr.map (function  (obj) {    console.log (obj)})//  2//  4//  6//  8

Some useful arrays of built-in methods:

• Array.prototype.every (Callback[,thisarg]): tests whether each element of the array passed the test of the callback function, returns True if all passed, otherwise returns false (essentially, That is, every () returns TRUE if the value returned by the callback function is true each time, otherwise false)
• Array.prototype.filter (Callback[,thisarg]): returns a new array whose elements are elements of the original array (that is, if the callback function returns True, the corresponding element enters the new array)
• Array.prototype.find (Callback[,thisarg]): returns the first element passed test
• Array.prototype.findIndex (Callback[,thisarg]): similar to the above function, except that this is the return index
• Array.prototype.some (Callback[,thisarg]): similar to find (), except that it does not return an element, only returns a Boolean value. Just find a pass test and return True
• Array.prototype.reduceRight (callback[, InitialValue]): usage is the same as the above function, except that the traverse direction is just the opposite
  

  The generality of the above functions

• are logically manipulated or judged by the return value of each callback function.
• Callback functions can be written in a more concise arrow function (recommended)
• You can manipulate strings in a form like Array.prototype.map.call (str,callback)

The traversal in JS