Why values pushed to the array is not available, even though the array is declared as globally acces-CodePudding

i have declared an array globally so that i can modify that inside a function. but after i try and modify the array. the array is showing showing any data and the array is alwayes becomes 0.

this is where the function is been callled from:

var vehicleTypesArr = []; //globally accessable.

function loadVehicleTypes(data) {
            if (data != null) {
                var res = data.VehicleTypes;
                if (res != '' && res != null) {
                    $.each(res, function () {
                        if (res.GroupName === 'ConEnhTyp_Vehicle')
                            vehicleTypesArr.push(this);
                           //console() : if i put a console here, the result will the data with specific groupName and prints until the loop is ended with the data.
                    });
                }
            }
            console.log(JSON.stringify(vehicleTypesArr)); // console 1 : result = 0
            resetVehicleTypes(); //here i call 2nd code snippet
};

This is the 2nd code snippet:

function resetVehicleTypes() {
  alert("1");
  if (vehicleTypesArr.length > 0) {
  alert("2");
    $.each(vehicleTypesArr, function (val) {
      val.prop('checked', false); 
  });
  alert("1");
  }
  alert("Finished");
}

the code enters the function and alerts the 1, and then goes staright to the finished alert.

I tried,

on the console() : i put a console and the result was the data with specific groupName and prints until the loop is ended with the data.

but in the console 1 the array is empty. i tried changing length condition and its not working.

still has no supprt.

CodePudding user response：

Try with this.vehicleTypesArr instead of just vehicleTypesArr within your functions

CodePudding user response：

Code does work in all(that are shown) possible ways a object can be pushed into array.
It looks like the issue is with your if statement in each loop. I recommend always using {} braces. Guessing the condition res.GroupName === 'ConEnhTyp_Vehicle' is never true...

const result1 = document.getElementById('result1');

var vehicleTypesArr = []; //globally accessable.
const some_data = {
  VehicleTypes: [{
      GroupName: 'name 1'
    },
    {
      GroupName: 'name 2'
    }
  ]
};

loadVehicleTypes(some_data);

function loadVehicleTypes(data) {
  if (data != null) {
    var res = data.VehicleTypes;
    if (res != '' && res != null) {
      // alternative to for loops
      //vehicleTypesArr = res.filter(el => el.GroupName === 'ConEnhTyp_Vehicle');
    
      $.each(res, function() {
        // edit: should be this.GroupName instead of res.GroupName
        //if (res.GroupName === 'ConEnhTyp_Vehicle') // not needed for test
        vehicleTypesArr.push(this); // works
        vehicleTypesArr.push(JSON.parse(JSON.stringify(this))); // works
        vehicleTypesArr.push(Object.assign({}, this)); // works
        vehicleTypesArr.push({ ...this
        }); // works
      });

      /*
      for (const el of res) {
        vehicleTypesArr.push(el); // works
        vehicleTypesArr.push(JSON.parse(JSON.stringify(el))); // works
        vehicleTypesArr.push(Object.assign({}, el)); // works
        vehicleTypesArr.push({ ...el
        }); // works
      }
      */
    }
  }

  result1.innerHTML = JSON.stringify(vehicleTypesArr);
};

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="result1">test</div>

Edit:
Looking back at it. The if statement is checking res.GroupName when it should be checking this.GroupName.