对象属性名称中的变量

Question

I want to set object like this:

var x = 20;
var y = 30;
var z = {
         values: { 
                  x: '24',
                  y: '60'  }, 
         value: x
         };

I would like the variable z to look:

var z = {
         values: { 
                  20: '24',
                  30: '60'  }, 
         value: 20
         };

Answer 1

Put them in square bracket. This is commonly known as computed property names which allows a variable to put in square bracket which will be computed

 var x = 20; var y = 30; var z = { values: { [x]: '24', [y]: '60' }, value: x }; console.log(z) 

Answer 2

Square bracket solution posted by brk is good, but only under browsers different than Internet Explorer. Under IE11 you need to do something like this:

var x = 20;
var y = 30;
var z = {
         values: { }, 
         value: x
        };

z['values'][String(x)] = '24';
z['values'][String(y)] = '60';

console.log(z);