Nesne değişmezlerinde / başlatıcılarında öz referanslar

Aşağıdaki gibi bir şeyin JavaScript'te çalışmasını sağlamanın bir yolu var mı?

var foo = {
    a: 5,
    b: 6,
    c: this.a + this.b  // Doesn't work
};

Mevcut formda, bu kod, thisbaşvurmadığı için bir referans hatası atar foo. Ancak , bir nesne hazır bilgisinin özelliklerinde daha önce bildirilen diğer özelliklere bağlı değerlerin bulunmasının herhangi bir yolu var mı?

Size anlatabileceğim tek şey alıcı :

var foo = {
  a: 5,
  b: 6,
  get c() {
    return this.a + this.b;
  }
}

console.log(foo.c) // 11

Bu, ECMAScript 5. Baskı Spesifikasyonu tarafından sunulan sözdizimsel bir uzantıdır, sözdizimi çoğu modern tarayıcı (IE9 dahil) tarafından desteklenir.

Şöyle bir şey yapabilirsiniz:

var foo = {
   a: 5,
   b: 6,
   init: function() {
       this.c = this.a + this.b;
       return this;
   }
}.init();

Bu, nesnenin bir kez bir kez başlatılması olabilir.

Not aslında dönüş değeri atamak olduğunu init()için foobu yüzden zorunda return this.

Açık, basit cevap eksik, bu yüzden tamlık için:

Ancak , bir nesne hazır bilgisinin özelliklerinde daha önce bildirilen diğer özelliklere bağlı değerlerin bulunmasının herhangi bir yolu var mı?

Hayır. Buradaki tüm çözümler nesneyi oluşturulana kadar (çeşitli şekillerde) erteleyin ve sonra üçüncü özelliği atayın. En basit yol sadece bunu yapmaktır:

var foo = {
    a: 5,
    b: 6
};
foo.c = foo.a + foo.b;

Diğerlerinin hepsi aynı şeyi yapmanın daha dolaylı yoludur. (Felix, özellikle zekidir, ancak geçici bir işlev oluşturmayı ve yok etmeyi, karmaşıklık eklemeyi gerektirir; ya da nesneye fazladan bir özellik bırakır veya [ deletebu özellik sizseniz ] söz konusu nesne üzerindeki sonraki özellik erişimlerinin performansını etkiler .)

Tümünün tek bir ifadede olması gerekiyorsa, bunu geçici özellik olmadan yapabilirsiniz:

var foo = function(o) {
    o.c = o.a + o.b;
    return o;
}({a: 5, b: 6});

Veya elbette, bunu bir kereden fazla yapmanız gerekiyorsa:

function buildFoo(a, b) {
    var o = {a: a, b: b};
    o.c = o.a + o.b;
    return o;
}

o zaman onu kullanmanız gereken yer:

var foo = buildFoo(5, 6);

Anonim bir işlevi başlatmanız yeterlidir:

var foo = new function () {
    this.a = 5;
    this.b = 6;
    this.c = this.a + this.b;
};

Şimdi ES6'da tembel önbellek özellikleri oluşturabilirsiniz. İlk kullanımda, özellik normal statik özellik haline gelmek için bir kez değerlendirilir. Sonuç: Matematik işlevi ek yükü ikinci kez atlandığında.

Sihir alıcıda.

const foo = {
    a: 5,
    b: 6,
    get c() {
        delete this.c;
        return this.c = this.a + this.b
    }
};

Ok getter olarak thisalır çevreleyen sözcük kapsamını .

foo     // {a: 5, b: 6}
foo.c   // 11
foo     // {a: 5, b: 6 , c: 11}  

Bazı kapanmalar bununla başa çıkmalıdır;

var foo = function() {
    var a = 5;
    var b = 6;
    var c = a + b;

    return {
        a: a,
        b: b,
        c: c
    }
}();

Değişkenler içinde bildirilen tüm fooözeldir fooEğer herhangi bir işlev bildirimiyle beklediğiniz gibi ve onlar kapsamda tüm çünkü, hepsi başvurmak zorunda kalmadan birbirlerine erişebilir thisbir işlevle bekleneceği gibi,. Fark, bu işlevin özel değişkenleri ortaya çıkaran ve o nesneyi atayan bir nesneyi döndürmesidir foo. Sonunda, yalnızca return {}ifade ile nesne olarak göstermek istediğiniz arabirimi döndürürsünüz .

Daha sonra fonksiyon, sonunda ()tüm foo nesnesinin değerlendirilmesine, somutlaştırılmış tüm değişkenlerin ve dönüş nesnesi'nin özellikleri olarak eklenmesine neden olan sonunda yürütülür foo().

Böyle yapabilirsin

var a, b
var foo = {
    a: a = 5,
    b: b = 6,
    c: a + b
}

Bir işlevin başlangıçta bildirildiği nesneye başvurmam gerektiğinde bu yöntemin benim için yararlı olduğu kanıtlanmıştır. Aşağıdaki nasıl kullandığımın minimal bir örneğidir:

function createMyObject() {
    var count = 0, self
    return {
        a: self = {
            log: function() {
                console.log(count++)
                return self
            }
        }
    }
}

Kendini yazdırma işlevini içeren nesne olarak tanımlayarak, işlevin bu nesneye başvurmasına izin verirsiniz. Bu, başka bir yere geçirmeniz gerekiyorsa yazdırma işlevini bir nesneye 'bağlamanız' gerekmeyeceği anlamına gelir.

Bunun yerine, thisaşağıda gösterildiği gibi kullanın

function createMyObject() {
    var count = 0
    return {
        a: {
            log: function() {
                console.log(count++)
                return this
            }
        }
    }
}

Ardından aşağıdaki kod 0, 1, 2'yi kaydeder ve bir hata verir

var o = createMyObject()
var log = o.a.log
o.a.log().log() // this refers to the o.a object so the chaining works
log().log() // this refers to the window object so the chaining fails!

Self yöntemini kullanarak, işlevin hangi bağlamda çalıştırıldığına bakılmaksızın, baskının her zaman aynı nesneyi döndüreceğini garanti edersiniz. Yukarıdaki kod iyi çalışır ve kendi sürümünü kullanırken 0, 1, 2 ve 3 günlüğünü işler createMyObject().

Tamamlama için, ES6'da sınıflarımız var (bunu yalnızca en yeni tarayıcılar tarafından yazılırken desteklenir, ancak Babel, TypeScript ve diğer transpillerde kullanılabilir)

class Foo {
  constructor(){
    this.a = 5;
    this.b = 6;
    this.c = this.a + this.b;
  }  
}

const foo = new Foo();

Modül desenini kullanarak yapabilirsiniz. Tıpkı:

var foo = function() {
  var that = {};

  that.a = 7;
  that.b = 6;

  that.c = function() {
    return that.a + that.b;
  }

  return that;
};
var fooObject = foo();
fooObject.c(); //13

Bu desen ile birkaç foo nesnesini ihtiyacınıza göre başlatabilirsiniz.

http://jsfiddle.net/jPNxY/1/

Bunu başarmanın birkaç yolu vardır; Ben kullanacağım budur:

function Obj() {
 this.a = 5;
 this.b = this.a + 1;
 // return this; // commented out because this happens automatically
}

var o = new Obj();
o.b; // === 6

sadece düşünce uğruna - nesnenin özelliklerini bir zaman çizelgesinin dışına yerleştirin:

var foo = {
    a: function(){return 5}(),
    b: function(){return 6}(),
    c: function(){return this.a + this.b}
}

console.log(foo.c())

yukarıda da daha iyi cevaplar var . Sorguladığınız örnek kodu bu şekilde değiştirdim.

GÜNCELLEME:

var foo = {
    get a(){return 5},
    get b(){return 6},
    get c(){return this.a + this.b}
}
// console.log(foo.c);

Nesnenizde yeni bir işlev oluşturmak ve bir kurucu çağırmak, orijinal problemden radikal bir çıkış gibi görünüyor ve gereksiz.

Nesne hazır bilgisi başlatma sırasında bir kardeş özelliğine başvuramazsınız.

var x = { a: 1, b: 2, c: a + b } // not defined 
var y = { a: 1, b: 2, c: y.a + y.b } // not defined 

Hesaplanan özellikler için en basit çözüm şu şekildedir (yığın yok, fonksiyon yok, kurucu yok):

var x = { a: 1, b: 2 };

x.c = x.a + x.b; // apply computed property

Burada yayınlanan diğer cevaplar daha iyidir, ancak burada bir alternatif var:

• Başlatma sırasında değeri ayarlar (alıcı, türetilmiş vb. Değil)
• init()Nesne hazır bilgisi dışında herhangi bir tür veya kod gerektirmez
• Bir fabrika fonksiyonu veya başka bir nesne oluşturma tamircisi değil, bir nesne değişmezidir.
• Performans etkisi olmamalıdır (başlatma hariç)

Kendi kendini yürüten anonim işlevler ve pencere saklama

var foo = {
    bar:(function(){
        window.temp = "qwert";
        return window.temp;
    })(),
    baz: window.temp
};

Sipariş garantilidir ( barönce baz).

windowElbette kirletiyor , ancak birisinin window.tempkalıcı olması gereken bir senaryo yazdığını hayal edemiyorum . Belki tempMyAppparanoyaksan.

Aynı zamanda çirkin ama bazen de faydalıdır. Bunun bir örneği, katı başlatma koşullarına sahip bir API kullandığınızda ve yeniden düzenleme gibi hissetmemenizdir, bu nedenle kapsam belirleme doğrudur.

Ve elbette kuru.

Tüm bunların anahtarı KAPSAM .

Kendi somutlaştırılmış nesne olarak tanımlamak istediğiniz özelliğin "üst" öğesini (üst nesne) kapsüllemeniz gerekir ve ardından anahtar kelimeyi kullanarak kardeş özelliklerine başvurular yapabilirsiniz this

İlk önce yapmadan başvurursanız , o zaman nesne olacak dış kapsama atıfta bulunacağını hatırlamak çok, çok önemlidir .thisthiswindow

var x = 9   //this is really window.x
var bar = {
  x: 1,
  y: 2,
  foo: new function(){
    this.a = 5, //assign value
    this.b = 6,
    this.c = this.a + this.b;  // 11
  },
  z: this.x   // 9 (not 1 as you might expect, b/c *this* refers `window` object)
};

nesneniz bir nesneyi döndüren bir işlev olarak yazılırsa VE ES6 nesne özniteliği 'yöntemleri' kullanırsanız, bu mümkündür:

const module = (state) => ({
  a: 1,
  oneThing() {
    state.b = state.b + this.a
  },
  anotherThing() {
    this.oneThing();
    state.c = state.b + this.a
  },
});

const store = {b: 10};
const root = module(store);

root.oneThing();
console.log(store);

root.anotherThing();
console.log(store);

console.log(root, Object.keys(root), root.prototype);

Alternatif olarak aşağıdaki kodu kullanın ve çalışır. Ve değişken de dizi olabilir. (@ Fausto R.)

var foo = {
  a: 5,
  b: 6,
  c: function() {
    return this.a + this.b;
  },

  d: [10,20,30],
  e: function(x) {
    this.d.push(x);
    return this.d;
  }
};
foo.c(); // 11
foo.e(40); // foo.d = [10,20,30,40]

İşte düzgün bir ES6 yolu:

var foo = (o => ({
    ...o,
    c: o.a + o.b
  }))({
    a: 5,
    b: 6
  });
  
console.log(foo);

Ben böyle bir şey yapmak için kullanın:

const constants = Object.freeze(
  (_ => ({
    ..._,
    flag_data: {
      [_.a_flag]: 'foo',
      [_.b_flag]: 'bar',
      [_.c_flag]: 'oof'
    }
  }))({
    a_flag: 5,
    b_flag: 6,
    c_flag: 7,
  })
);

console.log(constants.flag_data[constants.b_flag]);

Bu çözüm, dizi içeren iç içe nesnelerle de çalışır

      Object.prototype.assignOwnProVal
     = function (to,from){ 
            function compose(obj,string){ 
                var parts = string.split('.'); 
                var newObj = obj[parts[0]]; 
                if(parts[1]){ 
                    parts.splice(0,1);
                    var newString = parts.join('.'); 
                    return compose(newObj,newString); 
                } 
                return newObj; 
            } 
            this[to] = compose(this,from);
     } 
     var obj = { name : 'Gaurav', temp : 
                  {id : [10,20], city:
                        {street:'Brunswick'}} } 
     obj.assignOwnProVal('street','temp.city.street'); 
     obj.assignOwnProVal('myid','temp.id.1');

Tam olarak bu senaryoyu görmediğim için bir seçenek fırlatmak. Eğer varsa yok istediğiniz czaman güncellenen aveya bgüncelleme, daha sonra bir ES6 hayatını iyi çalışır.

var foo = ((a,b) => ({
    a,
    b,
    c: a + b
}))(a,b);

Benim ihtiyaçları için, ben bir döngüde kullanılan sona erecek bir dizi ile ilgili bir nesne var, bu yüzden sadece bir kez bazı ortak kurulum hesaplamak istiyorum, bu yüzden ne var:

  let processingState = ((indexOfSelectedTier) => ({
      selectedTier,
      indexOfSelectedTier,
      hasUpperTierSelection: tiers.slice(0,indexOfSelectedTier)
                             .some(t => pendingSelectedFiltersState[t.name]),
  }))(tiers.indexOf(selectedTier));

Ben bir özellik ayarlamanız indexOfSelectedTiergerektiğinden ve hasUpperTierSelectionözelliği ayarlarken bu değeri kullanmam gerektiğinden , önce bu değeri hesaplayıp IIFE'ye bir param olarak iletiyorum

Diğer yaklaşım, nesneyi özellikleri atamadan önce ilk olarak bildirmek olacaktır:

const foo = {};
foo.a = 5;
foo.b = 6;
foo.c = foo.a + foo.b;  // Does work
foo.getSum = () => foo.a + foo.b + foo.c;  // foo.getSum() === 22

Bununla, önceden atanmış değerlere erişmek için nesne değişkeni adını kullanabilirsiniz.
config.jsDosya için en iyisi .

var x = {
    a: (window.secreta = 5),
    b: (window.secretb = 6),
    c: window.secreta + window.secretb
};

Bu, @ slicedtoad'ın cevabı ile neredeyse aynıdır, ancak bir işlev kullanmaz.

Not: Bu çözüm, Typcript kullanır (gerekirse TS'nin derlediği vanilya JS'yi kullanabilirsiniz)

class asd {
    def = new class {
        ads= 'asd';
        qwe= this.ads + '123';
    };

    // this method is just to check/test this solution 
    check(){
        console.log(this.def.qwe);
    }
}

// these two lines are just to check
let instance = new asd();
instance.check();

İstediğimiz iç içe nesne değişmez arabirimini elde etmek için sınıf ifadeleri kullanıyorduk. Bu, IMHO'nun oluşturma sırasında bir nesnenin özelliklerine başvurabilmesi için en iyi şeydir.

Dikkat edilmesi gereken en önemli şey, bu çözümü kullanırken, bir nesne hazır bilgisinden aldığınız arayüzle tamamen aynıdır. Sözdizimi, bir nesne değişmezinin kendisine oldukça yakındır (işlev kullanma, vs kullanma gibi).

Aşağıdakileri karşılaştırın

Önerdiğim çözüm

class asd {
    def = new class {
        ads= 'asd';
        qwe= this.ads + '123';
    };

Nesne hazır bilgileri yeterli olsaydı çözüm

var asd = {
    def : {
        ads:'asd',
        qwe: this.ads + '123';, //ILLEGAL CODE; just to show ideal scenario
    }
}

Başka bir örnek

Burada bu sınıfta, bir nesne değişmezi ile mümkün olmayan çoklu göreli yolu kendi aralarında birleştirebilirsiniz.

class CONSTANT {
    static readonly PATH = new class {
        /** private visibility because these relative paths don't make sense for direct access, they're only useful to path class
         *
         */
        private readonly RELATIVE = new class {
            readonly AFTER_EFFECTS_TEMPLATE_BINARY_VERSION: fs.PathLike = '\\assets\\aep-template\\src\\video-template.aep';
            readonly AFTER_EFFECTS_TEMPLATE_XML_VERSION: fs.PathLike = '\\assets\\aep-template\\intermediates\\video-template.aepx';
            readonly RELATIVE_PATH_TO_AFTER_EFFECTS: fs.PathLike = '\\Adobe\\Adobe After Effects CC 2018\\Support Files\\AfterFX.exe';
            readonly OUTPUT_DIRECTORY_NAME: fs.PathLike = '\\output';
            readonly INPUT_DIRECTORY_NAME: fs.PathLike = '\\input';
            readonly ASSETS_DIRECTORY_NAME: fs.PathLike = '\\assets';
        };
    }
}

Yerel JS kullanmak istiyorsanız, diğer yanıtlar iyi çözümler sunar.

Ancak aşağıdaki gibi kendinden referanslı nesneler yazmaya istekli iseniz:

{ 
  a: ...,
  b: "${this.a + this.a}",
}

Ben sözdizimini destekleyen ve yerel bir nesne döndüren self-reference-object adlı bir npm kütüphanesi yazdım .