Good evening. This is me and my circus questions again)) There are two arrays - an array of objects and just an array of numbers:

var numbers1 = [{prop: 1},{prop: 2},{prop: 3},{prop: 4},{prop: 5},{prop: 6}]; var numbers2 = [2,3,4,6];

Why .filter over numbers1 is as follows:

 var mynumbers = numbers1.filter(function(number1) { var bufferNumber; numbers2.forEach(function(number2) { if (number1.prop == number2) { bufferNumber = number1; return bufferNumber; } }); return bufferNumber; });

gives to the console the expected [ { prop: 2 }, { prop: 3 }, { prop: 4 }, { prop: 6 } ] , and the variant without declaring a buffer variable:

 var mynumbers = numbers1.filter(function(number1) { numbers2.forEach(function(number2) { if (number1.prop == number2) return number1; }); return number1; });

does not filter the numbers1 array, but returns its unfiltered version

 [ { prop: 1 }, { prop: 2 }, { prop: 3 }, { prop: 4 }, { prop: 5 }, { prop: 6 } ]

?

    1 answer 1

    Everything is very simple: if the callback passed to the filter function returns the result corresponding to true - the element is placed in the result, if false does not fit.

    In the example, the numbers array contains objects that always correspond to true , therefore in the second example, if we throw out the inner loop from it, which does not affect anything, we get

     var mynumbers = numbers1.filter(function(number1) { return number1; });

    whence it is seen that by returning an element of this array, all elements satisfy the condition and fit into the result.

    With the first case, the situation is more interesting.

    First, the temporary variable is returned, it is declared inside the callback function, and its own at each iteration.

    Secondly, the value is assigned to it depending on the condition, and otherwise it is undefined , which corresponds to false , so if the value of the property was not found, the value of the variable remains undefiend and the array element being checked is not recorded in the result.

    small digression: the return inside the callback of the forEach function passed does not interrupt the collection traversal. In this case, it is easier to check the occurrence using the indexOf function or some

     var numbers1 = [{ prop: 1 }, { prop: 2 }, { prop: 3 }, { prop: 4 }, { prop: 5 }, { prop: 6 }]; var numbers2 = [2, 3, 4, 6]; document.write('temp variable:', '<br>') var mynumbers = numbers1.filter(function(number1) { var bufferNumber; numbers2.forEach(function(number2) { if (number1.prop == number2) { bufferNumber = number1; return bufferNumber; } }); document.write('el:', JSON.stringify(number1), '->', !!bufferNumber, '<br>'); return bufferNumber; }); document.write('result: ', JSON.stringify(mynumbers), '<br>'); document.write('<br>', 'without temp variable:', '<br>') var mynumbers = numbers1.filter(function(number1) { numbers2.forEach(function(number2) { if (number1.prop == number2) return number1; }); document.write('el:', JSON.stringify(number1), '->', !!number1, '<br>'); return number1; }); document.write('result: ', JSON.stringify(mynumbers), '<br>'); document.write('<br>', 'with indexOf:', '<br>') var mynumbers = numbers1.filter(function(number1) { document.write('el:', JSON.stringify(number1), '->', numbers2.indexOf(number1.prop) > -1, '<br>'); return numbers2.indexOf(number1.prop) > -1; }); document.write('result: ', JSON.stringify(mynumbers), '<br>'); document.write('<br>', 'with some function:', '<br>') var mynumbers = numbers1.filter(function(number1) { document.write('el:', JSON.stringify(number1), '->', numbers2.some(function(num) { return num == number1.prop }), '<br>'); return numbers2.some(function(num) { return num == number1.prop }); }); document.write('result: ', JSON.stringify(mynumbers), '<br>');

    • why in the second version the check .forEach on the second array does not affect anything? - Anton Foigt
    • @AntonFoigt, because it does nothing: ran through the numbers2 collection, fulfilling or not fulfilling the condition and without changing the state of the function outside - Grundy
    • @AntonFoigt, before the snippet, there is a slight digression about forEach - Grundy