Q:

Разница между методами arr.map() и arr.filter()

Поясните разницу между выводом одного и того же кода методами arr.filter() и arr.map(), почему при проверке числа на принадлежность диапазону, .filter возвращает числовые значения, а .map булевые   
let range_filter = function(arr, a, b) {

    return arr.filter( num => (a <= num && num <= b) );
    // [5, 3, 8, 8, 4, 7, 6] 

}

let range_map = function(arr, a, b){

    return arr.map( num => (a <= num && num <= b) );
    // [true, true, true, false, true, false, true, false, false, true, true]

}

let arr = [5, 3, 8, 1, 8, 2, 4, 0, 2, 7, 6];

console.log( range_filter(arr, 3, 9) );
console.log( range_map(arr, 3, 9) );
console.log(arr);

A:

Arr.filter - создает новый массив, исключая из старого неподходящие
под условия элементы.
Arr.map - создает новый массив, преобразовывая/заменяя элементы
старого.

В вашем примере в map, вы возвращаете не элемент, а результат булевого выражения - true или false;
Arr.filter(callback) {
    let newArr = [];
    Arr.forEach(item => {
        //если коллбек возвращает true, записать элемент в новый массив.
        callback(item) && newArr.push(item);
    })

    return tempArr;
}

Arr.map(callback) {
    let newArr = [];
    //в любом случае записать элемент в новый массив. 
    // Ваш callback = (num) => (a <= num && num <= b) // он возвращает либо true либо false.
    Arr.forEach((item)=>{
        newArr.push(callback(item));        
    })

    return newArr;
}

