JavaScript'teki Harfler ve Ayarlayıcılar
genel bakış
JavaScript'teki harfler ve ayarlayıcılar, hesaplanan özellikleri veya erişimcileri tanımlamak için kullanılır . Hesaplanan özellik, bir nesne değerini almak veya ayarlamak için bir işlev kullanan bir özelliktir. Temel teori böyle bir şey yapmaktır:
var user = { /* ... object with getters and setters ... */ };
user.phone = '+1 (123) 456-7890'; // updates a database
console.log( user.areaCode ); // displays '123'
console.log( user.area ); // displays 'Anytown, USA'
Bu, sayıları aralıkta tutmak, dizeleri yeniden biçimlendirmek, değer değiştirilmiş olayları tetiklemek, ilişkisel verileri güncellemek, özel mülklere erişim sağlamak ve daha fazlası gibi bir özelliğe erişildiğinde perde arkasındaki işleri otomatik olarak yapmak için kullanışlıdır.
Aşağıdaki örnekler temel sözdizimini gösterir, ancak özel bir şey yapmadan dahili nesne değerini alır ve ayarlarlar. Gerçek dünyadaki durumlarda, girdi ve / veya çıktı değerini yukarıda belirtildiği gibi ihtiyaçlarınıza uyacak şekilde değiştirebilirsiniz.
get / set Anahtar kelimeler
ECMAScript 5 destekler getve setbilgisayarlı özelliklerini tanımlamak için anahtar kelimeler. IE 8 ve altı dışındaki tüm modern tarayıcılarla çalışırlar.
var foo = {
bar : 123,
get bar(){ return bar; },
set bar( value ){ this.bar = value; }
};
foo.bar = 456;
var gaz = foo.bar;
Özel Harfler ve Ayarlayıcılar
getve setayrılmış kelimeler olmadığından, kendi özel, tarayıcılar arası hesaplanmış özellik işlevlerinizi oluşturmak için aşırı yüklenebilirler. Bu herhangi bir tarayıcıda çalışır.
var foo = {
_bar : 123,
get : function( name ){ return this[ '_' + name ]; },
set : function( name, value ){ this[ '_' + name ] = value; }
};
foo.set( 'bar', 456 );
var gaz = foo.get( 'bar' );
Ya da daha kompakt bir yaklaşım için, tek bir işlev kullanılabilir.
var foo = {
_bar : 123,
value : function( name /*, value */ ){
if( arguments.length < 2 ){ return this[ '_' + name ]; }
this[ '_' + name ] = value;
}
};
foo.value( 'bar', 456 );
var gaz = foo.value( 'bar' );
Kod blokajına yol açabilecek böyle bir şey yapmaktan kaçının.
var foo = {
_a : 123, _b : 456, _c : 789,
getA : function(){ return this._a; },
getB : ..., getC : ..., setA : ..., setB : ..., setC : ...
};
Yukarıdaki örneklerde, dahili özellik adları, kullanıcıların basitçe foo.barvs. yapmalarını foo.get( 'bar' )ve "pişmemiş" bir değer elde etmelerini önlemek için alt çizgiyle özetlenmiştir . Erişilen özelliğin adına ( nameparametre üzerinden ) bağlı olarak farklı şeyler yapmak için koşullu kod kullanabilirsiniz .
Object.defineProperty ()
Kullanmak Object.defineProperty()alıcıları ve ayarlayıcıları eklemenin başka bir yoludur ve tanımlandıktan sonra nesnelerde kullanılabilir. Ayrıca yapılandırılabilir ve numaralandırılabilir davranışları ayarlamak için de kullanılabilir. Bu sözdizimi IE 8 ile de çalışır, ancak maalesef yalnızca DOM nesnelerinde.
var foo = { _bar : 123 };
Object.defineProperty( foo, 'bar', {
get : function(){ return this._bar; },
set : function( value ){ this._bar = value; }
} );
foo.bar = 456;
var gaz = foo.bar;
__defineGetter __ ()
Son olarak, __defineGetter__()başka bir seçenektir. Kullanımdan kaldırıldı, ancak yine de web'de yaygın olarak kullanılıyor ve bu nedenle yakında herhangi bir zamanda kaybolması pek mümkün değil. IE 10 ve altı dışındaki tüm tarayıcılarda çalışır. Her ne kadar diğer seçenekler IE olmayan da iyi çalışır rağmen, bu yüzden bu yararlı değil.
var foo = { _bar : 123; }
foo.__defineGetter__( 'bar', function(){ return this._bar; } );
foo.__defineSetter__( 'bar', function( value ){ this._bar = value; } );
Ayrıca belirterek değer ikincisi örneklerde, iç isimler önlemek özyineleme erişimci adlarıyla (yani farklı olması gerektiğidir foo.barçağıran foo.get(bar)çağıran foo.barçağrı foo.get(bar)...).
Ayrıca bakınız
MDN get , set ,
Object.defineProperty () , __defineGetter __ () , __defineSetter __ ()
MSDN
IE8 Getter Desteği