Why prompt returns sometimes null as string

Question

a friend of mine asked me why this code doesn't work properly by canceling prompt.

<script type="text/javascript">
    var name = prompt("Enter your name:", "");
    if (!name) {
        name = "unknown";       
    }
    var ans =("<h2>" + "Hello, "+ name + "!"+"</h2>");      
    document.write(ans);        
</script>

Here is jsfidle https://jsfiddle.net/085svr3u/

I found out, that in the example above propmt returns "null" ie. null as string by cancel. And I have no idea why.

I tried to play with original code and refactored it a bit. Now it works as expected. But I still have no explanation.

<script type="text/javascript">

    function test() {
        var name = prompt("Enter your name:", "");
        if (!name) {
            name = "unknown";       
        }
        var ans =("<h2>" + "Hello, "+ name + "!"+"</h2>");      
        document.write(ans);        
    }

    test();
</script>

And here is modified version https://jsfiddle.net/085svr3u/1/

Thank you in advance.

The word _sometimes_ makes no sense in programming IMO.. Either it does or it does not... The reason of `"null"` could be user had entered `null` as input in `prompt` — Rayon, Jul 26 '16 at 18:29
You have pasted the same code twice. I guess the first should have been without that `if` statement? — nicael, Jul 26 '16 at 18:38

Rahul Arora · Accepted Answer · 2016-07-26T18:44:55.027

4

Here is your answer

The keyword 'name' causes problems when used in global scope in javascript

If even in your first case, you replace 'name' with 'fname' or some other variable name it will stop giving null.

<script type="text/javascript">
    var fname = prompt("Enter your name:", "");
    if (!fname) {
        fname = "unknown";      
    }
    var ans =("<h2>" + "Hello, "+ fname + "!"+"</h2>");     
    document.write(ans);        
</script>

In the second case variable 'name' is locally created inside the function and it does not conflict with window.name. Hence it works properly

edited Jul 26 '16 at 18:44

answered Jul 26 '16 at 18:43

Rahul Arora

4,503
1
16
24

1

@nicael Yes it is, and the lesson to be learned here is to keep the use of global variables to a bare minimum. – JLRishe Jul 26 '16 at 18:48
Oh lol it is indeed. Sorry for that! I'm stupid. – nicael Jul 26 '16 at 18:48

JLRishe · Answer 2 · 2019-01-10T08:23:23.247

4

@RahulArora has basically provided the right answer, but to provide a bit more illumination about what is happening:

Browsers have a built-in global variable called name which stores the name of the window. If you assign a value to it, the value you assign will be converted to a string. This has nothing to do with prompt(); you can observe it like this:

var name = null;
console.log(typeof name);  // "string"
console.log(name.length);  // 4

The moral of the story: Avoid using global variables unless you absolutely have to, and if you do, make sure they're not already being used for something else!

edited Jan 10 '19 at 08:23

answered Jul 26 '16 at 18:50

JLRishe

99,490
19
131
169

Thanks for further clarifying. Much appreciated – Rahul Arora Jul 26 '16 at 18:53
@JLRishe Thanks. I didn't know 'name' would be a global variable. I also didn't know about this 'magic' conversion. – Tima Jul 26 '16 at 19:41

Mohammad Mahroz · Answer 3 · 2016-07-26T18:49:01.997

One line answer to your question is that, it returns null when user has escaped the prompt box by clicking cancel or pressing escape.

For further clarification of concepts read this :-

This is formal defiinition of function:

result = window.prompt(message, default);

result : is a string containing the text entered by the user, or null.

message : is a string of text to display to the user. This parameter is optional and can be omitted if there is nothing to show in the prompt window.

default : is a string containing the default value displayed in the text input field. It is an optional parameter. Note that in Internet Explorer 7 and 8, if you do not provide this parameter, the string "undefined" is the default value. (Above was from Mozilla's definition of prompt())

Now we Conclude that:

prompt() returns either null or "string" which can include ""(empty string).

Now We have three states to inspect:

null : The user has clicked Cancel or pressed Esc.

""(empty string) : The user clicked OK or pressed Enter with no text input

"string" : The user entered some text.

hope it helps...!

Why prompt returns sometimes null as string

3 Answers3

Linked

Related