Function and object parsing with duplicate names in JavaScript

What happens if the function and object have the same name in js? This issue deserves to be discussed in detail. This article mainly introduces to you the relevant information about functions and objects with duplicate names in JavaScript. Friends in need can refer to it. Let’s take a look together. I hope it can help everyone.

JavaScript allows repeated declaration of variables, and the later declaration overwrites the previous one.

var a = 1;
var a = 'x';
console.log(a);
//输出'x'

JavaScript allows repeated definition of functions.

JavaScript does not have the concept of overloading. It only distinguishes functions based on their names.

The function with the same name defined later overwrites the previous one, regardless of the parameters.

function test() {
 console.log("test");
}
test(); //输出 "test arg0 + undefined"

function test(arg1) {
 console.log("test arg" + arguments.length + " + " + arg1);
}
test(1,2); //输出 "test arg2 + 1"

If the number of actual parameters is less than the formal parameters, then the remaining default assignments are undefined; if the number of actual parameters passed is more than the number of formal parameters, then all will be passed in, only However, there is no corresponding formal parameter that can be referenced (but you can use arguments to get the remaining parameters)

function test(arg1) {
 for(var i=0; i<arguments.length; i++) {
 console.log(arguments[i]);
 }
}
test(1,2); //输出 1 2

When a variable has the same name as a function, the variable takes effect

This involves variables Pre-parsing of functions and functions:

- Variable declarations will be placed on top, and function declarations will also be placed on top and declared before variables.

- When the declaration of a variable and the assignment statement are written together, the JS engine will split it into two parts: the declaration and the assignment. The declaration is placed at the top and the assignment remains at the original position.

- Declared variables will not be declared again.

var a = 100;
function a() {
 return "function";
}
console.log(a); //输出 100
console.log(a()); 
/*
报错
Uncaught TypeError: a is not a function
 (anonymous function) @test.html:9
*/

There are two kinds of functions in JS, one is an ordinary function and the other is a function object. The following is a "function object", which actually declares an anonymous function and then assigns the function's init method to the variable.

var a = 100;
var a = function() {
 return "function";
}
console.log(a);
/* 
输出
function() {
 return "function";
}
*/
console.log(a()); //输出 "function"

The function has the same name as the internal variable

Define an ordinary function, that is, define a key under the window variable, its name is the function name, and its value is the address of the function. This inside the function points to the window object.

function a() {
 console.log(this); //输出 window{...}
 this.a = 1;  //即 window.a = 1，此时window下的function a已经被该变量覆盖了。
 var a = 5;  //下面的这几个变量都是局部变量，仅在花括号范围内有效。 
 a = 10;
 var v = "value"
 return "function";
}
console.log(a);  //输出 function a {...}
console.log(a()); //输出 "function"
console.log(a);  //输出 1
console.log(v);
/*
输出
Uncaught ReferenceError: v is not defined
 (anonymous function) @ mycolor.html:15
*/

Related recommendations:

About how to solve the problem of calling js methods with duplicate names

The above is the detailed content of Function and object parsing with duplicate names in JavaScript. For more information, please follow other related articles on the PHP Chinese website!