Ниже мой код:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1 id="message"></h1>
<script src="/traceur.js"></script>
<script src="/BrowserSystem.js"></script>
<script src="/bootstrap.js"></script>
<script type="module">
var x = 'outer scope';
(function() {
console.log(x); //Expected undefined, got undefined ! this is as expected.
var x = 'inner scope';
}());
//same as above, but changed to var to let and x to y
let y = 'outer scope';
(function() {
console.log(y); //Was expecting ReferenceError here, but got undefined. WTF ??!!!
let y = 'inner scope';
}());
</script>
</body>
</html>
Кажется, что временная зона сброса (TDZ) в es6 должна бросать referenceError в случае, если let-var используется до его объявления.
Однако, в этом примере, я получаю undefined для let. Где я иду не так?
Был на эту проблему в течение долгого времени и потратил впустую день на это. (Любые указатели будут очень полезны). Я использую Chrome v58.
v58 имеет совместимость с es6 в соответствии с https://kangax.github.io/compat-table/es6/ в текущем браузере).
Я снял часть трассировки и выложил на babel - попробуйте, и получил тот же результат.
Интересно, почему он не работает в моем chrome v58. Может быть, это требует чего-то еще?
Я удалил код транспилятора и включил экспериментальные функции в JS chrome://flags/# enable-javascript-harmony здесь, и теперь он работал как ожидается.
Версия Chrome v58
Вы используете Traceur, который не поддерживает TDZ для let/const. Он преобразует let
в var
- создание поведения TDZ, чтобы он был идентичен вашему примеру var. Запустите тот же код в среде, совместимой с ES6, и вы увидите ожидаемый результат:
var x = 'outer scope';
(function() {
console.log(x);
var x = 'inner scope';
}());
let y = 'outer scope';
(function() {
console.log(y);
let y = 'inner scope';
}());