How to modify variables outside the scope in JavaScript_javascript tips

1. I did the after-school exercises while reading the JavaScript study guide today, and therefore conducted a detailed and in-depth study of the parameters passed in the function.

The topic is as follows:

How can a function modify variables outside its scope? Write a function that takes an array of numbers from 1 to 5 as a parameter. After calling the function, the number items will be replaced with the corresponding string representation.

Need to pay attention to the knowledge points:

In the transfer of function parameters in JavaScript, for value transfer of parameters based on original values ​​(numbers, strings, Boolean values), modifications in the function will not affect the actual parameter values. As for the parameters passed to the function, The object is a reference, and modifications to it will be reflected in the calling program.<-However, there will be situations, as follows

var outer_number = ;
var outer_boolean = true;
var outer_array = [,,];
var outer_object = {test:""};
function display(num,bool,arr,obj){
console.log("number:"+num+"\nboolean:"+bool+"\narray:"+arr+"\nobject:"+obj.test);
}
function test(num,bool,arr,obj){
display(num,bool,arr,obj);//num=,bool=true,array=[,,],object.test=
num = ;
bool = false;
arr[] = ;
obj.test = "";
display(num,bool,arr,obj);//num=,bool=false,array=[,,,],object.test=
arr = [,,];
obj = {test:""};
display(num,bool,arr,obj);//num=,bool=false,array=[,,],object.test=
}
test(outer_number,outer_boolean,outer_array,outer_object);
display(outer_number,outer_boolean,outer_array,outer_object);//num = ,bool=true,array=[,,,],object.test= 

In the above code we created 4 global variables, the types are numbers, Boolean values, arrays, objects. 2 functions, display and test.

display was executed 4 times, and the results are as follows:

"number:2
boolean:true
array:1,2,3
object:122"<-The value when passed into the function

"number:0
boolean:false
array:1,2,3,3
object:134"<-Perform changes

"number:0
boolean:false
array:3,2,1
object:133"<-Reassign

"number:2
boolean:true
array:1,2,3,3
object:134"<-After the function is executed

It can be seen that our reassignment of arrays and objects was not successful. If passed by reference, then we should also reassign and modify the arrays and objects of global variables.
In fact, the so-called assignment by reference in JavaScript is not copying by reference in the true sense. To be precise, it should be passed by sharing. It can also be called passing by object or call by sharing.

Under this condition of passing by sharing, the reference we obtain can be said to be only a copy of the actual parameter reference. The biggest difference between it and the passing by reference we often say is that our assignment to the reference copy will not affect the actual parameter. The value of the parameter, as we did above, the assignment operation is not feasible.

Of course, we look at both object types and basic types. Objects are mutable and basic types are immutable (note! String modification is actually a new string returned), so passing by sharing is for basic types. It is also consistent with delivery by sharing.

To summarize:

In JavaScript, both basic types and objects are called by sharing. However, due to the immutability of JavaScript’s basic types, there is no difference between passing basic types by sharing and passing by value, while objects are passed by sharing.

Call by sharing: What is passed is a copy of the actual parameter reference. Our assignment to the reference copy does not affect the value of the actual parameter, but the reference copy can be used to modify the referenced content. Detailed wiki address

Function parameters passed in:

1. Basic types, passed by value (or passed by sharing), internal assignment modifications will not affect the calling program

2. The object type is passed by sharing. What is passed in is a copy of the actual parameter reference. The internal assignment to the reference is invalid, and the assignment modification to the object attribute is valid.

That’s probably how I understand it. If I make any mistakes somewhere, I hope they can be pointed out.

Pull out the JavaScript scope separately below

Any programming language has the concept of scope. Simply put, scope is the accessible range of variables and functions, that is, scope controls the visibility and life cycle of variables and functions. In JavaScript, there are two types of variable scope: global scope and local scope.

　 Global Scope

Objects that can be accessed anywhere in the code have global scope. Generally speaking, the following situations have global scope:

(1) The outermost function and variables defined outside the outermost function have global scope, for example:

var authorName="山边小溪";
function doSomething(){
var blogName="梦想天空";
function innerSay(){
alert(blogName);
}
innerSay();
}
alert(authorName); //山边小溪
alert(blogName); //脚本错误
doSomething(); //梦想天空
innerSay() //脚本错误

(2) All undefined and directly assigned variables are automatically declared to have global scope, for example:

function doSomething(){
var authorName="山边小溪";
blogName="梦想天空";
alert(authorName);
}
doSomething(); //山边小溪
alert(blogName); //梦想天空
alert(authorName); //脚本错误 

　　变量blogName拥有全局作用域，而authorName在函数外部无法访问到。

　　（3）所有window对象的属性拥有全局作用域

　　一般情况下，window对象的内置属性都拥有全局作用域，例如window.name、window.location、window.top等等。

　　1. 局部作用域（Local Scope）　　

　　和全局作用域相反，局部作用域一般只在固定的代码片段内可访问到，最常见的例如函数内部，所有在一些地方也会看到有人把这种作用域称为函数作用域，例如下列代码中的blogName和函数innerSay都只拥有局部作用域。

function doSomething(){
var blogName="梦想天空";
function innerSay(){
alert(blogName);
}
innerSay();
}
alert(blogName); //脚本错误
innerSay(); //脚本错误