Home >Web Front-end >JS Tutorial >Example of the difference between variable declaration with var and without var in JavaScript_javascript skills
This article discusses the difference between variable declarations in JavaScript with var and without var. The scope of variable declarations in JS is based on functions, so we often see the method to avoid global variable pollution is
(function(){ // ... })();
Within a function, variables declared with var and without var are different. Those declared with var are local variables, and those without var are declared global variables, so you can use this to expose interface stuff to the outside world.
When declaring a variable in the global scope, it looks the same with or without var. We know that the declared global variable is the attribute of window. Whether it is the same or not, we use the attribute query method provided by ECMAScrpit5 to find out. difference.
var fff = 2; window.ffa = 3; ffb = 4; this.ffc = 4; var ffftx = Object.getOwnPropertyDescriptor(window, 'fff'); //configurable:false,enumerable:true,value:2,writable:true var ffatx = Object.getOwnPropertyDescriptor(window, 'ffa'); //configurable:true,enumerable:true,value:2,writable:true var ffbtx = Object.getOwnPropertyDescriptor(window, 'ffb'); //configurable:true,enumerable:true,value:2,writable:true var ffctx = Object.getOwnPropertyDescriptor(window, 'ffc'); //configurable:true,enumerable:true,value:2,writable:true
Through the above, we found that there is still a difference. Let's use delete to delete the attribute to verify that the attribute with configurability of false cannot be deleted. That is to say, the attributes of the global object declared through the variable var cannot be deleted. We will also find that the attributes of the global object created by the function declaration cannot be deleted.
delete fff; // 无法删除 delete ffa; // 可删除 delete ffb; // 可删除 delete ffc; // 可删除
The conclusion is that there is a difference between declaring global variables with var and without var.
It is legal and harmless to use var statements to repeat declaration statements. If the statement is repeated with an assignment, it is no different from a normal assignment statement. If you try to read an undeclared variable, JS will report an error.
Within the function scope of JavaScript, declared variables or internal functions are visible in the function body. Meaning, the function may be available before it is defined. There are two ways to define a function, one is a function definition expression, and the other is a function declaration statement.
// 函数定义表达式 var fns = function (){ // ... }; // 函数声明语句 function fns(){ // ... }
Function declaration statements are "advanced" to the top of the external script or external function scope, so a function declared in this way can be called by code that appears before it is defined. In function definition expressions, the declaration of variables is advanced, but the assignment to variables is not advanced. Therefore, functions defined in expressions cannot be called before the function is defined.
(function() { testa(); // 打印出testa testb(); // 报错:提示undefined is not a function console.log(testc); //undefined,如果移到上面就可以了 function testa() { console.log("testa"); } var testb = function() { console.log("tesb"); } var testc = "testc"; })();
Of course, when we declare variables and functions, we must comply with basic specifications. Variables and functions must be declared in advance.