JavaScriptは閉じています.

9802 ワード

閉包とは何ですかクローズド(closure)とは、別の関数のスコープ内の変数にアクセスする権限を持つ関数であるJavaScriptアドバンストプログラムの設計が簡単であれば、クローズドは関数(作用領域は他の関数にアクセスできる局所変数)のクローズドの役割とは何ですか?拡張変数の作用範囲
function fn() {
    var num = 10;
    return function() {
        console.log(num);	//   num     fn()       num,  fn()       
    }
}
var f = fn();
f();	//10
閉包する経典の面接問題1–liをクリックして現在のliのインデックス番号を出力します.
//HTML     
<nav>
    <li>    1</li>
    <li>    2</li>
    <li>    3</li>
    <li>    4</li>
</nav>
// JS    
// 1.                
var lis = document.querySelector('nav').querySelectorAll('li');
// 2.            li    
for(var i = 0; i < lis.length; i++) {
    //   for     4       
    //             ,                        i    
    (function (i) {
        lis[i].onclick = function () {
            console.log(i);              
        };
    })(i);
}
クローズドの経典面接問題2–3秒後、すべてのli要素の内容を印刷します.
//HTML     
<nav>
    <li>    1</li>
    <li>    2</li>
    <li>    3</li>
    <li>    4</li>
</nav>
// JS    
var lis = document.querySelector('nav').querySelectorAll('li');
for(var i = 0; i < lis.length; i++){
    (function (i) {
        setTimeout(function () {
            console.log(lis[i].innerHTML);     
        },3000);
    })(i);
}
クローズドの経典の面接問題3–タクシーの初乗り料金13(3キロ以内)、その後何キロごとに5元のユーザーを増やしてキロ数を入力すればタクシーの価格を計算できます.
// JS    
var cal = (function () {
    var start = 13; //           
    var total = 0;  //            
    //      
    return {
        price: function (n) {
            if(n <= 3){
                total = start;
            }else {
                total = start + (n - 3) * 5;
            }
            return total;
        },
        //      
        yd: function (flag) {
            return flag ? total + 10 : total;
        }
    }
})();
console.log(cal.price(5));  //23
console.log(cal.yd(true));  //33

console.log(cal.price(1));  //13
console.log(cal.yd(false));  //13