How to access an object by a variable?

3

I have two select s that sends to event change the value of data-id and assignment to variable tipo .

I have two objects each with values in the keys 1: and 2: .

Using tipoUm[1] returns me the value 1.10 normal. But if I use the tipo variable to access the object, this way tipo[1] , I can not access the object, but I am returned the second string of the tipo variable, ie i tipoUm or tipoDois ).

How can I get the value of the 1: key, for example, from the objects according to the value of the tipo variable in the event?

var tipoUm = {
   1: 1.10,
   2: 2.50,
};

var tipoDois = {
   1: 2.20,
   2: 4.70,
};

$(".tipo").on('change', function(){

   var tipo = $(this).data("id");
   console.log(tipo);
   
   // a variável "tipo" pode ser: tipoUm ou tipoDois
   // pegar o valor da chave "1" do objeto de acordo com a
   // variável "tipo"

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><selectclass="tipo" data-id="tipoUm">
  <option value="">Selecione</option>
  <option value="1">Opção 1</option>
</select>

<select class="tipo" data-id="tipoDois">
  <option value="">Selecione</option>
  <option value="1">Opção 1</option>
</select>
    
asked by anonymous 12.06.2018 / 23:05

2 answers

5

You can try to use window[variavel] . It would look like this

var tipoUm = {
   1: 1.10,
   2: 2.50,
};

var tipoDois = {
   1: 2.20,
   2: 4.70,
};

$(".tipo").on('change', function(){

   var tipo = $(this).data("id");
   console.log(window[tipo][1]);
   
   // Acessa a propriedade "tipo" do objeto window. pode ser: tipoUm ou tipoDois
   // pegar o valor da chave "1" do objeto de acordo com a
   // variável "tipo"

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><selectclass="tipo" data-id="tipoUm">
  <option value="">Selecione</option>
  <option value="1">Opção 1</option>
</select>

<select class="tipo" data-id="tipoDois">
  <option value="">Selecione</option>
  <option value="1">Opção 1</option>
</select>

Remember that this only works for global variables, as in the case of the example you put. I think another solution would be to use eval

    
12.06.2018 / 23:16
3

Personally I suggest another approach to the problem. If you control the objects then you can code them differently in order to make the code look better, like this:

var opcoes = {
  tipoUm : {
     1: 1.10,
     2: 2.50,
  },
  tipoDois : {
     1: 2.20,
     2: 4.70,
  }
}

So it combines all the options into a single object, and can now use the type as a key of this object, being very simple to use:

opcoes[tipo][1]

See the example:

var opcoes = {
  tipoUm : {
     1: 1.10,
     2: 2.50,
  },
  tipoDois : {
     1: 2.20,
     2: 4.70,
  }
}
$(".tipo").on('change', function(){

   var tipo = $(this).data("id");
   console.log(opcoes[tipo][1]);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><selectclass="tipo" data-id="tipoUm">
  <option value="">Selecione</option>
  <option value="1">Opção 1</option>
</select>

<select class="tipo" data-id="tipoDois">
  <option value="">Selecione</option>
  <option value="1">Opção 1</option>
</select>
    
12.06.2018 / 23:40