Accessing if else variables from inside another function

JavaScript
1

Hi all

Trying to build a basic if else function which will hold a selection of variables depending on what type it is.

The below snippet will eventually hold about 7 or 8 different variables for each type, so I can access them in different functions and click events.

I was wondering if I should return an object or array, which is best?
And is the below correct - remove for improvement?

var whatQueryType = function (type) {
  if (type === "a") 
  {
    var title = "A Tilte"
    var copy = "A description"
    var url = "www.example.com/page-a"

    return { title: title, copy: copy }
  } 
  else if (type === "b") 
  {
    var title = "B Title"
    var copy = "B description"
    var url = "www.example.com/page-b"

    return { title: title, copy: copy }
  } 
  else {
    var title = "Random Title";
    var copy = "Random description";
    var url = "www.example.com/random"
  }
}

Now in a separate function I might have the below. This will need the variables from the whatQueryType function for a number of things: maybe ajax urls, page titles and page descriptions. But things are building up. Code becoming messy. I would like to simply drop the function inside any function, pass the query type and have access to all the variables.

Say we have a simple click event

$(document.body).on('click', '.item', function(e){

//instead of this
if (type === "a") 
  {
    var title = "A Tilte"
    var copy = "A description"
    var url = "www.example.com/page-a"
  } 
...
//I would like to use and get access to all the variables using
whatQueryType("b")

//I realise I can
console.log(whatQueryType("b").url)

//what is the correct way to add the url variable to something like
$.ajax({
    url: url,
    dataType: 'json'
})
//I mean, do I need to do this every time I want a variable?
$.ajax({
    url: whatQueryType("b").url,
    dataType: 'json'
})
}

Again, is the the best/correct way of doing this?

Seem to be doing a lot of DRY so trying to reduce this and create a reusable function I can use.
I understand this is very trivial for some, just want to make sure I’m doing things correctly.

Thanks, Barry

2

Using a JSON object seems to make more sense here.

var whatQueryType = {
    "a": {
        "title": "A Tilte",
        "copy": "A description",
        "url": "www.example.com/page-a"
    },
    "b": {
        "title": "B Title",
        "copy": "B description",
        "url": "www.example.com/page-b"
    },
    "c": {
        "title": "C Tilte",
        "copy": "C description",
        "url": "www.example.com/page-c"
    }
}

That way, you can just use whatQueryType(“a”) to get the appropriate information.

3

So how would I call the url in this example, just add the url?

whatQueryType(“a”) // and we always need to run this first?

$.ajax({
    url: url, // this will work
    dataType: 'json'
})

And what if I have other variables I would like to add, example, is this correct practice:

var whatQueryType = {
var someVar = "somevalue"

    "a": {
        "title": "A Tilte",
        "copy": "A description" + someVar + " with more description.",
        "url": "www.example.com/page-a"
    },

And maybe I might need something like:
var title = $('#selector').attr("data-ref")

Just trying to cover all basis, thanks.

Barry

4

I made a mistake earlier using parenthesis when square brackets should’ve been used instead.

Let’s use a doSomething() function as an example:

function doSomething(queryInfo) {
    console.log(queryInfo.url);
}

var queryType = "a";
doSomething(whatQueryType[queryType]);

Then things differ. Solutions are only as good as the needs that are communicated.

5

Cool, thanks for getting back.
Becoming a little clearer.

Run a few more tests se if I can get what I need :nerd_face:

Barry

6

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.