Autorreferencias en literales / inicializadores de objeto

¿Hay alguna manera de hacer que algo como lo siguiente funcione en JavaScript?

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

En la forma actual, este código obviamente arroja un error de referencia, ya thisque no hace referencia foo. Pero, ¿ hay alguna forma de tener valores en las propiedades de un objeto literal que dependen de otras propiedades declaradas anteriormente?

Bueno, lo único que te puedo decir es getter :

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

console.log(foo.c) // 11

Esta es una extensión sintáctica introducida por la especificación ECMAScript 5th Edition, la sintaxis es compatible con la mayoría de los navegadores modernos (incluido IE9).

Podrías hacer algo como:

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

Esto sería una especie de inicialización única del objeto.

Tenga en cuenta que en realidad está asignando el valor de retorno de init()a foo, por lo tanto, debe hacerlo return this.

Falta la respuesta simple y obvia, así que para completar:

Pero, ¿ hay alguna forma de que los valores en las propiedades de un objeto literal dependan de otras propiedades declaradas anteriormente?

No. Todas las soluciones aquí difieren hasta que se crea el objeto (de varias maneras) y luego asignan la tercera propiedad. La forma más simple es simplemente hacer esto:

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

Todos los demás son formas más indirectas de hacer lo mismo. (Felix's es particularmente inteligente, pero requiere crear y destruir una función temporal, agregar complejidad; y deja una propiedad adicional en el objeto o [si tiene deleteesa propiedad] afecta el rendimiento de los accesos de propiedad posteriores en ese objeto).

Si necesita que todo esté dentro de una expresión, puede hacerlo sin la propiedad temporal:

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

O, por supuesto, si necesita hacer esto más de una vez:

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

entonces donde necesitas usarlo:

var foo = buildFoo(5, 6);

Simplemente instancia una función anónima:

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

Ahora en ES6 puede crear propiedades en caché perezosas. En el primer uso, la propiedad se evalúa una vez para convertirse en una propiedad estática normal. Resultado: la segunda vez que se omite la sobrecarga de la función matemática.

La magia está en el captador.

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

En la flecha, el captador thisrecoge el alcance léxico circundante .

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

Algún cierre debería ocuparse de esto;

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

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

Todas las variables declaradas fooson privadas foo, como cabría esperar con cualquier declaración de función y, dado que están todas dentro del alcance, todas tienen acceso entre sí sin necesidad de hacer referencia this, tal como cabría esperar con una función. La diferencia es que esta función devuelve un objeto que expone las variables privadas y asigna ese objeto foo. Al final, devuelve solo la interfaz que desea exponer como un objeto con la return {}instrucción.

La función se ejecuta al final con lo ()que hace que se evalúe todo el objeto foo, todas las variables dentro de las instancias y el objeto de retorno agregado como propiedades de foo().

Podrías hacerlo así

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

Ese método me ha resultado útil cuando tuve que referirme al objeto en el que se declaró originalmente una función. El siguiente es un ejemplo mínimo de cómo lo usé:

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

Al definir self como el objeto que contiene la función de impresión, permite que la función haga referencia a ese objeto. Esto significa que no tendrá que 'vincular' la función de impresión a un objeto si necesita pasarla a otro lugar.

Si, en cambio, lo usa thiscomo se ilustra a continuación

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

Luego, el siguiente código registrará 0, 1, 2 y luego dará un error

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!

Al utilizar el método self, garantiza que print siempre devolverá el mismo objeto, independientemente del contexto en el que se ejecute la función. El código anterior se ejecutará bien y registrará 0, 1, 2 y 3 cuando use la versión propia de createMyObject().

Para completar, en ES6 tenemos clases (admitidas en el momento de escribir esto solo por los navegadores más recientes, pero disponibles en Babel, TypeScript y otros transpiladores)

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

const foo = new Foo();

Puede hacerlo utilizando el patrón del módulo. Al igual que:

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

Con este patrón, puede crear instancias de varios objetos foo según sus necesidades.

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

Hay varias maneras de lograr esto; esto es lo que usaría:

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

solo por el pensamiento: coloque las propiedades del objeto fuera de una línea de tiempo:

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

console.log(foo.c())

Hay mejores respuestas arriba también . Así es como modifiqué el código de ejemplo con el que cuestionaste.

ACTUALIZAR:

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

Crear una nueva función en su objeto literal e invocar a un constructor parece una desviación radical del problema original, y es innecesario.

No puede hacer referencia a una propiedad hermana durante la inicialización literal del objeto.

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

La solución más simple para propiedades calculadas sigue (sin montón, sin funciones, sin constructor):

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

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

Las otras respuestas publicadas aquí son mejores, pero aquí hay una alternativa que:

• Establece el valor en la inicialización (no un captador, derivado, etc.)
• No requiere ningún tipo init()o código fuera del objeto literal
• Es un objeto literal y no una función de fábrica u otra mecánica de creación de objetos.
• No debería tener ningún impacto en el rendimiento (excepto en la inicialización)

Funciones anónimas de ejecución automática y almacenamiento de ventanas

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

El pedido está garantizado ( barantes baz).

Contamina, windowpor supuesto, pero no puedo imaginar a alguien escribiendo un guión que requiera window.tempser persistente. Quizás tempMyAppsi eres paranoico.

También es feo pero ocasionalmente útil. Un ejemplo es cuando está utilizando una API con condiciones de inicialización rígidas y no tiene ganas de refactorizar, por lo que el alcance es correcto.

Y está seco, por supuesto.

La clave de todo esto es ALCANCE .

Debe encapsular el "padre" (objeto padre) de la propiedad que desea definir como su propio objeto instanciado, y luego puede hacer referencias a las propiedades de los hermanos utilizando la palabra clave this

Es muy, muy importante recordar que si te refieres thissin hacerlo primero, thisse referirá al alcance externo ... que será el windowobjeto.

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)
};

si su objeto está escrito como una función que devuelve un objeto, Y usted usa 'métodos' de atributos de objeto ES6, entonces es posible:

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);

Yo uso el siguiente código como alternativa, y funciona. Y la variable también puede ser matriz. (@ 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]

Aquí hay una forma ordenada de ES6:

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

Lo uso para hacer algo como esto:

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]);

¿Qué tal esta solución? Esto también funcionará con objetos anidados con matriz

      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');

Lanzar una opción ya que no vi este escenario exacto cubierto. Si no desea cactualizar cuándo ao bactualizar, entonces un ES6 IIFE funciona bien.

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

Para mis necesidades, tengo un objeto que se relaciona con una matriz que terminará siendo utilizada en un bucle, por lo que solo quiero calcular una configuración común una vez, así que esto es lo que tengo:

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

Como necesito establecer una propiedad para indexOfSelectedTiery necesito usar ese valor al establecer la hasUpperTierSelectionpropiedad, calculo primero ese valor y lo paso como parámetro al IIFE

Otro enfoque sería declarar el objeto primero antes de asignarle propiedades:

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

Con eso, puede usar el nombre de la variable del objeto para acceder a los valores ya asignados.
Lo mejor para el config.jsarchivo.

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

Esto es casi idéntico a la respuesta de @ slicedtoad, pero no utiliza una función.

Nota: Esta solución usa el Script mecanografiado (puede usar el JS de Vanilla que TS compila si es necesario)

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();

Aquí usamos expresiones de clase para obtener la interfaz literal del objeto anidado que desearíamos. Esto es lo mejor en mi humilde opinión para poder hacer referencia a las propiedades de un objeto durante la creación.

Lo principal a tener en cuenta es que al usar esta solución, tiene exactamente la misma interfaz que habría tenido de un objeto literal. Y la sintaxis está bastante cerca de un objeto literal en sí mismo (en comparación con el uso de una función, etc.).

Compara lo siguiente

Solución que he propuesto

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

Solución si los literales de objetos hubieran sido suficientes

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

Otro ejemplo

Aquí en esta clase, puede combinar múltiples rutas relativas entre sí, lo que no es posible con un objeto literal.

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';
        };
    }
}

Si desea utilizar JS nativo, las otras respuestas proporcionan buenas soluciones.

Pero si está dispuesto a escribir objetos de autorreferencia como:

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

Escribí una biblioteca npm llamada self-referenced-object que admite esa sintaxis y devuelve un objeto nativo.