2021年字节跳动暑期实习一面

1. 为什么选择前端
2. 平时是怎么学习前端的
3. js的函数事件绑定
   只回答了addEventListener，然后面试官提醒说还有onclick这种。
   DOM0级事件绑定，如onclick，DOM1级事件绑定addEventListener
4. addEventListener中的三个参数分别代表什么意思
   我就说了前两个参数，不知道第三个参数代表啥，去翻了翻才知道第三个参数false和true，分别代表冒泡时处理和捕获时处理
5. js函数中this的指向
   这个回答得不是很好，特意去翻了翻总结

• 下面是对不同类型的函数调用this指向一些总结：

  • 使用new关键字调用:this指向由函数的内部[[Construct]]方法创建的新实例对象。this(新创建的实例对象)通常在默认情况下返回，除了在函数定义中显式指定了不同的返回值。

  • 不使用new关键字直接调用:在非严格模式下，this指向window对象(浏览器中)。然而，在严格模式下，this值为undefined;因此，试图访问或设置此属性将引发错误。
    间接使用绑定对象调用：Function.prototype对象提供了三种方法，可以在调用函数时将函数绑定到任意对象，即：call()，apply()和bind()。 使用这些方法调用函数时，this指向指定的绑定对象。

  • 作为对象方法调用：this指向调用函数（方法）的对象，无论该方法是被定义为对象的自己的属性还是从对象的原型链中解析。

  • 作为事件处理程序调用:对于用作DOM事件侦听器的常规函数，this指向触发事件的目标对象、DOM元素、document或window 。

6. 如果有10个promise，怎么等这10个promise都执行完后再返回结果
   可以用Promise.all
7. 实现一下Promise.all
   实现的过程磕磕绊绊，因为对于这种直接传promise的我之前没有碰过，不清楚到底传进来的是什么

function allPromises(promises){
    let len = promises.length();
    let res = [];
    let flag = true;
    promises.forEach((promise) => {
        promise.then((r) => {
            res.push(r);
            if(res.length == len) return res;
        });
    })  
}

8. 如果进程中只允许3个promise同时执行，怎么办
   这个没回答出来，但是二面的时候面试官直接给了基本代码，要求实现只允许一个promise执行
9. flex-basis的用法
   这个刚好之前看过了，所以吧啦吧啦地说完，面试官也挺满意的。
10. JWT的构成和使用，和cookie的区别
    也是看过了，但是不是特别熟悉，介绍了基本情况，面试官也没有细问。
11. xss和csrf
    面试高频问题，也是准备好了回答。
12. 计算数组的深度

function getDepth(arr) {}
var arr = [1, [2, [3, [4]]], [5, 6], 7, [8, 9]];
var depth = getDepth(arr);
console.log(depth); // 4

遍历数组中的每一项，如果这个值是数组类型，那么递归调用getDepth，并将返回的值加1与最大深度做比较，如果大于最大深度，那么把它赋值给最大深度。

function getDepth(arr) {
    if(arr instanceof Array !== true) return 0;
    let maxDepth = 1;
    for(let i=0; i maxDepth) maxDepth = getDepth(arr[i])+1;
        }
    }
    return maxDepth;
}