How to use the value of a variable to define an object key?

Question

I wanted to return a Mongodb JSON with some filters, the problem is, when I try to pass a variable through the function, it doesn’t work, this is the code:

async find(req, res) {
    const { filter, input } = req.body;
    console.log(filter);
    console.log(input);
    const clients = await Client.find({ filter : { '$regex' : input, '$options' : 'i' } });
    console.log(clients);
    return res.json(clients);
},

The console logs stay:

name
testinput
[]

If I change:

const clients = await Client.find({ filter : { '$regex' : input, '$options' : 'i' } });

for:

const clients = await Client.find({ 'name' : { '$regex' : input, '$options' : 'i' } });

It works, but why can’t I pass a variable? I need to search with several different filters

Answer 1

In Javascript itself, an object can be created in two ways:

// Forma 1
let obj1 = { name: "Fulano", age: 37 };

// Forma 2
let obj2 = { "name": "Fulano", "age": 37 };

That is, the key can be set with quotation marks, or without quotation marks.

In view of this, when you pass as argument the object:

{ filter : { '$regex' : input, '$options' : 'i' } }

You’re passing an object that has the key filter, yeah, that kind of key definition is accepted. However, as the input is being passed as a value, and not as a key, Javascript considers that you are using a variable.

Therefore, a way for you to use the value of a variable as the key of an object would be to use JSON.parse to convert a string in an object, like this:

let jsonObject = JSON.parse(`{ "${filter}" : { "$regex" : "${input}", "$options" : "i" } }`);

const clients = await Client.find(jsonObject);

Another way (even simpler) - and already this based on the definitions of ES6 - would be to use the definition of a key through the value returned by an expression, thus:

const clients = await Client.find({
    [filter]: {
        "$regex": input,
        "$options": "i"
    }
});

That is, there in [filter], a key with the variable value will be defined filter.

And when you say "expression", can even think of concatenation expressions of strings, for example:

{
    [filter]: {
        ['$' + 'regex']: input,
        "$options": "i"
    }
}

That is, the resulting key of ['$' + 'regex'] will be "$regex".

This form can become more interesting, as it ends up leaving the code, in a certain way, more "clean", and does not require it to use an additional functionality that is now shown "unnecessary".

However, note that to use this feature on the side of front-end, it may become necessary to implement some tools, such as Babel, for compatibility with older browsers (i.e., browsers that do not "support" ES6).

I hope I’ve helped!