async function show() {
const sleep = (delay) => {
return new Promise((res) => {
setTimeout(() => {
res(true)
}, delay)
})
}
console.log(1, 'Создали функцию');
var f = function (data) {
console.log('function 1', data);
}
console.log(2, 'Создали массив')
var a = [1];
console.log(3, 'Создали функцию execute')
var execute = function (f, x) {
console.log(5, 'Показываем аргументы')
console.log(arguments)
console.log(6, 'Здесь функция уже передана в setTimeout и ссылка на массив')
setTimeout(function () {
console.log(10, 'Функция есть, ссылка на объект(массив) есть, выполняем')
f(x);
}, 1000);
}
console.log(4, 'Вызвали функцию execute')
execute(f, a) // что выведет в консоль и почему
console.log(7, 'Далее в массиве "a" меняются данные')
a.push(2);
console.log(8, 'Меняем значение переменной f, но она в данном случае обычный примитив и не имеет ссылок, а имеет значение здесь и сейчас')
f = function (data) {
console.log('function 2', data);
}
console.log(9, 'Ждем setTimeout')
await sleep(1500);
console.log('--- Второй пример ---');
console.log(1, 'Создаем массив')
let b = [3];
console.log(2, 'Созадаем объект, в котором есть ключ с типом функция')
let o = {
fnc: function (data) {
console.log('function 3', data);
return data;
}
}
console.log(3, 'Создаем функцию exec')
let exec = function (f, x) {
console.log('Показываем аргументы функции')
console.log(arguments);
console.log('f.fnc', f.fnc);
console.log('f.fnc(999)', f.fnc(999));
console.log(5, 'Тут передали в setTimeout 2 ссылки, на объект и на массив(да по сути на 2 объекта)')
setTimeout(function () {
console.log(9, 'Т.к. мы работаем со ссылкам, то получаем обновленные значения')
f.fnc(x)
}, 1000)
}
console.log(4, 'Вызываем функцию exec')
exec(o, b);
console.log(6, 'Меняем данные в объекте')
o.fnc = function (data) {
console.log('function 4', data)
return data + data;
}
console.log(7, 'Меняем данные в массиве')
b.push(4)
console.log(8, 'Ждем')
}
show();