Several methods of array traversal
The callback takes the current element (item), its index (index), and the array itself (ARR), all of which are optional.
- ForEach method: Iterates through each element of the array, with no return value by default.
<script>
let arr = ['a'.'b'.'c'.'d']
arr.forEach((item, index) = > {
console.log(item + '-- -- -- -- -- + index);
})
</script>
Copy the code
- Filter method: Filters array elements conditionally. Returns an array in which the qualified elements of the original array are placed. (The filter method does not change the original array)
<script>
let arr = [{
id: 1.name: 'zhangsan'
}, {
id: 2.name: 'lisi'
}, {
id: 3.name: 'wangwu'
}]
const newArr = arr.filter(item= > {
return item.id === 2
})
console.log(newArr);
</script>
Copy the code
- Map method: returns an array with each element as the return value of the original array element after the callback. (The map method does not alter the original array.)
<script>
let arr = [1.2.3.4.5]
const newArr = arr.map(item= > {
return value + 10;
})
console.log(newArr);
</script>
Copy the code
- Some, every methods (return a Boolean) : Some and every are used similarly in that each element of an array executes a callback. The every method returns true if all values are true, and false otherwise. The some method returns false if all values are false, and true otherwise. (Some, every methods do not change the array)
<script>
let arr = [1.2.3.4.5]
const flag1 = arr.some((value, index) = > {
return value > 3;
})
console.log(flag1);
console.log('-- -- -- -- -- -- -- -- --');
const flag2 = arr.every((value, index) = > {
return value > 3;
})
console.log(flag2);
</script>
Copy the code
- Reduce method: Reduce (callback(Total,item,index, ARR),initial) method takes two arguments. The first argument is a callback function (mandatory) and the second argument is an initial value (optional). The array takes the last return value as the initial value for the next loop and returns the result. If there is no initial value, reduce takes the first element of the array as the initial value at the start of the loop.
Total: cumulative value. Item: the element of the current loop (required); Inedx: (optional) index of the element; Arr: The array itself (optional) is often used for the accumulation and multiplication of array elements. (Reduce method does not change the original array)
<script>
let arr = [1.2.3.4.5.6.7.8.9]
const sum = arr.reduce((total, value, index) = > {
console.log(total);
return total + value
}, 100)
console.log('sum=' + sum);
let arr2 = [1.2.3.4.5.6.7.8.9]
const sum_2 = arr2.reduce((total_2, value, index) = > {
console.log(total_2);
return total_2 + value
})
console.log('sum_2=' + sum_2);
</script>
Copy the code
6. ReduceRight: The function of reduceRight() method is the same as that of reduce(), the difference is that reduceRight() adds the array items in the array forward from the end of the array.
- For of method: Data with interator interface can be traversed using for of. Common examples are arrays, array-like arrays, sets, maps, and so on (excluding objects). If you want to iterate through groups of numbers and use the Index Index, you can iterate through arr.entries() with the for of method
<script>
let arr = ['a'.'b'.'c'.'d']
for (let [index, value] of arr.entries()) {
console.log(index + '-- -- -- -- -- - + value);
}
</script>
Copy the code
Traversal of object properties
- for… In: Loops over the enumerable properties of the object itself and its inheritance (excluding the Symbol property).
<script>
let pStr = Symbol('pStr');
let subStr = Symbol('subStr');
let pObj = {
pId: 1,
[pStr]: 'Parent Symbol type'.pName: 'zhangsan',}let obj = {
subId: 100,
[subStr]: 'Child Symbol type'.subName: ' '.subAge: 20.addr: 'Chaoyang District, Beijing'
}
Object.setPrototypeOf(obj, pObj)
for (const key in obj) {
console.log(key + The '-' + obj[key]);
}
</script>
Copy the code
- Keys (obj) : Returns an array containing all the enumerable properties of the Object itself (excluding the inherited and Symbol properties).
<script>
let pStr = Symbol('pStr');
let subStr = Symbol('subStr');
let pObj = {
pId: 1,
[pStr]: 'Parent Symbol type'.pName: 'zhangsan',}let obj = {
subId: 100,
[subStr]: 'Child Symbol type'.subName: 'xiaoliu'.subAge: 20.addr: 'Chaoyang District, Beijing'
}
Object.setPrototypeOf(obj, pObj)
for (const key of Object.keys(obj)) {
console.log(key + The '-' + obj[key]);
}
</script>
Copy the code
- Object. GetOwnPropertyNames (obj) : returns an array that contains all attributes of the Object itself (excluding Symbol attribute, but not enumerated attribute).
<script>
let pStr = Symbol('pStr');
let subStr = Symbol('subStr');
let pObj = {
pId: 1,
[pStr]: 'Parent Symbol type'.pName: 'zhangsan',}let obj = {
subId: 100,
[subStr]: 'Child Symbol type'.subName: 'xiaoliu'.subAge: 20.addr: 'Chaoyang District, Beijing'
}
Object.setPrototypeOf(obj, pObj)
for (const key of Object.getOwnPropertyNames(obj)) {
console.log(key + The '-' + obj[key]);
}
</script>
Copy the code- Object. GetOwnPropertySymbols (obj) : returns an array that contains all the Symbol attribute of the Object itself.
<script>
let pStr = Symbol('pStr');
let subStr = Symbol('subStr');
let pObj = {
pId: 1,
[pStr]: 'Parent Symbol type'.pName: 'zhangsan',}let obj = {
subId: 100,
[subStr]: 'Child Symbol type'.subName: 'xiaoliu'.subAge: 20.addr: 'Chaoyang District, Beijing'
}
Object.setPrototypeOf(obj, pObj)
console.log(Object.getOwnPropertySymbols(obj));
</script>
Copy the code
- Reflect.ownkeys (obj) : Returns an array containing all the attributes of the object itself (excluding inherited ones).
<script>
let pStr = Symbol('pStr');
let subStr = Symbol('subStr');
let pObj = {
pId: 1,
[pStr]: 'Parent Symbol type'.pName: 'zhangsan',}let obj = {
subId: 100,
[subStr]: 'Child Symbol type'.subName: 'xiaoliu'.subAge: 20.addr: 'Chaoyang District, Beijing'
}
Object.setPrototypeOf(obj, pObj)
console.log(Reflect.ownKeys(obj));
</script>
Copy the code
Each of these methods iterates over the key names of objects, following the order rules. First, all numeric keys are iterated, sorted in ascending order. Next, all the string keys are iterated in ascending order by the time they were added. Finally, all Symbol keys are iterated in ascending order of time they were added. Such as:
Reflect.ownKeys({ [Symbol()] :0.b:0.10:0.2:0.a:0 })
// ['2', '10', 'b', 'a', Symbol()]
Copy the code