How should I refactor this nested IF statement?

Question

I have this function which has more then 3 nested if statement(4 nested If in the function). I am trying to solve sonar issue where it says to refactor this code to not nest more than 3 IF/FOR/WHILE/TRY statements . I searched around but couldn't find anything too useful is it possible to reduce? - if so, how would I go about doing so? Any feedback are appreciated

Here is the function

function find(animals) {

    var animalsCode = getByanimals(animals);

    if (typeof animalsCode !== 'undefined' && !isanimalsSupported(animalsCode)) ---> Nesting 1{

        var url = $('.menu-select-animals li[data-animals="' + animalsCode + '"] a').attr('href');
        var newQuery = '';

        if (url) {    ---->Nesting 2
            var redirectQuery = '';
            if (window.location.search) {

            //some logic
            }
            if (url.indexOf('?') > -1) {    ---->Nesting 3

               //some logic

                if (typeof join[1] !== 'undefined') { ---->Nesting 4

             //some code
                }
            }

            if (typeof mergedQueries !== 'undefined');
            }
        } else {
          //some code
        }
     else {
        handleanimals();
    }
}
    return {
    handleanimals();
    },

    windows: function() {
      if (typeof theSrc !== 'undefined') {
      // some logic
      }

      if (typeof animalsCheckTheSrc !== 'undefined') {

        if (animalsCookie !== animalsCheckTheSrc) {
        // some logic
        }
        checkanimalsCookie(animalsCheckTheSrc);
      } }}};
})(jQuery);

Answer 1

It's hard to reason about your function because it doesn't return anything. I would have a very hard time tracing the flow of a program that relied on these side-effect only functions like this.

But, one thing you could probably do is decompose this function more and start using return values. For instance, split off this piece of code, and return the redirectURL in your new function.

if (redirectURL) {    ---->Nesting 2

            var pageQuery = '';

            var redirectQuery = '';
            if (window.location.search) {

                pageQuery = window.location.search.substr(1).split('&');

            }
            if (redirectURL.indexOf('?') > -1) {    ---->Nesting 3

                var redirectSplit = redirectURL.split('?');

                redirectURL = redirectSplit[0];


                if (typeof redirectSplit[1] !== 'undefined') { ---->Nesting 4

                    redirectQuery = redirectSplit[1].split('&');

                }
            }
            var mergedQueries = com.trp.fai.utility.mergeStringArrays(redirectQuery, pageQuery);



            if (typeof mergedQueries !== 'undefined' && mergedQueries.length > 0) {

                newQuery = '?' + mergedQueries.join('&');

            }
        } else {

            redirectURL = 'http://corporate.troweprice.com';

            newQuery = '?src=' + countryCode;

        }

If you need to return multiple items you can either use global variables or return an object and destructure it on the other side.