How do I get a certain object key via a function?

Question

I'm trying to create error messages for form validation in multiple languages. Unfortunately, the transfer of the "target" parameter to my function does not work. Maybe target is interpreted as a string?!

function formMessages(field, target) {
  var messages = {
    'de' : {
      'valueMissing': 'Bitte füllen Sie dieses Feld aus.',
      'typeMismatch': {
        'email': 'Bitte geben Sie eine E-Mail ein.',
        'url': 'Bitte geben Sie eine URL ein.'
      }
    }
  };

  // Don't work!
  // return messages.de.target;

  // This works! But it is not dynamic!
  // return messages.de.typeMismatch.email;
}

if (validity.typeMismatch) {
  // Email
  if (field.type === 'email') return formMessages(field, 'typeMismatch.email');
}

Try to console.log(messages["de"]["valueMissing"]); in order to see if you actually go to the message. — ZombieChowder
– ZombieChowder, Commented Apr 6, 2018 at 8:32
That's because you are passing string as argument and are using dot notation, instead use [ ] notation and pass 'typeMismatch' , 'email' as two separate arguments or spilt() 'typeMismatch.email' into two — Vishal-L
– Vishal-L, Commented Apr 6, 2018 at 8:37

Jaydip Jadhav · Accepted Answer · 2018-04-06 08:32:43Z

2

Use eval Method

return eval('messages.de.'+target);

answered Apr 6, 2018 at 8:32

Jaydip Jadhav

12.3k6 gold badges26 silver badges41 bronze badges

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

Comments

xianshenglu · Accepted Answer · 2018-04-06 08:40:33Z

1

try this:

function formMessages(field, target) {
  var messages = {
    de: {
      valueMissing: "Bitte füllen Sie dieses Feld aus.",
      typeMismatch: {
        email: "Bitte geben Sie eine E-Mail ein.",
        url: "Bitte geben Sie eine URL ein."
      }
    }
  };

  return target.split(".").reduce((re, v) => re[v], messages.de);

  // This works! But it is not dynamic!
  // return messages.de.typeMismatch.email;
}

if (validity.typeMismatch) {
  // Email
  if (field.type === "email") return formMessages(field, "typeMismatch.email");
}

messages.de.targetequalsmessages['de']['target'],so target works as string.

If you want target works as variable,it should be messages.de[target].

However,in your case,target is typeMismatch.email,so you have to use reduce to accumulate.

edited Apr 6, 2018 at 8:40

answered Apr 6, 2018 at 8:33

xianshenglu

5,4483 gold badges21 silver badges39 bronze badges

Comments

gurvinder372 · Accepted Answer · 2018-04-06 08:34:20Z

0

Use bracket notation to access the dynamic property

function formMessages(field) 
{
  var messages = {
    'de' : {
      'valueMissing': 'Bitte füllen Sie dieses Feld aus.',
      'typeMismatch': {
        'email': 'Bitte geben Sie eine E-Mail ein.',
        'url': 'Bitte geben Sie eine URL ein.'
      }
    }
  };

  return messages.de.typeMismatch[ field.type ]; //pass the field.type itself
}

if (validity.typeMismatch) 
{
  if ( field.type === 'email') return formMessages(field); //pass the field itself
}

answered Apr 6, 2018 at 8:34

gurvinder372

68.6k11 gold badges78 silver badges98 bronze badges

Comments

Vishal-L · Accepted Answer · 2018-04-06 08:41:24Z

0

If you are passing strings as arguments then use [ ] notation and pass 'typeMismatch' , 'email' as two separate arguments.

function formMessages(field, target1, target2) {
  var messages = {
    'de' : {
      'valueMissing': 'Bitte füllen Sie dieses Feld aus.',
      'typeMismatch': {
        'email': 'Bitte geben Sie eine E-Mail ein.',
        'url': 'Bitte geben Sie eine URL ein.'
      }
    }
  };

  return messages.de[target1][target2];

}

if (validity.typeMismatch) {
  // Email
  if (field.type === 'email') return formMessages(field, 'typeMismatch', 'email');
}

answered Apr 6, 2018 at 8:41

Vishal-L

1,3471 gold badge10 silver badges16 bronze badges

Collectives™ on Stack Overflow

How do I get a certain object key via a function?

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related