How to generate incremented variables with Javascript?

Question

I would like to know how to generate incremental variables, for example:

var camada = 0
for (i=0; i=20;i++){
    var "camada" + i + 1 = 12
}

I know the code is not correct, but I wrote to better illustrate what I would like to do, you have to automatically generate the variables camada1, camada2, camada3,.. camada20.

Answer 1

That maybe it is not possible, if it is, not worth the effort, the use of a array should be more practical.

var camadas = {};
for (var i = 0; i <= 20; ++i) {
    camadas["camada" + i] = 'Hello World ' + i;
}

To recover a value, just specify the key camadaN, where N is the number in a range between 0 and 20:

alert(camadas.camada5); // Hello World 5
//alert(camadas["camada5"]); // Sintaxe alternativa

To change the value of a key, do:

camadas.camada5 = "foo";
camadas.camada6 = "bar";
// Sintaxe alternativa
//camadas["camada5"] = "foo"; 
//camadas["camada6"] = "bar";

Exemplo

Updating

As per this comment:

I’m creating a web page, to caucular the tensions in the ground, each soil layer has Height and Heaviness Specific. I created a input that the person type the amount of layers. If user type 5 per example, 10 inputs will be generated, 5 for height and 5 for weight Specific... So for each layer I have to generate the variables to make the calculations.... That’s why I need to generate the variables of each layer...I created them as objects, in this case a new layer I I would only instantiate her, but I still have the same problem.

Use a array of arrays. Assuming it is necessary that each layer has specific height and weight, just do the following:

var camadas = {};
for (var i = 0; i <= 20; ++i) {
    camadas["camada" + i] = { 'altura': 'altura' + i,
                              'peso': 'peso' + i};
}

To regain the weight and height of a layer, simply specify the camadaN and the keys in case, altura and peso. Take an example:

alert(camadas.camada1.altura); // Valor da altura da camada1
alert(camadas.camada20.peso);  // Valor do peso da camada20

Exemplo

Answer 2

Some ways follow below.

1) A global scope variable:

window['nomeDaVariavel'] = 1;
console.log(window.nomeDaVariavel); // Irá exibir o valor '1' no Console.

2) Compilation via Eval:

eval("var variavel = 1");
console.log(variavel); // Irá exibir o valor '1' no Console.

However my suggestion would be to use arrays (variavel[1], variavel[2], etc.) rather than dynamically declared variables. This makes collection manipulation much easier.

The snippet below, in Angularjs, demonstrates this technique: The property $scope.camadas is initialized as a array (via $scope.camadas = []). Note after this the use of push (to add a new member), splice (to remove a member) and forEach (which allows iteration on all members of the array):

$myApp = angular.module('myApp',[]);

camadasCtrl = function($scope) {
  
  $scope.camadas = [];
  //        ^ inicializando o array
  $scope.peso = 0;

  $scope.addCamada = function() {
    $scope.camadas.push( {peso: $scope.peso } );
    //               ^ Adiciona um membro ao array
    
    calcTotal();

    
    $scope.peso = parseInt(Math.random() * 1000000) / 100;
  }
  $scope.delCamada = function(index) {
    $scope.camadas.splice(index, 1);
    //               ^ Remove um membro do array
    
    calcTotal();
  }
  
  var calcTotal = function() {
    
    var total = 0;
    
    $scope.camadas.forEach(function(item) {
    //                ^ Para cada membro do arry, o código a seguir é executado
        total += item.peso;
    });
    
    $scope.pesoTotal = total;
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

    <div ng-app='myApp'>

      <div ng-controller='camadasCtrl'>
        Peso: <input type='text' ng-model='peso'> <button ng-click='addCamada()'> Adicionar Camada {{ camadas.length }} </button>

        <div ng-repeat='camada in camadas'>
          <button ng-click='delCamada($index)'> Remover</button> Camada {{$index}} : {{ camada.peso }} Kg           
        </div>
        
        Peso Total: {{ pesoTotal }}
        
        
      </div>
    </div>

The result is as follows: