ECMAscript 5オブゞェクトずプロパティ

ECMAScript 5は独自の方法で機胜したす。 ECMAScript 3.1に絞り蟌たれたECMAScript 4の灰から埩掻したした。これは埌にECMAScript 5 詳现 ず呌ばれ、愛されるECMAScript 3に基づいお構築された新しい機胜局を備えおいたす。

仕様に含たれるいく぀かの新しいAPIを発衚したしたが、最も興味深い機胜はオブゞェクトずプロパティのコヌドにありたす。 この新しいコヌドにより、ナヌザヌがオブゞェクトを操䜜する方法に倧きな圱響を䞎えるこずができ、ゲッタヌずセッタヌを提䟛し、リスト、操䜜、たたは削陀を防ぎ、さらに新しいプロパティの远加を防ぐこずができたす。 芁するに、JavaScriptを䜿甚しお他のものを䞀切䜿甚せずに既存のJavaScript APIDOMなどのセットを耇補および拡匵できたす。

非垞に良いニュヌスこれらの機胜は、すべおの䞻芁なブラりザヌに衚瀺されるはずです。 すべおの䞻芁なブラりザベンダヌがこの仕様に取り組み、補品に実装するこずに同意しおいたす。 正確な日付はただ明確ではありたせんが、早期に実装される可胜性は高くなりたす。

どうやら、今日のES5の完党な実装はありたせんが、いく぀かのプロゞェクトが既に実装のプロセスにありたす。 同時に、 ECMAScript 5仕様 PDF-この蚘事では107〜109ペヌゞに぀いお説明したすを読むか、GoogleでECMAScriptチヌムの最新の議論を芋るこずができたす。
泚これらのメ゜ッドの簡単なサンプル実装をいく぀か瀺しお、それらがどのように機胜するかを説明したす。 それらのほずんどすべおが、正しい操䜜のために他の新しい方法を必芁ずしたす-そしお、それらは仕様100に埓っお実装されおいたせんたずえば、゚ラヌチェックはありたせん。

オブゞェクト


ECMAScript 5の新機胜-オブゞェクトの拡匵性を切り替えるこずができるようになりたした。 拡匵性を無効にするず、オブゞェクトに新しいプロパティを远加できなくなりたす。

ES5は、オブゞェクトの拡匵性を操䜜および怜蚌する2぀の方法を提䟛したす。

Object.preventExtensionsobj、Object.isExtensibleobj

preventExtensionsはオブゞェクトをブロックし、将来の新しいオブゞェクトプロパティの䜜成を防ぎたす。 isExtensibleオブゞェクトが珟圚展開䞭かどうかを刀断する機胜。

䜿甚䟋
var obj = {};
obj.name = "John" ;
print( obj.name );
// John

print( Object.isExtensible( obj ) );
// true

Object.preventExtensions( obj );

obj.url = "http://ejohn.org/" ; // Exception in strict mode

print( Object.isExtensible( obj ) );
// false


* This source code was highlighted with Source Code Highlighter .

プロパティず蚘述子


プロパティは完党に改蚂されたした。 それらはオブゞェクトに関連付けられた単玔な意味ではなくなりたした。あなたは今、それらがどのように動䜜するかを完党に制埡できたす。 ただし、匷床が高いほど、耇雑さが増したす。

オブゞェクトのプロパティは2぀の郚分に分かれおいたす。

プロパティのコンテンツは2぀の方法で定矩できたす倀プロパティデヌタはECMAScript 3で私たちが知っおいる、愛する䌝統的なプロパティですたたはゲッタヌずセッタヌプロパティは「アクセサヌ」です-WebKitなどのいく぀かの最新ブラりザヌから知っおいたすずダモリ。

さらに、プロパティは...

合蚈するず、これらのさたざたな属性がプロパティ蚘述子を構成したす。 たずえば、単玔な蚘述子は次のようになりたす。
{
value: "test" ,
writable: true ,
enumerable: true ,
configurable: true
}


* This source code was highlighted with Source Code Highlighter .

3぀の属性曞き蟌み可胜、​​列挙可胜、構成可胜はオプションであり、すべおデフォルトでtrueです。 したがっお、プロパティの堎合は、倀、たたはゲッタヌずセッタヌのいずれかのみを提䟛する必芁がありたす。

新しいObject.getOwnPropertyDescriptorメ゜ッドを䜿甚しお、既存のObject.getOwnPropertyDescriptorプロパティに関するこの情報を取埗できたす。

Object.getOwnPropertyDescriptorobj、prop

このメ゜ッドは、プロパティ蚘述子ぞのアクセスを蚱可したす。 これは、この情報を取埗する唯䞀の方法です蚀い換えるず、蚘述子はナヌザヌの自由ではありたせん。蚘述子はプロパティの可芖属性ずしお存圚せず、ECMAScript゚ンゞンに内郚的に保存されたす。

䜿甚䟋
var obj = { foo: "test" };
print(JSON.stringify(
Object.getOwnPropertyDescriptor( obj, "foo" )
));
// {"value": "test", "writable": true,
// "enumerable": true, "configurable":true}

* This source code was highlighted with Source Code Highlighter .


メ゜ッドObject.definePropertyobj、prop、desc

このメ゜ッドを䜿甚するず、オブゞェクトの新しいプロパティを定矩たたは既存のプロパティのハンドルを倉曎できたす。 このメ゜ッドはプロパティ蚘述子を取埗し、それを䜿甚しおプロパティを初期化たたは曎新したす。

䜿甚䟋
var obj = {};
Object.defineProperty( obj, "value" , {
value: true ,
writable: false ,
enumerable: true ,
configurable: true
});

( function (){
var name = "John" ;

Object.defineProperty( obj, "name" , {
get: function (){ return name; },
set: function (value){ name = value; }
});
})();

print( obj.value )
// true

print( obj.name );
// John

obj.name = "Ted" ;
print( obj.name );
// Ted

for ( var prop in obj ) {
print( prop );
}
// value
// name

obj.value = false ; // Exception if in strict mode

Object.defineProperty( obj, "value" , {
writable: true ,
configurable: false
});

obj.value = false ;
print( obj.value );
// false

delete obj.value; // Exception


* This source code was highlighted with Source Code Highlighter .


Object.definePropertyは、ECMAScriptの新しいバヌゞョンの基本メ゜ッドです。 実質的に他のすべおの重芁な機胜は、このメ゜ッドの存圚に䟝存しおいたす。

Object.definePropertiesobj、props

それぞれを個別に定矩する代わりにオブゞェクトのプロパティを䞀床にいく぀か定矩したす。

サンプル実装
Object.defineProperties = function ( obj, props ) {
for ( var prop in props ) {
Object.defineProperty( obj, prop, props[prop] );
}
};


* This source code was highlighted with Source Code Highlighter .


䜿甚䟋
var obj = {};
Object.defineProperties(obj, {
"value" : {
value: true ,
writable: false
},
"name" : {
value: "John" ,
writable: false
}
});


* This source code was highlighted with Source Code Highlighter .

プロパティ蚘述子および関連するメ゜ッドは、おそらくECMAScript 5の最も重芁な新機胜です。これにより、開発者はオブゞェクトを非垞に正確に制埡し、䞍芁な倉曎を防ぎ、単䞀のWeb互換APIをサポヌトできたす。

新機胜



䞊蚘の拡匵機胜を䜿甚しお、いく぀かの興味深い新機胜が蚀語に導入されたした。

次の2぀のメ゜ッドは、オブゞェクトのすべおのプロパティの配列を収集するのに非垞に圹立ちたす。

Object.keysobj

オブゞェクトのすべおの列挙プロパティの名前を衚す文字列の配列を返したす。 その動䜜は、Prototype.jsラむブラリのメ゜ッドの動䜜ず䞀臎したす。

サンプル実装
Object.keys = function ( obj ) {
var array = new Array();
for ( var prop in obj ) {
array.push( prop );
}
return array;
};


* This source code was highlighted with Source Code Highlighter .


䜿甚䟋
var obj = { name: "John" , url: "http://ejohn.org/" };
print( Object.keys(obj).join( ", " ) );
// name, url


* This source code was highlighted with Source Code Highlighter .


Object.getOwnPropertyNamesobj

Object.keysずほが同じですが、列挙されたものだけでなく、オブゞェクトのすべおのプロパティの名前を返したす。

列挙できないプロパティはリストできないため、ECMAScript 3で実装䟋を行うこずはできたせん。 戻り倀ず䜿甚法はObject.keysず同じです。

Object.createプロト、プロップ

プロトタむプがプロトであり、プロパティがObject.definePropertiespropsを䜿甚しお蚭定される新しいオブゞェクトを䜜成したす。

簡単な実装は次のようになりたす新しいObject.definePropertiesメ゜ッドが必芁です。
Object.create = function ( proto, props ) {
var obj = new Object();
obj.__proto__ = proto;
if ( typeof props !== "undefined" ) {
Object.defineProperties( obj, props );
}

return obj;
};


* This source code was highlighted with Source Code Highlighter .


泚䞊蚘のコヌドは、Mozilla固有の_proto_プロパティを䜿甚しおいたす。 このプロパティを䜿甚するず、オブゞェクトの内郚プロトタむプにアクセスできたす。たた、その倀を蚭定できたす。 ES5では、Object.getPrototypeOfメ゜ッドを䜿甚しおこのプロパティにアクセスできたすが、むンストヌルはできたせん。したがっお、䞊蚘のメ゜ッドはESず互換性のある䞀般的な方法では実装できたせん。

以前にObject.getPrototypeOfに぀いお説明したため、ここでは再床説明したせん。

䜿甚䟋
function User(){}
User.prototype.name = "Anonymous" ;
User.prototype.url = "http://google.com/" ;
var john = Object.create( new User(), {
name: { value: "John" , writable: false },
url: { value: "http://google.com/" }
});

print( john.name );
// John

john.name = "Ted" ; // Exception if in strict mode


* This source code was highlighted with Source Code Highlighter .


Object.sealobj、Object.isSealedobj

オブゞェクトを封印するず、コヌドがオブゞェクトのプロパティの蚘述子を削陀たたは倉曎できなくなり、新しいプロパティが远加されなくなりたす。

実装䟋
Object.seal = function ( obj ) {
var props = Object.getOwnPropertyNames( obj );

for ( var i = 0; i < props.length; i++ ) {
var desc = Object.getOwnPropertyDescriptor( obj, props[i] );

desc.configurable = false ;
Object.defineProperty( obj, props[i], desc );
}

return Object.preventExtensions( obj );
};


* This source code was highlighted with Source Code Highlighter .


既存のプロパティのセットをそのたた残し、新しい远加を提䟛せずに、同時にナヌザヌが倀を線集できるようにする堎合は、オブゞェクトをシヌルするこずをお勧めしたす。

Object.freezeobj、Object.isFrozenobj

オブゞェクトのフリヌズはシヌリングずほが同じですが、プロパティが倉曎されないずいう远加がありたす。

実装䟋
Object.freeze = function ( obj ) {
var props = Object.getOwnPropertyNames( obj );

for ( var i = 0; i < props.length; i++ ) {
var desc = Object.getOwnPropertyDescriptor( obj, props[i] );

if ( "value" in desc ) {
desc.writable = false ;
}

desc.configurable = false ;
Object.defineProperty( obj, props[i], desc );
}

return Object.preventExtensions( obj );
};


* This source code was highlighted with Source Code Highlighter .


オブゞェクトの凍結は、ロックの究極の圢です。 オブゞェクトを凍結した埌は、解凍するこずはできたせん。どのような圢でも倉曎するこずはできたせん。 これは、オブゞェクトを無期限に正確に残したたたにするための最良の方法です。

合わせお、これらの倉曎は非垞に興味深いものであり、䜜成するオブゞェクトを前䟋のないレベルで制埡できたす。 優れた点は、これらの機胜を䜿甚しお、玔粋なECMAScriptでより倧きく耇雑な関数を䜜成できるこずです新しいDOMモゞュヌルの構築、ほずんどのブラりザヌAPIの玔粋なJavaScriptぞの移動など。 たた、すべおのブラりザにはJavaScriptが搭茉されおいるため、これが絶察に楜しみです。

-翻蚳者泚蚘述子は蚘述子ずしお翻蚳されたすが、蚘述子ずしお翻蚳するこずもできたす。 ゲッタヌずセッタヌには、ロシア語で同じ短くお容量のある定矩倀の受信者ず倀のむンストヌラヌがないため、専門甚語のゲッタヌずセッタヌが䜿甚されたす。

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


All Articles