How to access an object by a variable?

Question

I have two selects sent to the event change the value of data-id and attribute to variable tipo.

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

Using tipoUm[1] me returns the value 1.10 normal. But if I use the variable tipo to access the object in this way tipo[1], I cannot access the object, but I return the second string of the variable tipo, i.e., the i (of tipoUm or tipoDois).

How do I get the key value 1:, for example, the objects according to the variable value tipo at 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>
<select class="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>

Answer 1

You can try using window[variavel]. 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>
<select class="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 believe that another solution would be to use eval

Answer 2

I personally suggest another approach to the problem. If it is you who controls the objects then you can encode them differently in order to make the code more useful, like this:

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

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

opcoes[tipo][1]

Take 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>
<select class="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>