Summary of methods for traversing objects (5 types) and traversing arrays (6 types) in js

This article brings you a summary of the methods of traversing objects (5 types) and traversing arrays (6 types) in js. It has certain reference value. Friends in need can refer to it. I hope it will be useful to you. Helps.

1. Traversal object method

1.for...in
Traversal output are the properties of the object itself and the enumerable properties on the prototype chain (excluding Symbol properties). The final output of the properties on the prototype chain shows that the enumerable properties of the object itself are traversed first, and then

on the prototype chain is traversed.

eg:
var obj = { 'name': "yayaya", 'age': '12', 'sex': 'female' };
Object.prototype.pro1 = function() {};//在原型链上添加属性
Object.defineProperty(obj, 'country', {
  Enumerable: true //可枚举
});
Object.defineProperty(obj, 'nation', {
  Enumerable: false //不可枚举
})
obj.contry = 'china';
for (var index in obj) {
  console.log('key=', index, 'value=', obj[index])
}

Output result:

##2.Object.keys() Traversing the object returns an array containing the enumerable properties of the object itself (excluding the Symbol property).

eg:
var obj = { 'name': "yayaya", 'age': '12', 'sex': 'female' };
Object.prototype.pro1 = function() {}
Object.defineProperty(obj, 'country', {
  Enumerable: true,
  value: 'ccc'
});
Object.defineProperty(obj, 'nation', {
  Enumerable: false //不可枚举
})
obj.contry = 'china';
Object.keys(obj).forEach(function(index) {
  console.log(index, obj[index])
});

Output result:

3.Objcet.getOwnPropertyNames() Outputs an array of enumerable and non-enumerable properties of the object itself, and does not output properties on the prototype chain

eg:
var obj = { 'name': "yayaya", 'age': '12', 'sex': 'female' };
Object.prototype.pro1 = function() {}
Object.defineProperty(obj, 'country', {
  Enumerable: true,
  value: 'ccc'
});
Object.defineProperty(obj, 'nation', {
  Enumerable: false //不可枚举
})
obj.contry = 'china';
Object.getOwnPropertyNames(obj).forEach(function(index) {
  console.log(index, obj[index])
});

Output result:

##4.Reflect.ownKeys() Returns all properties of the object itself, regardless of whether the property name is a Symbol or a string, or whether it is enumerable.

eg:
var obj = { 'name': "yayaya", 'age': '12', 'sex': 'female' };
Object.prototype.pro1 = function() {}
Object.defineProperty(obj, 'country', {
  Enumerable: true,
  value: 'ccc'
});
Object.defineProperty(obj, 'nation', {
  Enumerable: false //不可枚举
})
obj.contry = 'china';
Reflect.ownKeys(obj).forEach(function(index) {
  console.log(index, obj[index])
});

Return results:

5. _.keys Using the traversal method of the underscore plug-in can only traverse the enumerable attributes of the object itself

eg:
var obj = { 'name': "yayaya", 'age': '12', 'sex': 'female' };
Object.prototype.pro1 = function() {}
Object.defineProperty(obj, 'country', {
  Enumerable: true,
  value: 'ccc'
});
Object.defineProperty(obj, 'nation', {
  Enumerable: false //不可枚举
})
obj.contry = 'china';
console.log(_.keys(obj));

Output results :

2. Array traversal method

1.forEach

eg:
var arr = ['a', 'b', 'c', 'd'];
arr.forEach(function(value, index) {
  console.log('value=', value, 'index=', index);
})

Output result:

##2.map

can be traversed Each item is processed accordingly and an array composed of the results of each function call is returned.

eg:
var arr = ['a', 'b', 'c', 'd'];
arr.map(function(item, index, array) {
  console.log(item, index);
})

Output result:

3.for loop traversal

eg:
var arr = ['a', 'b', 'c', 'd'];
for (var i = 0; i 

Output result:

4.for...in

eg:
var arr = ['a', 'b', 'c', 'd'];
for (var i in arr) {
  console.log('index:', i, 'value:', arr[i])
}

Output result:

5.for...of

(es6)Only traverses the value, not the subscript, but can traverse the attributes of the Symbol data type. This method is used to traverse all data structures. The unified method

eg:
var arr = ['a', 'b', 'c', 'd'];
for (var value of arr) {
  console.log('value', value)
}

Output results:

##6.Use the underscore plug-in

eg:
var arr = ['a', 'b', 'c', 'd'];
var _ = require('underscore');
_.each(arr, function(value, index, arr) {
  console.log(value, index, arr)

})

Output result:

Related recommendations:

JS traverse arrays and objects Detailed explanation of the difference and methods of recursively traversing objects, arrays, and properties

js code for traversing the properties of objects

Two ways to traverse arrays in js

The above is the detailed content of Summary of methods for traversing objects (5 types) and traversing arrays (6 types) in js. For more information, please follow other related articles on the PHP Chinese website!