Web-API - Getting return value function

I'm attempting to use a variable to hold the results of a web-api call. However, it keeps coming back as undefined .

When I debug the web-api call itself I do get an expected return value. Basically I want the variable responseCancellationPacket to be able to access the return ApprovalState property/variable in the web-api.  It should either be 0 (if the query in the web-api call does not return a hit) or an actual value from the CRM record. I must be missing something perhaps in the variable declaration that calls the web-api function?

First I get the Guid of the record

Then I declare a variable which calls a function in a utility file that holds various web-api calls. In this case I pass the entity type name and Guid

var entityId = Xrm.Page.data.entity.getId();
 var responseCancellationPacket = WebApiHelper.DocumentationFMA.GetCancellationPacketInfo("entityName", entityId);

The actual web-api call is as follows:

GetCancellationPacketInfo: function (entityType, entityId) {
        entityId = entityId.substr(1, 36);
        var approvalstate = 0;
        var entityName = Xrm.Page.data.entity.getEntityName();
        if (entityName == entityType) {
            var clientURL = Xrm.Page.context.getClientUrl();
            var req = new XMLHttpRequest();
            var query = "/api/data/v8.0/aprv_documentations?$select=aprv_approvalstate&$filter=aprv_included eq 3 and  _aprv_projectid_value eq " + entityId + "";
            req.open("GET", encodeURI(clientURL + query), true);
            req.setRequestHeader("OData-MaxVersion", "4.0");
            req.setRequestHeader("OData-Version", "4.0");
            req.setRequestHeader("Accept", "application/json");
            req.setRequestHeader("Content-Type", "application/json; charset=utf-8");
            req.onreadystatechange = function () {
                if (this.readyState === 4) {
                    req.onreadystatechange = null;
                    if (this.status === 200) {
                        var results = JSON.parse(this.response);
                        if (results.value.length > 0) {
                           
                            for (var i = 0; i < results.value.length; i++) {
                                var ApprovalState = results.value[i]["aprv_approvalstate"];
                                return ApprovalState = approvalstate;
                            }
                        }
                        return ApprovalState = approvalstate;
                    } else {
                        Xrm.Utility.alertDialog(this.statusText);
                    }
                }
            };
            req.send();

        }

    },

Any insight is appreciated.