js 面试题

一时失言乱红尘 2021-09-20 13:26 277阅读 0赞

1：toString

这里非常巧妙的用到了toString()

对与普通的Number，Array,Boolean, 用toString是转化为字符串，但是object.prototype.toString中的toString是

返回当前方法执行执行的主体（方法中的this）所属类的详细信息即"\[object Object\]",其中第一个object代表当前实例是对象数据类型的(这个是固定死的)，第二个Object代表的是this所属的类是Object。

看实例化这句：

var b1 = new B()

里面存在一个原型链：b1.\_\_proto\_\_ ==B.prototype.\_\_proto\_\_==Objec.prototype

所以最后b1.toString 实际上是 Objec.prototype.toString

B.prototype = new A();
    var b2 = new B();
    console.log(b2.toString());  // b

2：call apply

// call和apply(数组)
    function AA() {
        this.name = "a";
        this.say = function () {
            console.log("my name is" +" "+ this.name)
        }
    }
    function BB() {
        this.name = "b";
    }
    var aa = new AA();
    var bb = new BB();
        aa.say.apply(bb); // my name is bb
    
        // bb调用aa的方法

3：定时器  异步事件

// 每隔一秒弹框，五秒结束弹框
        var id = setInterval(function () {
            alert("123")
        }, 1000)
        setTimeout(function () {
            clearInterval(id)
        }, 5000)

4： 匿名函数，闭包，let解决作用域问题

首先创建一个input:document.createElement

设置自定义属性：setAttribute(类型) setAttribute(值)

将自定义属性创建的元素添加到页面 documrnt.body.appendChild（）

难点是点击按钮，弹出数字。由于for循环(同步)和点击事件(异步)，js的执行机制是，先执行执行栈里面的同步事件，再执行任务队列的异步代码，这个时候，q已经是，所以永远弹出的是，不可能是每个按钮对应的值。这个时候，用闭包就爽歪歪

使用闭包以后：就可以访问函数内部的变量 也就是点击函数形参，可以是for循环的实参

//使用js代码 ，为页面动态添加5个按钮，button1，button2,button3...
        // 单击每个按钮，分别弹出1 2 3 4 5
        for (var q = 0; q < 5; q++) {
            var input = document.createElement("input");
            input.setAttribute("type", "button");
            input.setAttribute("value", "button" + q);
            (function (n) {
                input.onclick = function () {
                    alert(n)
                }
            })(q)
            document.body.appendChild(input);
    
        }

另外一种简单的方法：

将var 变为let

for (let q = 0; q < 5; q++) {
            var input = document.createElement("input");
            input.setAttribute("type", "button");
            input.setAttribute("value", "button" + q);
                input.onclick = function () {
                    alert(q)
                }
            document.body.appendChild(input);
    
        }

let是es6引入的，用他声明的变量代表块级作用域。变量只要在\{\}，内部的函数都可以同步访问。你可能会好奇

js机制怎么被一个块级作用域给解决了？其实闭包又何尝不是，在整个函数体内，所以函数都可以同时访问变量，不存在同步异步。这里需要指出：

一个是同步任务和异步任务的优先顺序

一个是同步任务和异步任务的执行时间

5： 数组方法的使用 转为驼峰

// 已经有一个字符串
        //foo = "get-element-by-id"； 转化为驼峰表示法 getElementById
        var foo = "get-element-by-id"
        var arr = foo.split("-");
        console.log(arr); //["get", "element", "by", "id"]
        // charAt(n) //返回字符串中的第几个字符串，从0开始
        for (var i = 1; i < arr.length; i++) { //注意这里的i从1开始，是因为转化为驼峰表达式，第一个单词字母开头小写
            // arr[i].charAt(0).toUpperCase() 返回大写字母  E  B  I
            // arr[i].slice(1) +(拼接) splice分割，除了第一个字母(大写)  lement  y， d
            arr[i] = arr[i].charAt(0).toUpperCase() + arr[i].slice(1);
    //现在的结果是：字符串数组：["get", "Element", "By", "Id"]
        }
        // 想要变为字符串，用join()
        var arr = arr.join("");//里面什么也不写 get,Element,By,Id.join("") 中间什么也没有，返回我们要的结果
        console.log(arr); //getElementById

6： 数组倒排，升序 降序

// 数组倒排
        var numberArray = [5, 1, 4, 2, 6, 3];
        var arr3 = [];
        // 将numberArray的长度作为下标放入数组，最大肯定是length-1，但是总的数量不变，所以i要=0
        for (var i = numberArray.length - 1; i >= 0; i--) {
            arr3.push(numberArray[i]);
        }
        console.log(arr3);
        // 数组降序
        var number = [5, 1, 4, 2, 6, 3];
    
        for (var m = 0; m < number.length - 1; m++) {
            for (var n = 0; n < number.length - 1 - m; n++) {
                if (number[n] > number[n + 1]) {
                    var temp = number[n];
                    number[n] = number[n + 1];
                    number[n + 1] = temp;
                }
            }
        }
        console.log(number);//[1, 2, 3, 4, 5, 6]
        // 改变if里面的判断条件 ，就是降序
        // if(number[n]<number[n+1])

7：输出日期

//输出今天的日期，以yyy-mm-dd的方式，比如2019年6月28日输出2019-06-28
        var d = new Date();
        console.log(d);
        var year = d.getFullYear();
        console.log(year)
        var month = d.getMonth() + 1;  //比较特殊  0-11
        month = month < 10 ? '0' + month : month;
        console.log(month);
        var day = d.getDate();
        day = day < 10 ? "0" + day : day;
        console.log(day);
        alert(year + '-' + month + '-' + day)

8：数组去重

9：闭包

**下面这个** **ul****，如何点击每一列的时候** **alert** **其** **index?****（闭包）**