需要 fetch() 等的 JavaScript 示例

Question

I want to learn such new JavaScript features as fetch() and arrow functions. To this end, I selected a function from a recent app, and attempted to replace older features with new. Very little success. Here's my original function:

function popNames(arNumbers,ctrlName) {
  var arSortedList = [];
  var strNameList = "";
  $.getJSON("NAME.json").done(function(zdata) {
$.each(arNumbers, function(i, ydata) {
  $.each(zdata.NAME, function(k,v) {
    if(v.idName == ydata) {// important: === did NOT work
          if(ctrlName) arSortedList.push(v.last + ", " + v.first + ";" + v.idName);
      else arSortedList.push(v.last + ", " + v.first);
    }
  });   // each element of NAME.json
}); // each idName value in the array passed
if(ctrlName) {
  setOptions(arSortedList, ctrlName);
} else {
  strNameList = arSortedList.join();
}
  });   // getJSON NAME
}

I was successful using this line:

fetch("NAME.json").then(zdata => zdata.json())

but nothing I did after that worked. I'd appreciate seeing an example from which I can learn.

Answer 1

function popNames(arNumbers,ctrlName) {
    let arSortedList = [];
    let strNameList = "";
    fetch("NAME.json").then(zdata => zdata.json())
    .then(zdata => {
        for(const ydata of arNumbers)   {
            for(const v of zdata.NAME) {
                if(v.idName == ydata) {     // important: === did NOT work
                    if(ctrlName) arSortedList.push(v.last + ", " + v.first + ";" + v.idName);
                    else arSortedList.push(v.last + ", " + v.first);
                }
            }
        }
        if(ctrlName) {
            setOptions(arSortedList, ctrlName);
        } else {
            strNameList = arSortedList.join();
        }
    }); // getJSON NAME
}

I was researching why I couldn't next two Array.forEach statements, and discovered a new iterable construction (for...of).