JS高频笔试题——闭包

552 阅读1分钟

不废话,直接上题!

第一题

function f1(){
    var sum = 0
    function f2(){
        sum++
        return f2
    }
    f2.valueOf = function(){
        return sum
    }
    f2.toString = function(){
        return sum + ''
    }
    return f2
}

console.log(+f1());
console.log(+f1()());
console.log(+f1()()());

第二题

var a = 2;
var obj = {
    a: 4,
    fn1: (function () {
        this.a *= 2;
        var a = 3;
        return function () {
            this.a *= 2;
            a *= 3;
            console.log(a);
        };
    })(),
};
var fn1 = obj.fn1;

console.log(a);
fn1();
obj.fn1();
console.log(a);
console.log(obj.a);
var add = function (x) {
    var sum = x;
    var tmp = function (x) {
        sum += x;
        return tmp;
    };
    tmp.toString = function () {
        return sum;
    };
    return tmp;
};

alert(add(1)(2)(3));

第三题

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        #container{
            width: 400px;
            height: 400px;
            border-radius: 5px;
            background-color: purple;
        }
        #container>div{
            width: 80px;
            height: 80px;
            background-color: #fff;
            margin-top: 16px;
            margin-left: 16px;
            float: left;
            border-radius: 4px;
            line-height: 40px;
            text-align: center;
            cursor: pointer;
        }
    </style>
</head>
<body>
    <div id="container"></div>

    <script>
        (function(){
            var arr = new Array(4).fill().map(()=> new Array(4).fill(0))
            var con = document.getElementById("container")
            for(let i=0; i<arr.length;i++){
                for(let j=0;j<arr[i].length;j++){
                    let cell = document.createElement('div')
                    cell.innerHTML = `<div>(${i},${j})</div><div>点${arr[i][j]}次</div>`
                    cell.onclick = (function(r, c){
                        return function(){
                            arr[r][c]++
                            cell.innerHTML = `<div>(${i},${j})</div><div>点${arr[i][j]}次</div>`
                        }
                    })(i, j)
                    con.appendChild(cell)
                }
            }
        })()
    </script>
</body>
</html>

第四题

var name = "window";
var p = {
    name: "zhangsan",
    getName: function () {
        var self = this;
        return function () {
            return self.name;
        };
    },
};

var getName = p.getName();
var _name = getName();
console.log(_name);

第五题

function fun(n, o) {
    console.log(o);
    return {
        fun: function (m) {
            return fun(m, n);
        },
    };
}

var a = fun(0);
a.fun(1);
a.fun(2);
a.fun(3);

var b = fun(0).fun(1).fun(2).fun(3);

var c = fun(0).fun(1);
c.fun(2);
c.fun(3);

第六题

for (var i = 0; i < 5; i++) {
    setTimeout(() => console.log("1111", i), 0);
    (function (i) {
        setTimeout(() => console.log("2222", i), 0);
    })(i);
}

// let
for (let i = 0; i < 5; i++) {
    setTimeout(() => console.log("1111", i), 0);
    (function (i) {
        setTimeout(() => console.log("2222", i), 0);
    })(i);
}

第七题

// 用 call 实现 bind
Function.prototype.bind = function (obj) {
    var fun = this;
    var arr1 = Array.prototype.slice.call(arguments, 1);
    return function () {
        var arr2 = Array.prototype.slice.call(arguments);
        var arr = arr1.concat(arr2);
        fun.apply(obj, arr);
    };
};