Replacing Object.values with Object.keys in strict mode

Question

Very new to javascript

Here is the portion of code of interest

  var labels = {
    'Test Catalog ID':id,
    // 'Performing Laboratory': data['lab_name'],
    // 'Biosafety': data['biosafety'],
    'Tests Included in Panel': data['tc_tests_included'],
    'Methodology': data['methodology'],
    // 'Reference Range': data['ref_range'],
    // 'Tests Limitations': data['limitations'],
    'Preferred Specimens': data['analytes'],
    // 'Rejection Criteria': data['rejection_criteria'],
    'WARNING': data['warning'],
    'Special Instructions': data['special'],
    'Collection Instructions': data['collection'],
    'Specimen Volume': data['specimen_volume'],
    'Storage Prior to Shipping': data['storage_information']
  }
  console.log(Object.keys(labels));
  output = Object.keys(labels).map(function(e) {
    return labels[e]
  })
  console.log(output);
  //console.log(Object.values(labels));
  var new_HTML = '';
  for(var i = 0; i < Object.keys(labels).length; i++){
    if(Object.values(labels)[i] != 'N/A'){
      new_HTML += "<strong>" + Object.keys(labels)[i] + "</strong>: " + Object.values(labels)[i] + "<br /><hr>";
    }
  }
  body.innerHTML = new_HTML;
  console.log(new_HTML);

In internet explorer I realized that Object.values was throwing an error and the recommended fix was to use Object.keys(labels).map(function(e) { return labels[e] })

But now I get SCRIPT5042: Variable undefined in strict mode

And I also do not know how to replace the Object.values in

if(Object.values(labels)[i] != 'N/A'){
      new_HTML += "<strong>" + Object.keys(labels)[i] + "</strong>: " + Object.values(labels)[i] + "<br /><hr>";

try `var output = Object.keys(labels)...`, take a look here: https://stackoverflow.com/a/42830295/5781499 — Marc, Jan 16 '20 at 21:09
instead of calling `Object.keys()` and `Object.values()` on labels over and over and over and over - just call it once... cache it once.. and use that cache everywhere — Klaycon, Jan 16 '20 at 21:10

Klaycon · Accepted Answer · 2020-01-16T21:35:07.070

1

remember to declare variables that haven't been declared yet
output is already an array of the values in labels... you don't need to call Object.values() again if you already have the values
consider caching the keys as well since you use them later
name your variables in a way that makes their purpose easy to understand at a glance

  var labels = {
    'Test Catalog ID':id,
    // 'Performing Laboratory': data['lab_name'],
    // 'Biosafety': data['biosafety'],
    'Tests Included in Panel': data['tc_tests_included'],
    'Methodology': data['methodology'],
    // 'Reference Range': data['ref_range'],
    // 'Tests Limitations': data['limitations'],
    'Preferred Specimens': data['analytes'],
    // 'Rejection Criteria': data['rejection_criteria'],
    'WARNING': data['warning'],
    'Special Instructions': data['special'],
    'Collection Instructions': data['collection'],
    'Specimen Volume': data['specimen_volume'],
    'Storage Prior to Shipping': data['storage_information']
  }
  var keys = Object.keys(labels);
  var values = keys.map(function(e) {
    return labels[e];
  });
  var new_HTML = '';
  for(var i = 0; i < values.length; i++){
    if(values[i] != 'N/A'){
      new_HTML += "<strong>" + keys[i] + "</strong>: " + values[i] + "<br /><hr>";
    }
  }
  body.innerHTML = new_HTML;
  console.log(new_HTML);

edited Jan 16 '20 at 21:35

answered Jan 16 '20 at 21:15

Klaycon

10,599
18
35

1

Well framed answer. Small nitpick though: should we still be telling people to use `var` in 2020, outside of a couple small use cases? At this point, everyone should be using either `let` or `const`. – Stephen M Irving Jan 16 '20 at 21:29
1

Thanks @StephenMIrving, and I absolutely, 100% agree. However, as I was writing an additional note recommending `let` or `const` I decided to look up their compatibility with IE since that is the exact thing causing this question - despite being 2020, IE version 11 still only has partial support for `let` and `const`. It's a shame, but I'll at least edit the question to not explicitly recommend `var`. – Klaycon Jan 16 '20 at 21:30
Even if you are still forced to support IE 11, which has debatable utility outside some legacy enterprise applications, I think the best practice would be to write using modern syntax and then use babel and modernizr to compile an IE friendly version of your code and have that served up to IE users. I would also note that the limitations IE11 has with `let` and `const` don't keep you from being able to use them in IE11. It 's a couple scope issues like not scoping to for loops correctly, they still mostly work. Though, I believe, babel will still remove them if you configure it for IE11 – Stephen M Irving Jan 17 '20 at 06:37

Replacing Object.values with Object.keys in strict mode

1 Answers1