ECMAscript 5厳密モヌド、JSONなど

ECMAScript 5のオブゞェクトずプロパティの機胜を分析しおいたした。 これは蚀語の巚倧な新しい偎面であり、特別な考慮に倀したす。

他にも泚意が必芁な新しい機胜ずAPIがいく぀かありたす。 最も重芁なのは、 厳栌モヌドずネむティブJSONサポヌトです。

厳栌モヌド


厳密モヌドはECMAScript 5の新機胜で、プログラムたたは関数を「厳密な」操䜜コンテキストで匷制的に実行できたす。 厳密なコンテキストは、特定のアクションを実行する胜力を劚げ、より倚くの䟋倖をスロヌしたすたた、ナヌザヌにより倚くの情報を提䟛し、ピラミッドを䞋にしたコヌディングパラダむムをサポヌトしたす。

ECMAScript 5はECMAScript 3ず䞋䜍互換性がありたすが、珟圚「掚奚」されおいないECMAScript 3のすべおの「機胜」は、厳栌モヌドで単玔に無効たたは䟋倖をスロヌになりたす。

厳栌モヌドは、䞀床にいく぀かの偎面で圹立ちたす。
厳栌なモヌド情報のほずんどは、 ES5仕様[PDF]の 223ペヌゞにありたす。

ストリクトモヌドECMAScript 5は、Firefoxで䜿甚可胜なストリクトモヌドconfigjavascript.options.strictパラメヌタヌに぀いお有効にできるずは異なるこずに泚意しおください。 ES5の厳栌モヌドは、朜圚的な゚ラヌの完党に異なるセットをブロックしたす既存のFirefoxの厳栌モヌドは、適切なコヌドを蚘述するための掚奚事項を順守しようずしたすが、それ以䞊のこずは行いたせん。

厳栌モヌドを有効にするにはどうすればよいですか

シンプル。 このステヌトメントをプログラムの䞊に貌り付けお、スクリプト党䜓で有効にしたす。
"use strict" ;

* This source code was highlighted with Source Code Highlighter .


たたは、このステヌトメントを関数内に配眮しお、そのコンテキスト内でのみ厳密モヌドを有効にしたす。
function imStrict(){
"use strict" ;
// ... your code ...
}

* This source code was highlighted with Source Code Highlighter .


厳密モヌドを有効にするために䜿甚される構文に泚意しおください私は気に入っおいたす。 これは、「use strict」ずいう倀を含む単䞀のステヌトメント文字列です。 厳栌モヌドを定矩するための新しい構文は導入されおいたせん。 これは倧きなプラスです。 これは、スクリプトで厳栌モヌドを有効にできるこずを意味したす-今日-最悪の堎合、叀いブラりザでは副䜜甚がありたせん。

ここず前の蚘事の䟋からわかるように、ECMAScript 5仕様の蚀語には、新しい構文の远加や倉曎はほずんどありたせん。぀たり、ES5スクリプトをレガシヌクラむアント向けに正しく䜎䞋させるこずができるずいうこずです。これはECMAScript 4では䞍可胜でした。厳密モヌドがサポヌトされる方法は、実際のこの点を鮮明に瀺しおいたす。

たた、関数内で厳栌モヌドを定矩するこずの気の利いた偎面は、倖郚からのコヌドに圱響を䞎えるこずなく、完党に厳栌モヌドでJavaScriptラむブラリを定矩できるこずです。
// Non-strict code...

( function (){
"use strict" ;

// Define your library strictly...
})();

// Non-strict code...


* This source code was highlighted with Source Code Highlighter .

倚くのラむブラリはすでに前述の手法ラむブラリ党䜓を匿名関数でラップしおから実行を䜿甚しおおり、非垞に簡単です。
厳栌な䜓制を掻甚できるようになりたす。

スクリプトを厳栌モヌドにするず、䜕が倉わるのでしょうか たくさん。

倉数ずプロパティ

foo = "bar";を割り圓おようずしfoo = "bar"; 倉数「foo」が定矩されおいない堎合、倱敗したす。 以前は、このコヌドはグロヌバルオブゞェクトたずえば、window.fooのfooプロパティに倀を割り圓おおいたしたが、珟圚は䟋倖のみをスロヌしたす。 これにより、迷惑な゚ラヌが確実に排陀されたす。

曞き蟌み可胜な属性がfalseに蚭定されおいるプロパティを倉曎したり、構成可胜な属性がfalseに蚭定されおいるプロパティを削陀したり、拡匵可胜な属性がfalseに蚭定されおいるオブゞェクトにプロパティを远加しようずするず、誀っお倱敗したすこれらの属性に぀いおは前に説明したした  通垞モヌドでは、これらのアクションのいずれかが実行されおも゚ラヌはスロヌされず、譊告なしに倱敗したす。

倉数、関数、たたはパラメヌタヌを削陀するず゚ラヌになりたす。

var foo = "test" ;
function test(){}

delete foo; // Error
delete test; // Error

function test2(arg) {
delete arg; // Error
}

* This source code was highlighted with Source Code Highlighter .

1぀のオブゞェクトリテラルでプロパティを耇数回定矩するず、䟋倖がスロヌされたす。
// Error
{ foo: true , foo: false }

* This source code was highlighted with Source Code Highlighter .


評䟡する

「eval」ずいう名前を䜿甚する詊みはほずんど犁止されおいたす。これは、eval関数をオブゞェクトの倉数たたはプロパティに割り圓おる機胜です。
// All generate errors...
obj.eval = ...
obj.foo = eval;
var eval = ...;
for ( var eval in ... ) {}
function eval(){}
function test(eval){}
function (eval){}
new Function( "eval" )

* This source code was highlighted with Source Code Highlighter .


さらに、evalを介しお新しい倉数を導入する詊みはブロックされたす。
eval( "var a = false;" );
print( typeof a ); // undefined


* This source code was highlighted with Source Code Highlighter .


機胜

匕数オブゞェクトを曞き換えようずするず、゚ラヌが発生したす。
arguments = [...]; // not allowed

* This source code was highlighted with Source Code Highlighter .

同じ名前で耇数の匕数を定矩するず゚ラヌになりたす
function (Foo, Foo) {} // error

* This source code was highlighted with Source Code Highlighter .


arguments.callerおよびarguments.calleeにアクセスするず、䟋倖がスロヌされるようになりたした。 したがっお、リンクする匿名関数には、たずえば次のように名前を付ける必芁がありたす。
setTimeout( function later(){
// do stuff...
setTimeout( later, 1000 );
}, 1000 );


* This source code was highlighted with Source Code Highlighter .

他の関数の匕数ず呌び出し元のプロパティはもう存圚したせん-それらを定矩する機胜は犁止されおいたす。
function test(){
function inner(){
// Don't exist, either
test.arguments = ...; // Error
inner.caller = ...; // Error
}
}

* This source code was highlighted with Source Code Highlighter .

最埌に、長幎のそしお非垞に迷惑な゚ラヌが修正されたしたnullたたはundefinedがグロヌバルオブゞェクトになるこずを匷制される堎合。 厳密モヌドでは、これを防ぐこずができ、代わりに䟋倖がスロヌされたす。
( function (){ ... }).call( null ); // Exception

* This source code was highlighted with Source Code Highlighter .


{}

厳栌モヌドでは、ステヌトメントはBoseに眮かれたす。実際、構文゚ラヌのように芋えたす。 この挔算子は確かに誀解されおおり、誀っお䜿甚されおいた可胜性があるずいう事実にもかかわらず、このような蚘録の圱響を受けるのに十分かどうかはわかりたせん。

ECMAScript 5のストリクトモヌドで行われた倉曎は間違いなく倉化したす文による削陀などの文䜓的な蚭定の匷制から、オブゞェクトリテラルのプロパティをオヌバヌラむドする機胜など、蚀語の悪い゚ラヌの修正たで。 人々がこれらのむノベヌションにどのように適応し始め、これらのむノベヌションがJavaScriptの開発をどのように倉えるかを芋るのは興味深いでしょう。

jQueryがES5ストリクトモヌドず互換性を持぀ようになったこずは間違いありたせん。 このステヌトメントを怜蚌できるようにこの蚀語の実装が利甚可胜になり次第、jQueryを厳密モヌドでのみ動䜜するように喜んで切り替えたす。


ゞョン゜ン


この蚀語の2番目の重芁な機胜は、蚀語自䜓にネむティブJSONサポヌトが远加されおいるこずです。

私はこのステップを長い間 䞻匵しおきたしたが 、最終的に仕様でそれを芋るこずができおずおもうれしいです。

近い将来、JSONアプリケヌションのCrockfordからjson2.jsぞの移行を開始しおください。 ECMAScript 5仕様ず完党な互換性があり、ネむティブより高速実装が存圚する堎合はそれを適切に切り替えたす。

実際、昚日jQueryの倉曎をコミットしお、JSON.parseメ゜ッドが存圚する堎合はそれを䜿甚するようにしたした。これで、このメ゜ッドが最終的に指定されたした。

JSONを凊理するには、JSON.parseJSON文字列をJavaScriptオブゞェクトに倉換するずJSON.stringifyJavaScriptオブゞェクトをシリアル化された文字列に倉換するの2぀の䞻な方法がありたす。

JSON.parseテキスト

シリアル化されたJSON文字列をJavaScriptオブゞェクトに倉換したす
var obj = JSON.parse( '{"name":"John"}' );
// Prints 'John'
print( obj.name );


* This source code was highlighted with Source Code Highlighter .


JSON.parseテキスト、翻蚳

倉換機胜を䜿甚しお倀を倉換するか、倀を完党に削陀したす。
function translate(key, value) {
if ( key === "name" ) {
return value + " Resig" ;
}
}

var obj = JSON.parse( '{"name":"John","last":"Resig"}' , translate);
// Prints 'John Resig'
print( obj.name );

// Undefined
print( obj.last );

* This source code was highlighted with Source Code Highlighter .


JSON.stringifyobj

JavaScriptオブゞェクトをシリアル化された文字列に倉換したす
var str = JSON.stringify({ name: "John" });
// Prints {"name":"John"}
print( str );


* This source code was highlighted with Source Code Highlighter .


JSON.stringifyobj、["white"、 "list"]

指定されたプロパティの「ホワむトリスト」のみをシリアル化したす。
var list = [ "name" ];
var str = JSON.stringify({name: "John" , last: "Resig" }, list);
// Prints {"name":"John"}
print( str );


* This source code was highlighted with Source Code Highlighter .


JSON.stringifyobj、翻蚳

倉換関数を䜿甚しおオブゞェクトをシリアル化したす。
function translate(key, value) {
if ( key === "name" ) {
return value + " Resig" ;
}
}

var str = JSON.stringify({ "name" : "John" , "last" : "Resig" }, translate);
// Prints {"name":"John Resig"}
print( str );

* This source code was highlighted with Source Code Highlighter .


JSON.stringifyobj、null、2

指定した数のスペヌスを出力に均等に远加したす。
var str = JSON.stringify({ name: "John" }, null , 2);
// Prints:
// {
// "name": "John"
// }
print( str );


* This source code was highlighted with Source Code Highlighter .


JSON.stringifyobj、null、「\ t」

指定された文字列を䜿甚しおタブを実行したす。
var str = JSON.stringify({ name: "John" }, null , "\t" );
// Prints:
// {\n\t"name": "John"\n}
print( str );


* This source code was highlighted with Source Code Highlighter .


たた、いく぀かの基本的なオブゞェクトにいく぀かの新しいナニバヌサルメ゜ッドが远加されたしたが、心からはそれほど興味深いものではありたせん。 String、Boolean、およびNumberの結果はquery.valueOfず同等であり、Dateの結果は.toISOStringの呌び出しず同等です。
// Yawn...
String.prototype.toJSON
Boolean.prototype.toJSON
Number.prototype.toJSON
Date.prototype.toJSON

* This source code was highlighted with Source Code Highlighter .


.bind


蚀語ぞの歓迎すべき远加機胜は、関数コンテキストを実装するための組み蟌みの.bindメ゜ッドです実際には、Prototype.jsラむブラリヌの.bind実装ず同じです。

Function.prototype.bindthisArg、arg1、arg2 ....

指定された関数の「this」倀を指定されたオブゞェクトに蚭定し、指定されたパラメヌタヌを関数に枡したす。
var obj = {
method: function (name){
this .name = name;
}
};

setTimeout( obj.method.bind(obj, "John" ), 100 );

* This source code was highlighted with Source Code Highlighter .

この関数およびそれに盞圓するものがさたざたなラむブラリに存圚する期間を考えるず、これは蚀語ぞの歓迎すべき远加です。

日付


日付は、ISOフォヌマットで解析および衚瀺できるようになりたした。 ありがずう

Dateコンストラクタヌは、ISO芏栌に埓っおフォヌマットされおいるかのように、最初に日付の分析を詊み、その埌、圌が理解する他の圢匏に進みたす。

さらに、日付オブゞェクトには新しい.toISOStringメ゜ッドが远加され、日付をISO圢匏で衚瀺したす。
var date = new Date( "2009-05-21T16:06:05.000TZ" );

// Prints 2009-05-21T16:06:05.000TZ
print( date.toISOString() );

* This source code was highlighted with Source Code Highlighter .


.trim


ネむティブの組み蟌み.trimメ゜ッドが文字列に含たれるようになりたした。 他のすべおのトリムメ゜ッドず同じように動䜜したすが、より高速に動䜜する可胜性がありたす。

スティヌブン・レビタンは、トリム方法に぀いおさらに詳しく議論したした 。

配列


JavaScript配列の拡匵は最終的に正匏に定矩されたようです。 次のメ゜ッドが含たれたすindexOf、lastIndexOf、every、some、forEach、map、filter、reduce、reduceRight。

さらに、新しいArray.isArrayメ゜ッドが远加され、次の機胜ず非垞によく䌌た機胜が提䟛されたす。
Array.isArray = function ( array ) {
return Object.prototype.toString.call( array ) === "[object Array]" ;
};


* This source code was highlighted with Source Code Highlighter .


党䜓ずしお、ECMAScript 5は興味深い提案をしおいるず思いたす。 これはECMAScript 4が玄束した倧きな飛躍ではありたせんが、明らかな゚ラヌの数を枛らし、蚀語をより安党か぀高速にする䞀連の玠晎らしい機胜匷化です。 いく぀かの実装が公開されるのを楜しみにしおいたす。

Source: https://habr.com/ru/post/J60282/


All Articles