Count numbers of Objects and Array contained into a main Object

I have an Object that contains various values, Objects, and Arrays, as shown in the snippet.

I am looking for a function that can count the total number of Objects and Arrays within this Object.

Currently, I am able to iterate through this main Object and log the Objects and Arrays with appropriate indentation. So, I can visualize the structure of this main Object later on; you don't need to worry about that.

What I really want to understand is how my function works, specifically one particular line of code that I wrote. This line was suggested to me as a trick instead of simply calling the function again.

I will provide the Object and function in the snippet below, and I will indicate the part that I don't fully comprehend afterwards.

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->
let datas = {
name:"Main datas list",
content:"List of Students and teachers",
students:[
{
name:"John",
age:23,
courses:["Mathematics","Computer sciences","Statistics"]
},
{
name:"William",
age:22,
courses:["Mathematics","Computer sciences","Statistics","Algorithms"]
}
],
teachers:[
{
name:"Terry",
courses:["Mathematics","Physics"],
}
]
}

		function countAndDisplay(obj, indent = "") {
			let count = 0;

			for (let key in obj) {
				if (typeof obj[key] !== "object") {
					console.log(`${indent}${key} : ${obj[key]}`);
				}

				if (typeof obj[key] === "object") {
					if (Array.isArray(obj[key])) {
						console.log(`${indent}Array : ${key} contains ${obj[key].length} element(s)`);
					} else if (!Array.isArray(obj[key])) {
						console.log(`${indent}Object : ${key} contains ${Object.keys(obj[key]).length} element(s)`);
					}

					count++; // Increment the count for each object or array encountered
 					
					// Recursively count and display sub-elements

					count += countAndDisplay(obj[key], indent + "  ");
					
					console.log(`${indent}=> DEBUG TEST COUNT VALUE = ${count}`); // just to understand how the itertion counts the elements
				}
			}

			return count;
		}

		let totalCount = countAndDisplay(datas);
		console.log(`datas contains ${totalCount} Objects or Arrays`);

<!-- end snippet -->

What is the purpose and behavior of the code snippet here?

count++;

This line increments the value of the variable 'count' by 1 each time it is executed. I understand this part.

The next line is unclear to me:

count += the same function();

Specifically, I'm having trouble understanding how 'count += the same function()' can assign a value to the count variable immediately after it was incremented.

I don't understand why the count variable is incremented (as if assigning a value to it), and then on the next line, count += is used with the recursive function (which seems to assign another value to the variable after the increment).

When I call the function, I know that it will execute all of its code again, including the line where I increment the count variable. However, the syntax is not easy to comprehend because if I simply call the function like countAndDisplay(obj[key], indent + " ") in place of count += countAndDisplay(obj[key], indent + " "), it doesn't work at all and doesn't produce the expected result.

How does the logic behind this work? I am keen to improve my understanding and apply it in similar situations in the future.

tatatic,

The purpose of the code you provided is to count the total number of objects and arrays within datas object and display information about the object's structure with appropriate indentation.

It recursively calls the countAndDisplay function with a sub-element of the object (obj[key]) and an incremented indentation level indent + " ". This recursive call traverses deeper into the nested objects and arrays within the main object.

The initial count value is set to 0 for the recursive counting before the loop starts.
As the loop iterates through the properties of the object, it checks the type of each property using typeof.
If the property is not an object, it logs the key-value pair.
If the property is an object, it increments the count by 1.
Then, the recursive call countAndDisplay(obj[key], indent + " ") is made. This recursive call starts a new instance of the countAndDisplay function with the current sub-element as the object to be processed and an increased indentation level.
The recursive call returns the count of objects and arrays within the sub-element.
The returned count is added to the current value of the count using the += operator, effectively accumulating the count as the recursion unwinds.
The final count value is returned by the main invocation of countAndDisplay function.

The purpose of using count += countAndDisplay(obj[key], indent + " ") is to increment the count variable by the number of objects and arrays encountered at each level of recursion. The total count of objects and arrays within the main object can be calculated by recursively calling the function and accumulating the count.

Regarding the += assignment, it doesn't produce the expected result because the recursive call returns a value that needs to be captured and added to the count. By using count += countAndDisplay(...), you update the count variable with the returned count value from the recursive call, allowing it to accumulate correctly.

I hope this explanation helps clarify the logic behind the code. If you have any further questions or need additional clarification, feel free to ask!