検索
ホームページウェブフロントエンドフロントエンドQ&Aes6 の一時的なデッドゾーンとは何を意味しますか?
es6 の一時的なデッドゾーンとは何を意味しますか?Jan 03, 2023 pm 03:56 PM
es6一時的なデッドゾーン

es6 では、一時的なデッド ゾーンは構文エラーであり、ブロックを閉じたスコープにする let および const コマンドを指します。コード ブロック内では、let/const コマンドを使用して変数が宣言される前に、変数は使用できず、変数が宣言される前は変数の「デッド ゾーン」に属します。これは構文上「一時デッド ゾーン」と呼ばれます。 ES6 では、一時的なデッド ゾーンや let ステートメントや const ステートメントでは変数のプロモーションが発生しないことを規定しています。これは主に実行時エラーを軽減し、変数が宣言される前に使用されて予期せぬ動作が発生することを防ぐためです。

es6 の一時的なデッドゾーンとは何を意味しますか?

このチュートリアルの動作環境: Windows 7 システム、ECMAScript バージョン 6、Dell G3 コンピューター。

一時的なデッド ゾーンとは

#ES6 のコード ブロック内で、let/const コマンドを使用して変数を宣言する前、変数は使用できず、宣言される前は変数の「デッド ゾーン」に属しています。文法的には、これは「一時的なデッド ゾーン」(TDZ) と呼ばれます。 ES 標準では TDZ について明示的に言及していませんが、let と const の改善しない効果を説明するためによく使用されます。

let/const と var

ES6 より前は、JS スコープはグローバル スコープと関数スコープの 2 種類しかありませんでした。しかし、ES6 ではブロックレベルのスコープが登場しました。つまり、ブロックレベルのスコープは let/const を使用して定義できます。 ES6 の新機能の中で、TDZ の役割を確認する最も簡単な方法は、let/const を使用することです。 let/const と var には主に 2 つの違いがあります:

  • let/const はブロック スコープを使用します; var は関数スコープを使用します
  • let/const が宣言される前に対応する変数にアクセスする場合および定数の場合は、ReferenceError がスローされますが、var 宣言の前に対応する変数にアクセスすると、unknown が返されます
console.log(Vname); // undefined;
console.log(Lname); // ReferenceError
var Vname = 'xiaoxiao';
let Lname = 'xiaoxiao';

実践により、宣言前に var 定義を使用すると、 let's変数を使用する場合は未定義ですが、let's unknown変数を使用するとエラーがスローされます。 ES6 の let で宣言された変数には変数昇格の効果がないためです。

var x = 10;
if (true) {
    x = 20; // ReferenceError
    let x;
 }

ES6 では、ブロック内に let および const コマンドがある場合、このブロック内のこれらのコマンドによって宣言された変数は最初から閉じられたスコープを形成することを明確に規定しています。宣言前にこれらの変数を使用すると、エラーが発生します。 つまり、コード ブロック内では、let コマンドを使用して宣言されるまで変数は使用できません。文法的には、これは「一時的なデッド ゾーン」(TDZ) と呼ばれます。

if (true) {
  // TDZ开始
  tmp = 'abc'; // ReferenceError
  console.log(tmp); // ReferenceError

  let tmp; // TDZ结束
  console.log(tmp); // undefined

  tmp = 123;
  console.log(tmp); // 123
}

上記のコードでは、let コマンドが変数 tmp を宣言する前に、変数 tmp の「デッド ゾーン」に属しています。

typeof の「デッド ゾーン」トラップ

typeof を使用すると、指定された変数のデータ型を検出できることは誰もが知っています。値が定義されているかどうかを決定します。 unknown が返された場合、値が未定義であることを意味します。 ただし、typeof の宣言前に const/let で定義された変数を使用するとエラーが報告されます

typeof x; // ReferenceError
let x;

x は let で宣言されているため、x 宣言前は一時的なデッドゾーンとなります。 typeof エラーが報告されます。したがって、let/const を使用して宣言された変数は、typeof を使用するときに必ずしも安全であるとは限りません。

typeof y; // 'undefined'

しかし、typeof を定義せずに単に使用した場合、エラーは報告されないことがわかります。このことから、const/let 定義を使用するための明確な規定がない限り、エラーは報告されないことがわかります。エラーにはなりません。

パラメータを渡す「デッドゾーン」の罠

たとえば、次のコードでは、

function bar(x = y, y = 2) {
  return [x, y];
}

bar(); // 报错
を使用しています。

上記のコードで、bar 関数を呼び出すとエラーが報告される理由 (一部の実装ではエラーが報告されない場合があります) は、パラメーター x のデフォルト値が別のパラメーター y と等しく、この時点では y が宣言されていないためです。 「デッドゾーン」に属する時間。 y のデフォルト値が x の場合、x はこの時点で宣言されているため、エラーは報告されません。

function bar(x = 2, y = x) {
  return [x, y];
}
bar(); // [2, 2]

var ステートメントと let ステートメントの使用のもう 1 つの違い。

// 不报错
var x = x;

// 报错
let x = x;
// ReferenceError: x is not defined

「デッド ゾーン」の影響を受け、let を使用して変数を宣言する場合、宣言が完了する前に変数が使用されている限り、エラーが報告されます。上の行はこの状況に属し、変数 x の宣言文が実行される前に x の値が取得されるため、「x が定義されていません」というエラーが発生します。

概要

ES6 では、主に実行時エラーを削減し、エラーを防ぐために、一時的なデッド ゾーンや let ステートメントや const ステートメントでは変数のプロモーションが発生しないと規定しています。変数を宣言する前に使用すると、予期しない動作が発生する可能性があります。このような間違いは ES5 ではよくあることですが、この規定が整備されたことで、それらを避けるのは簡単です。

つまり、一時的なデッド ゾーンの本質は、現在のスコープに入るとすぐに、使用したい変数がすでに存在するにもかかわらず、それを取得できないということです。変数を宣言するコード行が表示されるので、この変数を使用します。

注: TDZ はもともと const 用に設計されましたが、その後の let の設計にも一貫性がありました。

注: ES6 標準では、const に対して宣言された識別子は依然として定数変数と呼ばれる変数であることがよくあります。 const 宣言で作成された定数は JS では再代入できませんが、不変ではないため、両者の概念には依然として大きな違いがあります。

【関連する推奨事項: JavaScript ビデオ チュートリアル Web フロントエンド ]

以上がes6 の一時的なデッドゾーンとは何を意味しますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
es6怎么判断是否为数组es6怎么判断是否为数组Apr 25, 2022 pm 06:43 PM

在es6中,可以利用“Array.isArray()”方法判断对象是否为数组,若判断的对象是数组,返回的结果是true,若判断对象不是数组,返回的结果是false,语法为“Array.isArray(需要检测的js对象)”。

es6中遍历跟迭代的区别是什么es6中遍历跟迭代的区别是什么Apr 26, 2022 pm 02:57 PM

es6中遍历跟迭代的区别是:遍历强调的是要把整个数据依次全部取出来,是访问数据结构的所有元素;而迭代虽然也是依次取出数据,但是并不保证取多少,也不保证把所有的数据取完,是遍历的一种形式。

es6暂时性死区是什么意思es6暂时性死区是什么意思Jan 03, 2023 pm 03:56 PM

在es6中,暂时性死区是一个语法错误,是指let和const命令使区块形成封闭的作用域。在代码块内,使用let/const命令声明变量之前,该变量都是不可用的,在变量声明之前属于该变量的“死区”;这在语法上,称为“暂时性死区”。ES6规定暂时性死区和let、const语句不出现变量提升,主要是为了减少运行时错误,防止在变量声明前就使用这个变量,从而导致意料之外的行为。

es6中怎么判断两个对象是否相等es6中怎么判断两个对象是否相等Apr 19, 2022 pm 03:34 PM

在es6中,可用Object对象的is()方法来判断两个对象是否相等,该方法检测两个变量的值是否为同一个值,判断两个对象的引用地址是否一致,语法“Object.is(对象1,对象2)”;该方法会返回布尔值,若返回true则表示两个对象相等。

es6怎么将数字转为字符串es6怎么将数字转为字符串Apr 19, 2022 pm 06:38 PM

转换方法:1、利用“+”给数字拼接一个空字符,语法“数字+""”;2、使用String(),可把对象的值转换为字符串,语法“String(数字对象)”;3、用toString(),可返回数字的字符串表示,语法“数字.toString()”。

sort排序是es6中的吗sort排序是es6中的吗Apr 25, 2022 pm 03:30 PM

sort排序是es6中的;sort排序是es6中用于对数组的元素进行排序的方法,该方法默认不传参,按照字符编码顺序进行排序,排序顺序可以是字母或数字,并按升序或降序,语法为“array.sort(callback(a,b))”。

es6中assign的用法是什么es6中assign的用法是什么May 05, 2022 pm 02:25 PM

在es6中,assign用于对象的合并,可以将源对象的所有可枚举属性复制到目标对象;若目标对象与源对象有同名属性,或多个源对象有同名属性,则后面的属性会覆盖前面的属性,语法为“Object.assign(...)”

es6怎么改变数组数据es6怎么改变数组数据Apr 26, 2022 am 10:08 AM

改变方法:1、利用splice()方法修改,该方法可以直接修改原数组的内容,语法为“数组.splice(开始位置,修改个数,修改后的值)”;2、利用下标访问数组元素,并重新赋值来修改数组数据,语法为“数组[下标值]=修改后的值;”。

See all articles

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

MinGW - Minimalist GNU for Windows

MinGW - Minimalist GNU for Windows

このプロジェクトは osdn.net/projects/mingw に移行中です。引き続きそこでフォローしていただけます。 MinGW: GNU Compiler Collection (GCC) のネイティブ Windows ポートであり、ネイティブ Windows アプリケーションを構築するための自由に配布可能なインポート ライブラリとヘッダー ファイルであり、C99 機能をサポートする MSVC ランタイムの拡張機能が含まれています。すべての MinGW ソフトウェアは 64 ビット Windows プラットフォームで実行できます。

AtomエディタMac版ダウンロード

AtomエディタMac版ダウンロード

最も人気のあるオープンソースエディター

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

mPDF

mPDF

mPDF は、UTF-8 でエンコードされた HTML から PDF ファイルを生成できる PHP ライブラリです。オリジナルの作者である Ian Back は、Web サイトから「オンザフライ」で PDF ファイルを出力し、さまざまな言語を処理するために mPDF を作成しました。 HTML2FPDF などのオリジナルのスクリプトよりも遅く、Unicode フォントを使用すると生成されるファイルが大きくなりますが、CSS スタイルなどをサポートし、多くの機能強化が施されています。 RTL (アラビア語とヘブライ語) や CJK (中国語、日本語、韓国語) を含むほぼすべての言語をサポートします。ネストされたブロックレベル要素 (P、DIV など) をサポートします。