JS核心知識点整理——文脈、作用域、閉包、this(下)

引用する

前の2つの文章では,コンテキスト,役割ドメイン,閉パッケージ,thisについて述べた.ここで私は心を込めていくつかの特別な経典の面接問題(不定期更新、ひざまずいてコレクションを求めます)を選びました.これらのテーマを通じて、JS 3つの大学3つのうちの1つを完全にクリアできると信じています.

クローズド・グループ:

， 1. 2. ， 。 ， ， 3. ，

1、

var n=0;
    function a(){
        var n=10;
        function b(){
            n++;
            console.log(n);
        }
        b();
        return b;
    }
    var c=a();
    c();
    console.log(n);
//11 12 0

2、

var a=9; 
function fn(){ 
    a=0;       //     var a = 0 ,     
    return function(b){ 
        return b+a++; 
    }    
}
var f=fn();
console.log(f(5));
console.log(fn()(5));
console.log(f(5));
console.log(a);

// 5 5 6 2
//    var a = 5 5 6 9

3、

var ary=[1,2,3,4];
function fn(ary){
    ary[0]=0;    
    ary=[0];    
    ary[0]=100;    
    return ary; 
}
var res=fn(ary);    
console.log(ary);    
console.log(res);
// [0,2,3,4] [100]

4、

function fn(i) {
    return function (n) {
        console.log(n + (i++));
    }
}
var f = fn(10);
f(20);
fn(20)(40);
fn(30)(50);
f(30);

//30 60 80 41

5、

var i = 10;
function fn() {
    return function (n) {
        console.log(n + (++i));
    }
}
var f = fn();
f(20);
fn()(20);
fn()(30);
f(30);
//31 32 43 44

6、以下のコードの機能は5つのinputボタンにclickクリックイベントをループバインドすることを実現し、バインドが完了したら1、2、3、4、5つのボタンをクリックしてそれぞれalertに0、1、2、3、4の5文字を出力する。(テンセント)

すみません、以下のコードは実現できますか?もし実現できなかったら、現在の効果はどのようなものですか?どのような修正をすれば、私たちが望んでいる効果を達成し、原理を説明することができますか?

    
    
    
    
    


    var btnBox=document.getElementById('btnBox'),
    inputs=btnBox.getElementsByTagName('input');
    var l=inputs.length;
    for(var i=0;i<l;i++){
        inputs[i].onclick=function(){
            alert(i);
        }
    }

1.実現できない2.jsにはブロック作用域がないので、共通の外層作用域のiは、トリガ関数をクリックする際に外層のiが5であることに注意すべきであるため、全ての印刷5は故障しない.解決構想1:ブロック作用域がなければes 6のletでブロック作用域を形成する

 for(let i=0;i

解決構想2:バインドするたびにiは実は正しいので、私は別の変数で毎回のiを保存することができますか?

//    ？
for(var i=0;i

では、コールバック関数を定義するときに中のコードをすぐに実行させ、パラメータ0,1,2,3,4を受信させるべきです.

for(var i=0;i

for(var i=0;i

どうやって最適化できますか?iが伝わる以上、私はどうして変数で保存しなければならないのですか?

for(var i=0;i

thisグループ:

， ， 。 ，

1、

var num = 10;
var obj = {num: 20};
obj.fn = (function (num) {
    this.num = num * 3;
    num++;
    return function (n) {
        this.num += n;
        num++;
        console.log(num);
    }
})(obj.num);
var fn = obj.fn;
fn(5);
obj.fn(10);
console.log(num, obj.num);
//22 23 65 30