Object's methods and properties
for...in
Traverse the enumerable properties of an object other than Symbol in any order
for (variable in object) statement
-
variable
At each iteration, variable is assigned a different property name.
-
object
An object whose enumerable properties of non Symbol type are iterated.
let obj ={ a:1, b:2, c:3 } //Traverse out object properties // 1, for(let prop in obj){ console.log("obj."+prop+"="+obj[prop]); } // 2, for(var prop in obj){ if(obj.hasOwnProperty(prop)){ console.log(`obj.${prop} = ${obj[prop]}`); } }
for...of
for...of statement in Iteratable object (including Array,Map,Set,String,TypedArray,arguments Object, etc.), call the custom iteration hook, and execute the statement for the value of each different attribute
const arr = [ 'a','b','c'] for(const ele of arr){ console.log(ele);//a,b,c }
Syntax:
for (variable of iterable) { //statements }
-
variable
In each iteration, the values of different attributes are assigned to variables.
-
iterable
An object whose properties are iteratively enumerated.
The difference between for... in() and for... of() is mainly reflected in Array
for...in Statement iterates over the of an object in any order Enumerable properties.
for...of statement traversal Iteratable object Define the data to iterate over.
let iterable =[3,5,7,"foo"]; for(let i in iterable){ console.log(i);//0,1,2,3 } for(let i of iterable){ console.log(i);//3,5,7,'foo' }
Object.assign()
**The Object.assign() * * method is used to assign the values of all enumerable attributes from one or more source objects to the target object. It will return the target object
const target = { b: 4, c: 3 } const source = { a: 1, b: 2 }; Object.assign(target, source); console.log(target);//a:1,b:2,c:3 console.log(source);//a:1,b:2
Syntax:
Object.assign(target, ...sources)
-
target
Target object.
-
sources
Source object.
If the attributes in the target object have the same key, the attributes are overwritten by the attributes in the source object. The properties of the subsequent source object will similarly override the properties of the previous source object.
Note: Object.assign will not be used when the source object value is null or undefined Throw an error when.
copy object
let obj1 = {a:0,b:{c:1}} let obj2 = Object.assign({},obj1); console.log(obj2);//{a:0,b:{c:1}}
Copy
Object.assign is a shallow copy. If you need a deep copy, you need to use other methods
let obj1 = {a:0,b:{c:1}} let obj2 = Object.assign({},obj1); console.log(obj2);//{a:0,b:{c:1}} obj1.a=4; console.log(obj1)//a: 4 b: {c: 1} console.log(obj2)//a: 0 b: {c: 1} obj1.b.c =2 console.log(obj1);//a: 4 b: {c: 2} console.log(obj2);//a: 0 b: {c: 2} //deep clone //Use JSON.parse(JSON.stringify()) obj3 = {a:0,b:{c:0}}; let obj4 = JSON.parse(JSON.stringify(obj3)); obj3.b.c=4 obj3.a=4 console.log(obj3);//a: 4 b: {c: 4} console.log(obj4);//a: 0 b: {c: 0}
Merge objects
const obj1 = {a:1} const obj2 = {b:2} const obj3 = {c:3} const obj = Object.assign(obj1,obj2,obj3) console.log(obj1);//{a: 1, b: 2, c: 3} the target object will also change console.log(obj);//{a: 1, b: 2, c: 3}
Merge objects with the same properties
const obj1 = {a:1,b:2,c:3} const obj2 = {b:4,c:5} const obj3 = {c:6} const obj = Object.assign({},obj1,obj2,obj3) console.log(obj);//The back of {a: 1, b: 4, c: 6} covers the front console.log(obj1);//{a:1,b:2,c:3} the target object will not change
Array methods and properties
Array.prototype.forEach()
Array.forEach() executes the given function once for each element of the array
arr.forEach(callback(currentValue,index,array),thisArg)
-
callback
The function executed for each element in the array, which receives one to three parameters:
The current element being processed in the currentValue array. Index the index of the current element being processed in the optional array. Array the array that the optional forEach() method is working on.
-
thisArg optional
Optional parameters. Used as the value of this when the callback function callback is executed.
const array = ['a','b','c'] array.forEach(ele => console.log(ele))
lookup
find()
The parameters are callback functions ⭐⭐⭐⭐
Find the qualified elements in the array. If there are multiple qualified elements, the first element will be returned
let arr = Array.of(1,2,3,4) console.log(arr.find(item => item === 2))//2 //Array empty bits are processed as undefined console.log([,3,4].find(item => true));//undefined
findIndex()
The first parameter: the parameter is also a callback function. The second parameter (optional): Specifies the return index of this value in the callback function ⭐⭐⭐⭐
Find the qualified element index in the array. If there are multiple qualified elements, return the first element index
let arr1 = Array.of(1,2,3,4,5) console.log(arr1.findIndex(item => item == 2))
fill
fill()
Populates the contents of array elements with a range of indexes into a single specified value
There are three parameters:
First parameter: the value to fill in
Second parameter: the starting index to be filled
The third parameter (optional): the end index to be filled. It defaults to the end of the array
let arr2 = Array.of(1,2,3,4,5) console.log(arr2.fill(0,1,2));//[1,0,3,4,5]
copyWithin()
Modifies an array element with a range index to another element with a specified range index for this array
There are three parameters:
First parameter: the starting position to be overwritten
The second parameter: the starting index used to overwrite the data
The third parameter: used to overwrite the end index of the data. It defaults to the end of the array
let a = [1,2,3,4,5,6,7] console.log(a.copyWithin(0,1,3))//[2, 3, 3, 4, 5, 6, 7]
Convert nested array to array
flat()
De flattening
let arr5 = [1,[3,5,[6,3,[7]]]] // If not specified, only one layer is removed console.log(arr5.flat()); console.log(arr5.flat(2)); console.log(arr5.flat(3)); // If flattening has been achieved, the number will be the same no matter how much you add console.log(arr5.flat(4)); // A simple nested array can quickly know how many dimensions it is // It is very troublesome to count or try numbers one by one in a complex nested array // At this time, we introduce the word Infinity // No matter how many layers, directly de flatten console.log(arr5.flat(Infinity));
flatMap()
First, each element in the array is processed, and then the flat() method is executed on the array
console.log([1,2,3,4,5,6].flatMap(n => [n*2] ))//[2, 4, 6, 8, 10, 12] // You can have brackets or not, but you'd better have them console.log([1,2,3,4,5,6].flatMap(n => n*2 ))//[2, 4, 6, 8, 10, 12] // If it is a multi-dimensional array, you need to use flat() before using flatMap() console.log([1,2,[3,4,[5,6]]].flatMap(n => [n*2] ))//[2,4,NaN]