Javascript ES6 Const can be changed if not allowed
It doesn't change, you just print the value you pass to the NOT const function name
.
Example:
{
const name = 'unchangable';
sayName = (newName) => {
name = newName; // This will make an error
}
}
sayName('New Name')
If your code is equal to the beat of the code
{
const name = 'unchangable';
sayName = (someName) => {
// There is no relationship between `someName` and the const `name`
console.log(someName);
}
}
sayName('New Name');
source to share
The problem is that you are creating a new local variable for your function.
The shorthand function you are using would be:
sayName = function(name) {
console.log(name)
}
The name is created inside the function and is not pulled from the outside. You should run your code with the following:
{
const name = 'unchangable';
sayName = (nameInput) => {
name = nameInput;
console.log(name);
}
}
sayName('changed');
This will try to assign a newline to your constant and then log it to the console.
source to share
You need to understand how scoping and closing works in JavaScript.
Each time you create a function, you create a new level of visibility. Anything declared inside this function is accessible by this function and every other function defined inside it. For example,
function sayFirstName(firstName) {
//This function can access firstName
function sayFullName(fullName) {
//This function can access firstName and fullName
console.log(firstName, fullName);
}
}
Every time the JavaScript engine sees an RHS operand (that is, the value on the right side =
) and that variable is not a string, number, function, etc., but something similar to a variable name, the JS engine will look for that variable in local area. If not found, it will traverse all areas created on top of this
In the previous example, if fullName
not found inside sayFullName
, the JS engine will look for all variables declared inside the scope sayFirstName
. If not found, it will look for the global scope, which in the browser is an object window
. If the variable is also not found, an error occurs.
Now, in your code, you define const name
in the outer scope. Then you go ahead and create a new function sayName
. This feature has its own capabilities. Everything announced in it, including the arguments, is new.
So what happens when you do this:
console.log(name);
The JS engine sees the RHS operation, you are trying to set the value of the console.log
first argument to name
. Therefore he is looking name
. The first thing that he will seek - it is an area of local functions sayName
. It will find it there because you defined it in the argument list. This way it will never look outside your function, so it will never find const name
.
You can also write a function like this:
sayName = (foo) => {
console.log(foo);
}
The result remains the same.
source to share