Need some help regarding Basic Data Structure Challenge (Iterate Through All an Array's Items Using For Loops)

Tell us what’s happening:
Here is my version of the code, I don’t know whether it is the correct solution or not but it crashes FreeCodeCamp browser every time I run it (I checked this by running this code about 6 times). The other thing is that I still don’t understand what “i–” achieves in this code (I saw some solutions of this program in this forum). From what I understand, “i–” will decrement “i” counter back to 0. Aren’t we supposed to let the outer for loop complete its iteration along with its inner for loop?
Here is the solution that I was referring to:

1

Your code so far


function filteredArray(arr, elem) {
  let newArr = [];
  // change code below this line
  for(let i=0; i<arr.length; i++){
    for(let j=0; j<arr[i].length; j++){
      if(arr[j].indexOf(elem)==-1){
        newArr.push(arr);
        i--;
        break;
      }
      else{
        arr.splice(i,1);
        newArr.push(arr);
        i--;
        break;
      }
    }
  }
  // change code above this line
  return newArr;
}

// change code here to test different cases:
console.log(filteredArray([[3, 2, 3], [1, 6, 3], [3, 13, 26], [19, 3, 9]], 3));

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3770.100 Safari/537.36.

Link to the challenge:
https://learn.freecodecamp.org/javascript-algorithms-and-data-structures/basic-data-structures/iterate-through-all-an-arrays-items-using-for-loops

Your code has been blurred out to avoid spoiling a full working solution for other campers who may not yet want to see a complete solution. In the future, if you post a full passing solution to a challenge and have questions about it, please surround it with [spoiler] and [/spoiler] tags on the line above and below your solution code.

Thank you.

Yours is not the correct solution
at one point (at first i-- executed) you have arr[-1].length which will give error TypeError: Cannot read property 'length' of undefined. This happen because your code is always decrementing i by one

the solution you have posted a screenshot of have just an if statement, that means that only some of the times they do that.

The i-- immediately after a splice() is there because splice() remove elements from the array, and it would means that some elemements wouldn’t be checked upon.

Your solution seems to be putting together the wrong pieces of different solutions.

I will keep that in mind when I post questions which might contain spoilers

Thank you for your reply, I executed this code in chrome driver tools and there only if statement seemed to work and not else, which is understandable as this code wasn’t running in FCC browser (crashing every time). Although, at first the solution that sprang to my mind was indexOf() method based on arr[i] using only one for loop but I opted for nested for loops because I was under the impression to always use nested for loops in case of nested arrays. arr[i][j].indexOf(elem) didn’t work as it was not a function. Although I will try different solutions instead of the ones posted in forums and try to solve it using my way.
I was only confused about i-- and I still am as it decrements i following the splice method. If i is at 1 counter for example and in the spoiler solution if arr[1][1] === 3, splice would remove 1 which means newArr would now contain [[3,2,3], [3,13,26], [19,3,9]] which begs the question that why do we need to decrement i-- if break statement already breaks the current iteration of the for loop?

It is for the nested for loops, as you see the j-loop is broken, the i-loop keeps going.

I will show with a simpler example:

let arr = [0,1,2,3,4,5];
for (let i = 0; i < arr.length; i++) {
console.log("i: " + i);
console.log("arr[i]: " + arr[i]);
   if (arr[i] % 2) {
      arr.splice(i, 1);
   }
}

The console shows this: (look at the elements in the array)

i :0
arr[i]: 0
i :1
arr[i]: 1
i :2
arr[i]: 3
i :3
arr[i]: 5

Why? Well, because splice changes the array. If instead we add the i-- right after splicing, then all the elements in the array are being looped over:

i :0
arr[i]: 0
i :1
arr[i]: 1
i :1
arr[i]: 2
i :2
arr[i]: 3
i :2
arr[i]: 4
i :3
arr[i]: 5

If you want a visual rapresentation step by step, check this tool: http://pythontutor.com/javascript.html

I understood it perfectly last night, I decided to add console.log to see for the changes and I wasn’t even aware of the changes that slice was making in the array, removing a nested array was also reducing the array’s length. Thank-you once again for taking your time to explain this to me.