记人生的第一次面试 ,面字节跳动的感觉 | 掘金技术征文

1,985 阅读2分钟

导言

首先 ,我是一名大三学生 , 在大二暑假开始接触前端 , 想不到自己人生的第一次面试 就去面字节跳动。 哎 , 总体来说 , 感觉面试官不按套路出牌呀。说好的每面都有算法题的呢?怎么不问我呀

题目

  1. 首先, 我先来了一段平常的自我介绍.亏我自我介绍都准备一些(哎)

  2. 从 输入 ULR 到 页面渲染发生了什么 ?
    这个还是常规操作,

    • DNS解析
    • 三次握手 ,四次挥手
    • TLS 是什么样的流程
    • http => https
    • HTML ,CSS 解析
  3. 接下来, 便问的比较 不按套路出牌啦。

这个时候问了我一个题目 , 好像是 和 回流有关:

DomA.style.width = DomA.offsetWidth + 1 + 'px'
DomB.style.width = DomA.offsetWidth + 1 + 'px'
DomC.style.width = DomA.offsetWidth + 1 + 'px'

会触发几次回流 ?

我弱弱的说 , 应该是三次吧 , 既然节点大小重新改变了, 哈哈哈, 不确定。

然后又来

DomA.style.width = 1px;
DomB.style.width = 1px;
DomC.style.width = 1px;

又会触发几次回流呢 ?

哎 , 感觉平时都没有关注这些 , 都说是会触发三次

  1. 这个时候面试官叫我写一些常用的 数组的一些方法 我写了
  • push
  • pop
  • map
  • reduce
  • reduceRight
  • sort
  • forEach
  • filter

然后问了一下 map 的使用方法 , 然后叫我 能不能自己写 一个 map 呢?

额 , 手写 map? 我怎么就没有看到一个 面经要求手写 map 的 , 可能是因为比较简单 , 反而没有去过多的关注, 但只要我冷静一点应该可以写出来呀。

事后想了一下 , 大概是这样的

Array.prototype.mymap = function(callback) {
    let res = [];
    for(let i = 0 ; i < this.length ; i ++) {
        let value = this[i];
        let index = i;
        res[i] = callback(value , index);
    }
    return res;
}
  1. 最后这个题目 , 我前两天都还看到过 , 当时由于不是很理解 , 大概看了一下 , 结果问了 , 不出意外的没有做出来
    题目是这样的 :
出现的原因是 :
由于 Promise.all 虽然会并发上传 , 但是并不能控制并发上传的数量限制 , 所以要加一下这个功能
/**
urls : 图片url的数组,
limit : 最大并发数
handler : 所以图片请求完成后的回调函数
*/
function limitLoad(urls, handler, limit) {
    // 对数组做一个拷贝
    const sequence = [].concat(urls)
    let promises = [];

    //并发请求到最大数
    promises = sequence.splice(0, limit).map((url, index) => {
        // 这里返回的 index 是任务在 promises 的脚标,
        //用于在 Promise.race 之后找到完成的任务脚标
        return handler(url).then(() => {
            return index
        });
    });

    (async function loop() {
        let p = Promise.race(promises);
        for (let i = 0; i < sequence.length; i++) {
            p = p.then((res) => {
                promises[res] = handler(sequence[i]).then(() => {
                    return res
                });
                return Promise.race(promises)
            })
        }
    })()
}

好吧 , 之前我就遇到过 , 但是别人的答案 , 我怎么就是不太理解呢? 看不懂 , 所以结果可想而知

  1. 最后一个还是正常题目 让我将一下平时 跨域的方式
  • JSONP 随便说一下 JSONP 跨域的原理
  • CORS 设置 CORS 的头部字段
  • websocket

总结

根本原因肯定是代码写少了。
还是不吐槽了吧