В первом случае ошибка возникает потому, что переменная arr не определена. В функции f1 ты передаешь arr в качестве первого аргумента в myFunc, но значение этой переменной не было определено. Вместо этого ты должен передавать переменную arr1, которая является массивом, передавая ее в качестве аргумента при вызове f1.
function f1(myFunc, arr, block) {
myFunc(arr, block);
}
function showArr(arr, block) {
arr[3] = arr[3] * 10;
block.innerHTML = arr.join('_');
}
f1(showArr, arr1, out1); // вызов функции f1 с аргументами showArr, arr1, и out1
Во втором случае, когда вызываешь f1(showArr, arr1, out1) и f1(showArr2, arr1, out2), передавая arr1 в качестве аргумента, он передается по ссылке, поэтому изменения, сделанные в одной функции, будут отражены в другой. В твоем случае, когда showArr умножает 4-й элемент массива на 10, он становится равным 40, а когда showArr2 умножает 5-й элемент массива на 100, он умножает уже измененное значение 4-го элемента, который стал равен 40. Если хочешь изменить только один элемент, нужно передавать его индекс в качестве аргумента функции
function f1(myFunc, arr, block, index) {
myFunc(arr, block, index);
}
function showArr(arr, block, index) {
arr[index] = arr[index] * 10;
block.innerHTML = arr.join('_');
}
function showArr2(arr, block, index) {
arr[index] = arr[index] * 100;
block.innerHTML = arr.join(' ');
}
f1(showArr, arr1, out1, 3); // вызов функции f1 с аргументами showArr, arr1, out1 и индексом 3
f1(showArr2, arr1, out2, 4); // вызов функции f1 с аргументами showArr2, arr1, out2 и индексом 4
Так вот теперь f1 принимает дополнительный аргумент index, который указывает, какой элемент массива должен быть изменен, и передает его в функции showArr и showArr2.
