0

Imaging we have a props, a really large object:

{
 "firstname": "John", 
 "lastname": "Doe",
 "age": 11,
 "mode: "expert",
 "website": "stackoverflow.com"
 "protocol": "https",
 "job": "dev",
 "env": "main",
 ..... and a lot of key-values pairs coming
}

What usually we are calling to create "component variables":

let {firstname, 
     lastname, 
     age, 
     mode,
     website,
     protocol,
     job,
     env
     ...and a lot of "keys" as variable names} = props
// so we can call variable, {age} for example

I don't like to type all these variables in let {}, do we have something dynamic to declare "all keys" dynamically? I am not sure it's possible.

Of course I can use {props.firstname} in my code.

There is a way to create dynamically variables in let {} scope?

Any help is appreciated.

illia chill
  • 1,652
  • 7
  • 11
  • What is `verySmartFunc` supposed to be? – kelsny Nov 14 '22 at 14:45
  • There is nothing that is going to create all the variables dynamically like that. What you want to do is not a great pattern since you need to define your variables. What is the actual problem you are trying to solve? – epascarello Nov 14 '22 at 14:56
  • 1
    You can't create dynamic variables the way you want: you need to be explicit what property you want to destructure/unpack from your object, and then you can spread the rest, e.g. `const { firstname, age, ...rest } = props`. It feels like an XY problem that you want to dynamically unpack an object. If you need dynamic access to an object just use the bracket notation, e.g. `props[DYNAMIC_KEY]` – Terry Nov 14 '22 at 16:30
  • https://stackoverflow.com/q/5117127/19529102 - If you really wanted, you could dynamically create variables on a global scale. But as other commenters already said: There really isn't a need to dynamically create variables. (at least I haven't encountered one yet) --- why even unpack the object?, why not just use it as is / unpack the parts you need – Lord-JulianXLII Nov 14 '22 at 20:48
  • Most probably it's impossible to do. – illia chill Nov 15 '22 at 08:54

2 Answers2

0

You can get all keys dynamically by Object.keys

const obj = {
 "firstname": "John", 
 "lastname": "Doe",
 "age": 11,
 "mode": "expert",
} 

const keys = Object.keys(obj)

console.log(keys)

//from these keys, you can get values based on your needs
//the first key value is `firstname`
//the first value is `John`
console.log(keys[0], obj[keys[0]])
Nick Vu
  • 14,512
  • 4
  • 21
  • 31
0

Do you want to use (destructure) some props, and leave the rest in another object? You can do that with i.e.

let testobject = {
 "firstname": "John", 
 "lastname": "Doe",
 "age": 11,
 "mode": "expert"
}

const {firstname, lastname, ...verySmartFunc} = testobject ;

console.log(verySmartFunc);
//now your object is verySmartFunc, 
//created with those keys you haven't destructured, and has next properties
{
  age: 11,
  mode: "expert"
}

If that's not what you're looking for and I misunderstood your question, I'd say you're already having props as an object with all those keys.

EDIT: Maybe this is what you're looking for, based on Nick Vu's answer.

const obj = {
 "firstname": "John", 
 "lastname": "Doe",
 "age": 11,
 "mode": "expert",
} 

const keys = Object.keys(obj)
let i = 0;
for (var key in keys) {
    window[keys[i]] = obj[keys[i]];
  i++
}


console.log(firstname); //result is "John"
Vedran
  • 143
  • 7