ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScript入門(ストリクトモードを深く理解)_基礎知識

JavaScript入門(ストリクトモードを深く理解)_基礎知識

WBOY
リリース: 2016-05-16 17:42:44
オリジナル
1099 人が閲覧しました

Strict モードは ECMAScript5 の新機能です。 ECMAScript5 は ECMAScript3 と下位互換性がありますが、厳密モードを使用すると、ECMAScript5 で「推奨されなくなった」すべての ECMAScript3 構文関数が上書きされ、それらが出現すると行がスローされます。 Strict モードは、一般的なエラーと悪名高いエラーを異なる方法で処理する、JavaScript の「より良い」バージョンを開発者が選択できるようにするために導入されました。 IE10 や Opera12 を含むすべての主要ブラウザの最新バージョンは、厳密モードをサポートしています。厳密モードに関するほとんどの情報は、ES5 仕様 [PDF] の 223 ページに記載されています。

厳密モードを有効にする方法
厳密モードはグローバルまたは関数スコープ内で使用できます。厳密モードをグローバルに有効にしたい場合は、プログラムの最初の行のコードを使用するだけです:

コードをコピー コードは次のとおりです。 :

'use strict';

関数内で strict モードを有効にするには、関数本体の最初の行のコードを使用するだけです:
コードをコピー コードは次のとおりです:

function imStrict(){
'use strict ';
// ...その他のコード...
}

厳密モードを有効にするステートメントは、新しい構文を含まない単なる文字列「use strict」です。つまり、古いブラウザに悪影響はありませんので、安心してご使用ください。

関数内で厳密モードを有効にする実際の応用例は、外部コードが影響を受けないように、厳密モード関数内で Javascript クラス ライブラリ全体を定義することです。
コードをコピー コードは次のとおりです:

(function(){
"use strict";
// ライブラリを定義します厳密に ...
})();

厳密モードは何をもたらしますか?
特別な機能を紹介する前に、厳密モードについて覚えておく必要があります。目標の 1 つは、エラーをより迅速にデバッグできるようにすることです。開発者がデバッグできるようにする最善の方法は、何もせずに失敗したり、奇妙な動作を示したりするのではなく、特定のパターンが発生したときにエラーをスローすることです (これが、JavaScript で厳密モードが使用されなくなった理由です)。厳密モードのコードでは、より多くのエラー メッセージがスローされますが、これは開発者がすぐに解決する必要がある問題にすぐに気づくのに役立つため、良いことです。

with ステートメントの削除 (Eliminates with)
まず、strict モードでは with ステートメントが削除されます。 with ステートメントが厳密モードで表示されると、不正な JavaScript ステートメントとみなされ、構文エラーがスローされます。したがって、strict モードを使用するための最初のステップは、with を使用していないことを確認することです。
コードをコピー コードは次のとおりです:

// strict では構文エラーが発生します。 mode
with(location){
alert(href);
}

偶発的なグローバルの防止 (偶発的なグローバルの防止)
2 番目のポイントの場合、変数は代入前に宣言する必要があります。非厳密モードでは、宣言されていない変数に値を割り当てると、その名前のグローバル変数が自動的に生成されます。これは、JavaScript で最も一般的なエラーの 1 つです。厳密モードでは、これを行うとエラーがスローされます。
コードをコピー コードは次のとおりです:

// strict モードでエラーをスローします
(function(){
someUndeclaredVar ="foo";
}());

この値の強制をキャンセルします (この強制を削除します)
もう 1 つの重要な変更は、この値が null または未定義の場合にグローバル オブジェクトにキャストされなくなることです。つまり、元の値が保持されるため、キャストに依存する一部のコードでエラーが発生する可能性があります。例:
コードをコピー コードは次のとおりです:

window.color ="red ";
function SayColor(){
// 厳密モードでは、これはウィンドウを指しません
alert(this.color);
}
// 次の 2 つの場合、どちらも厳密モードでスローされます。エラー
sayColor();
sayColor.call(null);
基本的に、this 値を割り当てる必要があります。割り当てないと、未定義の値が残ります。これは、コンストラクターを呼び出すときに new キーワードを省略するとエラーも発生することを意味します:
コードをコピー コードは次のとおりです:

functionperson(name){
this.name = name;
}
// strict モードでエラーが発生します
var me =person("Nicholas"); 🎜 >
このコードでは、Person コンストラクターを呼び出すときに new キーワードが欠落しており、this 値は未定義です。未定義にプロパティを追加できないため、このコードはエラーをスローします。非厳密モードでは、これはグローバル オブジェクトに強制されるため、name 属性をグローバル変数として正しく割り当てることができます。

重複なし大量のコーディングを行うと、オブジェクトに重複した属性を定義したり、関数に重複したパラメーター名を定義したりすることが簡単に発生します。厳密モードでは、両方の状況でエラーが発生します:

コードをコピー コードは次のとおりです:
// 厳密モードでのエラー - パラメータ
関数の重複 doSomething(value1, value2, value1){
//コード
}
// 厳密モードでのエラー - 属性
var オブジェクトの重複={
foo:"bar",
foo:"baz"
};

これらは両方とも構文エラーであり、コードが実行される前にエラーがスローされます。

より安全な eval()(より安全な eval())eval() は削除されていませんが、厳密モードでいくつかの変更が加えられています。最大の変更点は、eval() ステートメントで宣言された変数と関数が、それを含むスコープ内で作成されなくなることです。例:

コードをコピー コードは次のとおりです。
(function(){
eval( "var x = 10;");
// 非厳密モードでは、x は 10
// 厳密モードでは、x は宣言されず、エラーがスローされます
alert( x);
}());

eval() によって作成された変数または関数は、引き続き eval() に残ります。ただし、eval() から値を返すことで値を渡すことができます:

コードをコピー コードは次のとおりです:
(function(){
var result =eval("var x = 10, y = 20; x y");
// 厳密モードでも非厳密モードでも正常に動作します(30 を取得)
alert(result);
}());


不変のエラー (不変のエラー) ECMAScript 5 も導入しますプロパティを読み取り専用に設定したり、オブジェクトの構造全体をフリーズしたりするなど、プロパティの特性を変更する機能。非厳密モードでは、不変プロパティを変更しようとするとサイレントに失敗します。一部のネイティブ API を使用しているときに、この種の問題が発生したことがあるかもしれません。厳密モードでは、許可されていない方法でオブジェクトまたはオブジェクトのプロパティを変更しようとすると必ずエラーがスローされます。

コードをコピーします コードは次のとおりです。
var person ={}; Object.defineProperty (person,"name"{
writable:false,
value:"Nicholas"
}); 非厳密モードではサイレントに失敗し、エラーがスローされます。 strict モード
person.name ="John";


この例では、name 属性は読み取り専用に設定されています。非厳密モードでは、名前への割り当ては、厳密モードではサイレントに失敗し、エラーがスローされます。


: ECMAScript 属性機能を使用している場合は、厳密モードを有効にすることを強くお勧めします。オブジェクトの変更可能性を変更している場合、非厳密モードではサイレントに処理されるはずの大量のエラーが発生することになります。
関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート