String interpolation in AJAX call data parameter

Question

I have a locale variable that can be en, fr, or es. I have to send an AJAX request, with the locale as the key of the data parameter.

let locale = "en";
let name = "example";
$.ajax({
  url: "/path",
  method: "PUT",
  data: {characteristic: {`${locale}`: name}},
  success: function(){},
  error: function(){}
})

I tried to use ES6's string interpolation, but it raises a syntax error. How can I do this ?

I'd like to get, depending on the locale:

{en: "example"}
{fr: "example"}
{es: "example"}

I also tried string concatenation, didn't seem to work either. I'm open to any solution though — Graham Slick
– Graham Slick, Commented Jul 10, 2017 at 8:04

Aron · Accepted Answer · 2017-07-10 08:12:51Z

3

For this you can use computed property names:

{ [locale]: name } 

// if local is "en" the above will equal { "en": name }

In general, to use a computed property name you put the value to be computed in square brackets, like so:

{ [1 + 2]: 'three' } // is equal to { '3': 'three' }

edited Jul 10, 2017 at 8:12

answered Jul 10, 2017 at 8:04

Aron

9,3187 gold badges37 silver badges60 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Graham Slick Over a year ago

Interesting, didn't know about computed properties. Thanks for the additional example.

Ikbel · Accepted Answer · 2017-07-10 08:14:48Z

1

This works:

[`${locale}`]: name

answered Jul 10, 2017 at 8:14

Ikbel

7,8513 gold badges36 silver badges46 bronze badges

Comments

31piy · Accepted Answer · 2017-07-10 08:08:46Z

0

Referencing from here, you need an array-like brackets to define dynamic property names:

{
  characteristic: {
    [locale]: name
  }
}

edited Jul 10, 2017 at 8:08

answered Jul 10, 2017 at 8:04

31piy

23.9k6 gold badges51 silver badges69 bronze badges

Collectives™ on Stack Overflow

String interpolation in AJAX call data parameter

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related