jsノートクロージャー(クロージャー)

1.可変スコープ

1.グローバル変数

1.グローバル変数は関数内で使用できます
2.関数内のローカル変数は関数外では使用できません
3.関数が実行されると、スコープ内のローカル変数は破棄されます

2.ローカル変数

1.関数の内部はローカル変数です

2.閉鎖

クロージャは、別の関数のスコープ内の変数にアクセスできる関数です。
(つまり、あるスコープが別の関数内のローカル変数にアクセスできます。)関数内に
ローカル変数aがある場合、他のスコープb(グローバルスコープかローカルスコープかに関係なく)はこのローカル変数aにアクセスできます。現時点では閉鎖となります。
その場合、この変数aが配置されている関数は、クロージャ関数と呼ばれます。
クロージャーの主な機能:変数のスコープを拡張します。
ただし、クロージャはメモリリークを引き起こす可能性もあります。

1.最初のタイプ

 <script>
     // 闭包:fun 这个函数作用域访问了另外一个函数fn 里面的局部变量 num,此时就产生了闭包,而被访问的局部变量num所在的函数fn就是闭包函数
     // fn 外面的作用域可以访问fn 内部的局部变量
     function fn() {
    
    
         var num = 10;

         function fun() {
    
    
             console.log(num);
         }
         fun();
     }
     fn();
 </script>

2.2番目のタイプ

(関数外のスコープは、関数内のローカル変数にアクセスします)

 <script>
// fn 外面的作用域可以访问fn 内部的局部变量
function fn() {
    
    
	var num = 10;

	function fun() {
    
    
		console.log(num);
	}
	// fun 不加括号就相当于一个变量,也就是相当于fun的整体
	// 函数是一种数据类型,所以可以当参数,也可以当返回值
	return fun;
}
// 此时就实现了fn函数外面的作用域可以访问fn内部的局部变量了
var f = fn();
f();

 /*
  1、fn() 这个函数一调用,就会执行 function fn(){}  => var num = 10;  => function fun(){}不调用不执行
  ==> 执行return fun; 
  类似于 var f = function fun() {
                     console.log(num);
                 }
  ==> 此时 f 存的是一个函数 => 此时就可以调用f 这个函数 f();  =>调用了f();它就会到function fun(){}
  ==>function fun(){} 里面的num 因为在函数fn 里面,所以可以使用fn函数的变量,
  ==> 所以调用f 就可以打印出num
  */
 </script>

3.閉鎖に関する一般的な面接の質問

	<body>
		<ul class="nav">
			<li>1</li>
			<li>2</li>
			<li>3</li>
			<li>4</li>
		</ul>
		<script>
			// 利用闭包的方式得到当前li的索引号
			var lis = document.querySelector('.nav').querySelectorAll('li');
			for(var i = 0; i<lis.length; i++){
     
     
				// 利用for循环创建了四个立即执行函数
				(function(i){
     
     
					lis[i].onclick = function(){
     
     
						console.log(i);
					}
				})(i);
			}
		</script>
	</body>

おすすめ

転載: blog.csdn.net/weixin_44401120/article/details/113939901