La anulación es básicamente cuando define varias funciones o variables que tienen el mismo nombre, la última definida anulará todas las definidas anteriormente y cada vez que invoque una función, se ejecutará la última definida. La anulación generalmente ocurre cuando tiene varios archivos javascript en su página. Puede ser un archivo externo o el archivo que creó internamente. Esto suele ocurrir debido a la presencia de variables o funciones con el mismo nombre en el ámbito global.
Supongamos que tenemos los siguientes archivos:
Nombre de archivo: index.html
<!DOCTYPE html> <html> <head> <title>Namespace</title> <script src="script1.js"></script> <script src="script2.js"></script> <script src="app.js"></script> </head> <body></body> </html>
Este archivo ha vinculado script1.js, script2.js y app.js como archivos javascript externos que se indican a continuación:
Nombre de archivo: script1.js
var name = "Arsalan";
function sayHello(){
console.log("Hello "+name);
}
Nombre de archivo: script2.js
var name = "John";
function sayHi(){
console.log("Hi " + name);
}
Nombre de archivo: app.js
sayHello(); sayHi();
Aquí app.js es responsable de invocar funciones dentro de script1.js y script2.js y obtendrá el siguiente resultado en la ventana de su consola como se muestra a continuación: 
Bueno, esto sucede porque tenemos el mismo nombre de variable en script1.js y script2.js en el ámbito mundial. Esta es la razón por la que script2.js está anulando script1.js
Para solucionar este problema, utilizaremos el concepto de espacio de nombres como se describe a continuación con los siguientes cambios realizados en estos archivos:
Nombre de archivo: index.html
<!DOCTYPE html> <html> <head> <title>Namespace</title> <script src="script1.js"></script> <script src="script2.js"></script> <script src="app.js"></script> </head> <body></body> </html>
Nombre de archivo: script1.js
var arsalanGreeter = {};
arsalanGreeter.name = "Arsalan";
arsalanGreeter.sayHello = function(){
console.log("Hello "+ arsalanGreeter.name);
}
Nombre de archivo: script2.js
var johnGreeter = {}
johnGreeter.name = "John";
johnGreeter.sayHi = function(){
console.log("Hi " + johnGreeter.name);
}
En los dos archivos anteriores, creamos un objeto y luego asignamos nombres a la variable de nombre. De esta manera, hemos evitado cualquier problema primordial.
Nombre de archivo: app.js
arsalanGreeter.sayHello(); johnGreeter.sayHi();
En el archivo anterior, hemos utilizado un nuevo nombre de función y se invocará mientras se ejecuta el programa y la ventana de su consola se verá como se muestra a continuación:
Publicación traducida automáticamente
Artículo escrito por MohdArsalan y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA