大搜车面试总结

面试总结

工做久了有时候也须要出去看看。

前几天大搜车的hr约了面试，就记录一下关于此次面试的具体内容。

1、笔试

先填写了我的信息，第一步就是笔试。

• 哪一种盒模型包含padding
• header中哪一种标记不影响文件的缓存(age, etag, last-modify,cache-control)
• 设计一个tree组件，使用react、或者vue。可无限嵌套，最大程度的去适应各类需求。给出大体思路，参数、回调函数、事件。
• 使一个div宽度100px;高100px;居中至少三种方式(不考虑浏览器兼容)
• 说出你在过去项目中最满意的一部分。
• 存在字符串a、b。找出a是否包含在b中，若是包含多个返回第一个位置，没有包含则返回-1.如:a='123' b='4512356123' 则返回2。不能使用indexOf、substr等。
• 设计一个plus函数、实现plus(1)(2)()=三、plus(1)(2)(3)()=6。

题目大体是这样的。细节部分可能有误差，可是大致的意思是这样的。针对笔试部分后两个函数我写了挺久、只完成了字符串部分，后面手写确实有点难(多是我太菜了吧)
如下是我回去后给出的答案

1. 哪一种盒模型包含padding。

主要分为两种盒模型。标准盒模型、和IE盒模型。

就如图上表示的，IE模型中width包含了content+padding+border。标准模型中width只包含content。开发者能够显示的用box-sizing去设置想要的盒模型。

2.header中哪一种标记不影响文件的缓存(age, etag, last-modify,cache-control)。
age：请求头中的age表明的意思是当代理服务器用本身缓存的实体去响应请求时，用该头部代表该实体从产生到如今通过多长时间了。etag:web服务器响应请求时，告诉浏览器当前资源在服务器的惟一标识（生成规则由服务器以为）。Apache中，ETag的值，默认是对文件的索引节（INode），大小（Size）和最后修改时间（MTime）进行Hash后获得的。Last-Modified：标示这个响应资源的最后修改时间。web服务器在响应请求时，告诉浏览器资源的最后修改时间。Cache-Control与Expires的做用一致，都是指明当前资源的有效期，控制浏览器是否直接从浏览器缓存取数据仍是从新发请求到服务器取数据。只不过Cache-Control的选择更多，设置更细致，若是同时设置的话，其优先级高于Expires。

3.设计一个tree组件，使用react、或者vue。可无限嵌套，最大程度的去适应各类需求。给出大体思路，参数、回调函数、事件。
这部分我是根据本身开发的经验去写的，纯粹是我的经验。我使用Vue采用Vue提供的slot去作嵌套，这样提升了组件适应的不一样需求的能力。采用emit去触发事件，在tree组件注册相应的事件来达到交互的目的。

回答的不够好，仅提供参考

4.使一个宽度100px高100px的div横向居中至少三种方式(不考虑浏览器兼容)

.box{ position:absolute;left: 50%;trasition: translate(-50%, 0) };

.box{ position:absolute;left: 50%;margin-left: -50px; }

.box{ position: absolute;margin: 0 auto; }

5.说出你在过去项目中最满意的一部分。
是作了一个vue-barrel插件，是UI布局更加美观。详情能够查看个人一篇文章木桶插件。

6.存在字符串a、b。找出a是否包含在b中，若是包含多个返回第一个位置，没有包含则返回-1.如:a='123' b='4512356123' 则返回2。不能使用indexOf、substr等。
这是我本身的代码，多是面试比较紧张吧，一时没想起来最优的方案，这个复杂度较高，暴力查找.

function findStr(a, b){
    let tmpA = a.split('');
    let tmpB = b.split('');
    let lastIndex = -1;
    let lengthA = tmpA.length;
    let lengthB = tmpB.length;
    
    for( let i = 0; i< lengthB; i++ ){
        let tag = true;
        for( let j =0; j<lengthA; j++ ){
            if( tmpB[i+j] !== tmpA[j] ){
                tag = false;
                break;
            }
        }
        
        if( tag ){
            lastIndex = lastIndex > -1 ?  lastIndex : i;
            break;
        }
    }
    
    return lastIndex;
}

7.设计一个plus函数、实现plus(1)(2)()=三、plus(1)(2)(3)()=6。

这部分我当时没有答出来，当时只是模糊的记得柯里化函数，没能手写出来。

function plus() {

    if (arguments.length === 0) {

        let sum = 0;

        plus.list.forEach((item) => {

            sum += item;

        })

        plus.list = [];

        return sum;

    } else {

        plus.list = plus.list ? plus.list:[];

        plus.list = plus.list.concat(Array.prototype.slice.call(arguments, 0));

        return plus;

    }

}

二面详情我会再整理