1

As title. Can someone tell me why? Thank you very much!

<script type="text/javascript">
        var status=[1,2,3];
        console.log(typeof(status));
        console.log(status);        // the result is "1,2,3"

        var normal_array=[1,2,3]; 
        console.log(typeof(normal_array));
        console.log(normal_array);  // the result is "(3) [1,2,3]"
</script>
LianSheng
  • 448
  • 5
  • 17

3 Answers3

3

See window.status

Sets the text in the status bar at the bottom of the browser or returns the previously set text.

This property does not work in default configuration of Firefox and some other browsers: setting window.status has no effect on the text displayed in the status bar. To allow scripts to change the the status bar text, the user must set the dom.disable_window_status_change preference to false in the about:config screen.

It cannot be anything other than a string, so when you use

var status = [1,2,3];

it gets immediately converted into a string.

Note that const and lets on the top level don't get assigned to the global object:

const status = [1,2,3];
console.log(typeof status);

Another option is to simply put your status in an IIFE:

(() => {
  var status = [1,2,3];
  console.log(typeof status);
})();
Community
  • 1
  • 1
CertainPerformance
  • 356,069
  • 52
  • 309
  • 320
2

This is because your global variable status is shadowing Window.status. Whenever you set it, its value is converted to a string (thus you see '1,2,3' because Array#toString is called), by HTML5 specification:

For historical reasons, the status attribute on the Window object must, on getting, return the last string it was set to, and on setting, must set itself to the new value. When the Window object is created, the attribute must be set to the empty string. It does not do anything else.

To get rid of global shadowing with var, use a block-scoped variant introduced in ES2015:

const status = [1, 2, 3]; //or
let status = [1, 2, 3];
Andrew Li
  • 55,805
  • 14
  • 125
  • 143
1

The global scope contains a lot of variables such as status which can cause difficulties like this, since some of them are locked to a certain type and others can't be changed. To avoid this problem, you can write your code inside of a function to get a clean scope. Variables declared with the var keyword are function scoped, so a function does the job.

When a variable is scoped to your function rather than to the global namespace, it will not override the global variable of the same name. This means you can still access the global one via window.status if you wish.

example (continue reading after this example for a better way):

//define your function with your code inside
function myCode(){
    var status=[1,2,3];
    console.log(status);
}
myCode(); //call your function

You can use a IIFE (Immediately Invoked Function Expression) to declare the function and then immediately run it without having to bind it to a global name which is very useful in this scenario.

(function(){
    var status=[1,2,3];
    console.log(status);
})();

Same thing, except that the function is invoked immediately. This is preferable since the goal here is to avoid having global name collisions.

Chris Rollins
  • 550
  • 3
  • 9