First result undefined when looping through JSON string

Question

const obj = {
  "accountId": "number",
  "prefix": "string",
  "firstName": "string",
  "middleName": "string", 
  "lastName": "string",
  "suffix": "", 
  "dateOfBirth": "string",
  "email": "string",
  "phone": "string", 
  "status": ""
};
//JSON.stringify(obj); //assuming this does nothing since it's already a JSON string?
//JSON.parse(obj); // This kills the process.
const required = function(k) {
    v = obj[key];
    if (v == ''){
        checked = "<br>A required component " + k + " was missing from this message.";
        return checked;
    } else {
        checked = "<br>the value of " + k + " is " + v;
        return checked;
    }
    
}
for (var key of Object.keys(obj)) {
    document.getElementById("demo").innerHTML = document.write(required(key));
};

I'm running the above in the w3 tryit(js) editor. the return is as follows

undefined


the value of accountId is number
the value of prefix is string
the value of firstName is string
the value of middleName is string
the value of lastName is string
A required component suffix was missing from this message.
the value of dateOfBirth is string
the value of email is string
the value of phone is string
A required component status was missing from this message.

I'm trying to understand why the first line of output comes up as undefined. in my use case this would throw a wrench in the works. looking through various answers I've tried forEach and get the same result. tried throwing in JSON.parse(obj) which seems to die. I've also added JSON.stringify(obj) which doesn't change the output.

I've combed through several times I'm fairly certain that I'm not missing something silly like a , or ;.

After that first line coming back as undefined everything is coming back as expected. I'm stuck.

document.write always returns undefined. Try document.getElementById("demo").innerHTML += required(key); instead. — Đinh Carabus
– Đinh Carabus, Commented Jul 24, 2021 at 17:44
here is another thing You are using key to get the object value, it should b k. v = obj[k] instead of. v = obj[key] jsfiddle.net/6ucjpbdm/1 Check above fiddle. — basit raza
– basit raza, Commented Jul 24, 2021 at 17:47

Dane Hidden · Accepted Answer · 2021-07-24 17:54:16Z

1

looks like removing document.getElementById("demo").innerHTML = from the loop did the trick in the tryit editor.

for (var key in obj) {
    document.write(required(key));
};

resulted in

the value of accountId is number
the value of prefix is string
the value of firstName is string
the value of middleName is string
the value of lastName is string
A required component suffix was missing from this message.
the value of dateOfBirth is string
the value of email is string
the value of phone is string
A required component status was missing from this message.

I kind of have an idea of why...

answered Jul 24, 2021 at 17:54

Dane Hidden

212 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Đinh Carabus · Accepted Answer · 2021-07-24 18:05:07Z

0

document.write always returns the value undefined. So in each loop iteration you are actually setting the innerHTML of the "demo" element to "undefined". The call to document.write appends the actual output to the body element. You should be able to see that in the elements tab of your dev-tools.

edited Jul 24, 2021 at 18:05

answered Jul 24, 2021 at 17:54

Đinh Carabus

3,5054 gold badges26 silver badges47 bronze badges

Collectives™ on Stack Overflow

First result undefined when looping through JSON string

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related