Why can't function access local variable in object declared outside

Question

I was adding validation functions for my Node application, and want a custom message for the field I provide in that function. The issue is, some options need to have a default values, and others I can pass as parameters.

let field = 'email';

let options = {
  'message': `${field} is required`
}

function validation(field, opt = options) {
  console.log(opt.message);
}

validation('password');
validation('confirm', {message: 'Confirm password is required'})

But in this case, the output is

"email is required"
"Confirm password is required"

While I want the output to be

"password is required"
"Confirm password is required"

I also want to know how Javascript works for this code. How it is accessing all the stuff and how to get the required output.

Thanks

Have you tried debugging your code? (Because from the code snippet you provided I strongly presume you didn't) — Samuel Hulla
– Samuel Hulla, Commented Aug 5, 2018 at 17:26
Perhaps to be a bit more specific about my "angry" comment up there, I'm asking because you are assigning inside a function declaration, due to which most linters will throw a warning for! — Samuel Hulla
– Samuel Hulla, Commented Aug 5, 2018 at 17:28
@rawrplus that is a default parameter. Learn JS yourself before you try to teach others. — Jonas Wilms
– Jonas Wilms, Commented Aug 5, 2018 at 17:30

dhilt · Accepted Answer · 2018-08-05 17:29:49Z

3

In your code you just create option object and you create it with message field = "email is required". And you never change it's value. As an alternative you may generate object each time you want it to be parametrized:

const field = 'email';

const getOptions = (field) => ({
  'message': `${field} is required`
});

function validation(field, opt) {
  opt = opt || getOptions(field);
  console.log(opt.message);
}

edited Aug 5, 2018 at 17:29

answered Aug 5, 2018 at 17:27

dhilt

21.1k8 gold badges79 silver badges96 bronze badges

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

Comments

Code-Apprentice · Accepted Answer · 2018-08-05 17:26:53Z

let field = 'email';

let options = {
  'message': `${field} is required`
}

This assigns options.message with the current value of field. Since you never changes its value, you get "email is required". The parameter named field in function validation(field, opt = options) is a different variable than the global one with the same name. And its value has no affect on the value of options.message because that assignment was already executed before the function was ever called.

Manipulating global objects is considered poor programming. Instead, you can create the object inside the function:

function validation(field) {
    let opt = {
      'message': `${field} is required`
    }

      console.log(opt.message);
}

Jonas Wilms · Accepted Answer · 2018-08-05 17:28:14Z

1

   message:`${field} is required`

Is the same as:

 message: field + " is required"

which directly looks up field and results in:

 message: "email is required"

To evaluate later you have to use a function that you pass the field name in which then returns the message:

 const options = {
   message: field => `${field} is required`,
 }

 function validation(field, opt = options) {
   const msg = typeof opt.message === "function" ? opt.message(field) : opt.message;
   console.log(msg);
 }

 validation('password');
 validation('confirm', {message: 'Confirm password is required'})

answered Aug 5, 2018 at 17:28

Jonas Wilms

139k20 gold badges164 silver badges164 bronze badges

Collectives™ on Stack Overflow

Why can't function access local variable in object declared outside

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related