0

У меня 2 вопроса:
setTimeout в данном случае в замыкании с execute? как работает arguments функции execute, почему f не изменился, а а изменился

var f = function (data) {

  console.log('function 1', data);

}
var a = [1];
var execute = function (f,x) {
  console.log(arguments)

  setTimeout(function(){f(x)}, 1000);

}
execute(f, a) // что выведет в консоль и почему
a.push(2)

f = function () {
  console.log('function 2');

}
// [Arguments] { '0': [Function: f], '1': [ 1 ] }
// function 1 [ 1, 2 ]

1 ответ 1

1

Ход выполнения кода и причины поведения описаны в консоль логе.

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();

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.