[SOLVED] Wrong Answer in a Js challenge

Question

This is the Challenge :

What is the output of this code?

document.write(name,printName())
var name = "Lawrence"
function printName(){
return "John Doe"
}

it should print :
undefinedJohn Doe

Am I wrong ?

Answer 1

Med Amine Fh Window.name is a getter/setter property used to get/set the name of the browsing context, normally set to an empty string hence reason document.write(name,printName()) only returns "John Doe"

https://www.w3schools.com/jsref/prop_win_name.asp

Ipang https://www.digitalocean.com/community/tutorials/understanding-hoisting-in-javascript#es5

Answer 2

ODLNT
Thanks for the reference 🙏

So ... the quiz was legit?

I'm still wondering why refreshing the page (in browser), or running the code (in SL app) the second time forth displays different output. I was expecting same output though, but no.

Answer 3

Really interesting question, and no, unfortunately the quiz is correct. Here's why:

When you create and give a value to a variable, two things are really happening:
1. You're creating a "box" with the label of whatever you're calling the variable. var myVar creates a box named "myVar". This is called "declaring" a variable.
2. You're *then* putting a value in that box. This is called "initialization".

These are normally done together, so you don't need to even know the difference. HOWEVER...

When you create a variable using 'var', the first step is essentially done at the beginning of the program, but the second part is only done when we reach it in the code! So:

someFunction(a,b,c);
/*
a thousand lines of code...
blah blah...
*/
var a = 1;
var b = 3;
var c = 2;

The 'declaring' of variables a, b, and c is visible from the top of our script - we say the declaration is "hoisted" to the top of the script - but their values arent. So if someFunction() was this:

function someFunction(a,b,c){
console.log(a,b,c);
}

it'd print out "undefined undefined undefined", but it would *not* tell us that there's an error because a, b, and c don't exist.

So let's look at your code:

document.write(name,printName())
var name = "Lawrence"
function printName(){
return "John Doe"
}

The variable "name" declaration is moved - hoisted, remember! - to the top of our script. The *value* of that variable - "Lawrence" - is not, however. So what about that function? Well, function declarations are *fully* hoisted to the top of the page. So even if we define our function printName as the last few lines of code in a 10,000 line script, it'll still be available at the very top of that script.

Answer 4

ODLNT Thanks
So document.write() takes some parameters to see property of window like name and title ...
Name set to empty string by default
And title set to Page title by default
So we can set window.name and window.title through document.write method if pass something in it
Right??

Answer 5

As I recall, definition using `var` is hoisted, meaning it is recognized even if the variable was defined past the line where it is used.

Answer 6

Actually the right Answer given by sololearn is just
John Doe

Answer 7

I already report that

Answer 8

Spentify
Wrapped in onload handler it outputs 'undefinedJohn Doe'

Now I'm not too sure about that hoisting theory ...

(Edit)
Same behaviour is shown as I tested by saving the code as local file in phone, and opening in browser (built-in and Chrome).

Answer 9

HealyUnit
How about the difference output for when the page loads first time and successive loads?

Answer 10

Thanks ODLNT I think i get it now.
its little bit confusing this document.write

Answer 11

Med Amine Fh You welcome. This particular challenge peeked my interest�� so thank you for that.

Answer 12

ODLNT why this is showing wiered outputs?
means will you give me a little bit of more information?
and sometimes it shows
LawrenceJohn Doe
for me then it automatically when i re run it then it shows John doe
https://code.sololearn.com/W5u13pH599re/?ref=app

Answer 13

Jiya If you change document.name to window.name then you will be correct. Please keep in mind that the document object is a property of the window object.
http://eligeske.com/jquery/what-is-the-difference-between-document-and-window-objects-2/

Answer 14

In that case, if the quiz said so, then it is a faulty one.

Answer 15

Spentify OMG This is what they called JS Curse

Answer 16

Jiya Ipang When the run button is clicked the document is reloaded but window object is not. So in the case of the challenge when the code is initially ran the getter window.name returns an empty string hence the reason you only see John Doe initially. Now on the second line of code window.name is set to "Lawrence". So when the run button is clicked for a second,third, fourth, and so on, you will see Lawrence John Doe. Take a look at the code it may provide a better explanation for the weird output.
https://code.sololearn.com/Wa69a8a3A8a2/?ref=app

Answer 17

Thanks for explanation ODLNT

Answer 18

You're welcome Ipang. I hope it help.

Answer 19

ODLNT Thanks for your attention
Let me revise this to you correct me if i am wrong ...
In the sL challenge case the value of document.name set to empty which is empty by default and when we run it again the the changes to name varible becoz the name variable was stored in computer memory
Right???