JavaScript — определение объекта доступно перед выполнением кода в Safari

Другой вопрос SO, который вы нашли, на самом деле отвечает на этот вопрос. Вкратце:

Declaring functions inside conditional statements is non-standard, so do not do that.

Учитывая, что это нестандартно, браузеры могут вести себя по-разному.

Кроме того, я не думаю, что ваша техника дает какую-то пользу. Просто удалите галочку «if undefined» и безоговорочно определите функции на верхнем уровне. В любом случае они будут назначены только один раз.

Это поведение связано с использованием небрежного режима в движках Webkit, в котором есть ошибка. Позвольте мне завершить исследование:

В частности, в этом примере есть три ключевых аспекта: в коде нестрогий режим функция — это объявлен внутри блока и ссылка до этого блока.

Как объясняется во введении к Приложение В.3.3, объявления функций внутри блочных операторов изначально не были частью спецификации языка; это было расширение, которое браузеры часто реализовывали, каждый по-своему. ES2015 стремился указать как можно большую часть этого поведения, но, поскольку различия между браузерами не были полностью согласованы, некоторый существующий код неизбежно оставался непереносимым.

"Here are things we were forced to specify because web browsers implemented this behavior and then pages start relying on it, but we aren't happy about it." - Annex B 3.3

В неаккуратный режим JavaScriptCore ведет себя не так, как обычно:

λ eshost -sx "if (typeof foo === 'undefined') { function foo() {} print('ok'); } else { print('hmm'); }"
#### ch, sm, v8, xs
ok

#### jsc
hmm

One solution is to use 'strict' mode:

λ eshost -sx "(function () { 'use strict'; if (typeof foo === 'undefined') { function foo() {} print('ok'); } else { print('hmm'); } })()"

#### ch, jsc, sm, v8, xs
ok

Кроме того, это, по-видимому, происходит только в Safari на верхнем уровне сценариев. В функциях, как и в

function g(){
  console.info(typeof f);
  {
    function f(){}
  }
}

g();

Safari соответствует спецификации. Это вполне может быть связано с тем, что поведение на верхнем уровне скриптов было указано только в ES2016, в 8582e81, в отличие от поведения в функциях, которое было указано в ES2015.

Источник: комментарии, опубликованные Росс Кирслинг и Кевин Гиббонс в выпуске GitHub №1632.

В 2016 году сообщалось об ошибке, связанной с этим поведением при подъеме, Webkit Issue #16309: [ES6]. Реализовать правила подъема функции Приложения B.3.3 для глобальной области видимости. Вот случай Тест262, который охватывает это.

To solve this, I have used Function Expressions:

То есть я заменил function anObject() на var anObject() = function(). Запустите этот код, чтобы понять поток сейчас:

if (typeof anObject == 'undefined') {

  if (typeof anObject == 'undefined') console.info('anObject not defined inside block')
  if (typeof someVariable == 'undefined') console.info('someVariable not defined as of now');

  var anObject = function(someParameter = 'someParameter') {
    var someProperty = 'someProperty';
  }

  console.info('anObject is now defined');
  var someVariable = 404;

  if (typeof someVariable == 'undefined') console.info('someVariable not defined as of now');

}

Что тут происходит?

Функции и переменные поднимаются на верхний уровень. Но такие движки, как V8 (Chrome), семантически определяют имя функции во время выполнения кода. Однако в неаккуратном режиме в браузерах Webkit, даже после стандартизации ECMA2015/16, имя функции определяется до выполнения. Обратите внимание, что на обоих движках функция фактически определена (поднята) раньше всего — это как раз о семантике относительно функции имя. В приведенном выше коде ссылка на анонимную функцию (поскольку у нее сейчас нет имени) назначается объекту во время выполнения, и это также будет нормально работать в Safari. Хорошее объяснение области действия блока и подъема на Какова точная семантика функций блочного уровня в ES6?.