Passing parent object dynamically to function as argument in javascript

Question

This is my first question in the forum. I've searched a lot before asking you guys, but maybe because I'm still building my JavaScript skills, I couldn't figure it out.

I'm trying to pass a object as an argument dynamically, according to the URL like shown below.

 let createDataLayer = () => {

  //Creating objects with the values for each page
  someurl = {
    pageType: 'Content',
    institution: 'Institution',
    contentTopic: 'Membership',
    productCategory: '',
    productName: '',
  };

  //Attaching the right array to the actual url
  let actualURL = "/some-url/";
  actualURL = actualURL.replace(/-/g,"");
  actualURL = actualURL.replace(/\//g,"");

  //Function that applies the right content to the right page
  let applyingContent = (variable) => {
    console.log("Always come as string: ", typeof variable); //string
    console.log("Can't access the object: ", variable.pageType); //undefined
    console.log("If I call the variable itself, it's here: ", someurl); //the object logs ok
    window.dataLayerValues = [variable.pageType, variable.institution, variable.contentTopic, variable.productCategory, variable.productName];
    return window.dataLayerValues;
  }

  applyingContent(actualURL);

}
createDataLayer();

Can anyone help me, please?

I appreciate it so much!

But, you're passing actualURL which is a string. What do expect? — Ele
– Ele, Commented Oct 27, 2018 at 14:50
Hi Ele, thank you for your answer. How can I get that string and pass it as the object name so I call the object, not the string inside the applyingContent function? — Mike Dougllas
– Mike Dougllas, Commented Oct 27, 2018 at 15:05

Mark · Accepted Answer · 2018-10-27 15:15:14Z

Accessing variables via strings held in other variables is not something that is typically done in javascript. Your code generally shouldn't care what a variable is named. If you need to organize data so you can access it with a string key, you should be using an object with keys that correspond to the strings. That would look something like this:

const urls = {
    someurl: {
        pageType: 'Content',
        institution: 'Institution',
        contentTopic: 'Membership',
        productCategory: '',
        productName: '',
    }
}

You then access the data with urls[key] where key is your string.

Then you can use it with only a few changes to your code:

let createDataLayer = () => {

    //Creating objects with the values for each page
    const urls = {
        someurl: {
            pageType: 'Content',
            institution: 'Institution',
            contentTopic: 'Membership',
            productCategory: '',
            productName: '',
            }
        }
  
    //Attaching the right array to the actual url
    let actualURL = "/some-url/";
    actualURL = actualURL.replace(/-/g,"");
    actualURL = actualURL.replace(/\//g,"");
  
    //Function that applies the right content to the right page
    let applyingContent = (variable) => {
      console.log("Strill a string: ", typeof variable); //string
      // object accessed with key: urls[variable]
      console.log("Can access the object: ", urls[variable].pageType); //undefined
      return  urls[variable];
    }
  
    applyingContent(actualURL);
  
  }
  createDataLayer();

This will keep all your data neatly packaged in one object rather than having individual variables all over the place. You can pass that object around, alter it, etc.

tas-man · Accepted Answer · 2018-10-27 15:03:37Z

0

It seems you are assigning some-url as a string of value "/some-url/" into actualURL which is then passed to applyingContent(). You will need to pass somebody as an object to the applyingContent() function in order to use its internal values.

edited Oct 27, 2018 at 15:03

answered Oct 27, 2018 at 14:58

tas-man

131 silver badge7 bronze badges

Comments

Mike Dougllas · Accepted Answer · 2018-10-27 15:20:54Z

Thank you, Ele! You gave me the directions I needed! So I just asked google "Convert String in Variable Name JavaScript". The answer is I needed to use the eval() function to my string before passing it into the argument. Here is the easiest way to do what I need:

let createDataLayer = () => {

  //Creating objects with the values for each page
  someurl = {
    pageType: 'Content',
    institution: 'Institution',
    contentTopic: 'Membership',
    productCategory: '',
    productName: '',
  };

  //Attaching the right array to the actual url
  let actualURL = "/some-url/";
  actualURL = actualURL.replace(/-/g,"");
  actualURL = actualURL.replace(/\//g,"");

  actualURL = eval(actualURL);//This is the line I needed =)

  //Function that applies the right content to the right page
  let applyingContent = (variable) => {
    console.log("Always come as string: ", variable.pageType); //string
    console.log("Can't access the object: ", variable.pageType); //undefined
    console.log("If I call the variable itself, it's here: ", someurl); //the object logs ok
    window.dataLayerValues = [variable.pageType, variable.institution, variable.contentTopic, variable.productCategory, variable.productName];
    return window.dataLayerValues;
  }

  applyingContent(actualURL);

}
createDataLayer();

Thank you so much for pointing me in the right way, @Ele. Thank you all!

Collectives™ on Stack Overflow

Passing parent object dynamically to function as argument in javascript

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