2018面试总结第二轮

爱奇艺

---

 

一面：考察基本技能情况。FIS打包原理，webpack模块打包，weex和react native等混合开发方式，考察关于内嵌的APP h5考察较多。平时对GitHub社区的贡献情况。在koa外面封装一层akb框架是为了什么;最后一题用vue实现轮播图。面试时间大概一个多小时。

二面：二面面试官是阿里过来的，问的细节很细。主要是问答题目，LS缓存技术使用，神马搜索用来缓存页面片段，和UC有较多技术合作；建议多在GitHub上贡献代码，提PR，把平时的项目放在开源社区，而不是罗列简单的网站；数组去重；ES6常用功能并讲讲怎么使用的（let,const,箭头函数,array,promise,module,ascny/await等）。问了很多平时会用到的技术，掌握熟悉因而随机应变；面试时间约一个小时。

三面：技术经理。问了离职的原因和对自己的未来职业规划。聊了大约20分钟。

四面：影业部门VP。主要了解候选人的情况，走个过场。大约15分钟。

五面：hr面试，聊了下现在的具体情况。离职原因：1.部门技术封闭 2.晋升机制排队 3.薪资。福利：14薪，按照季度发。

 

快手

---

 

一面面试题

1.

1 alert(typeof(null)); 
alert(typeof(undefined)); 
alert(typeof(NaN)); 
// object 
// undefined
// number

2.

1 var str=”12345f”;
alert(str+1);
alert(1+2+’3’+4);
// "12345f1"
// 334  string

3.

 1 var x =1 ;y=0;z=0;
var add = function(x){
    return x=x+1;
}
y=add(x);
function add(x){
    return x=x+2;
}
z=add(x);
console.log(x);
console.log(y);
console.log(z);

4.

1 for(var i = 0; i < 3;i++){
    (function(){
        setTimeout(function(){
           console.log(i);
        },0)
    })()
}
// 3 输出三次

1 for(var i = 0; i < 10; i++) {
    (function(e) {
        setTimeout(function() {
            console.log(e);  
        }, 1000);
    })(i);
}
// 0,1,2,3,4,5,6,7,8,9 正确

 解读

5.三种以上方法实现数组去重

function dedupe(array){
    return Array.from(new Set(array));
}

dedupe([1,1,2,3]) //[1,2,3]

 

let arr = [1,2,3,3];
let resultarr = [...new Set(arr)];   
console.log(resultarr);  //[1,2,3]

 

Array.prototype.distinct = function (){
    var arr = this,
        ret = [];

    arr.forEach(function(e, i, array) {
        if (array.indexOf(e) === i) {
            ret.push(e);
        }
    });

    return ret;
};

var a = [1,2,3,4,5,6,5,3,2,4,56,4,1,2,1,1,1,1,1,1,];
var b = a.distinct();
console.log(b.toString()); //1,2,3,4,5,6,56

 

Array.prototype.distinct = function (){
    var arr = this,
        result = [],
        len = arr.length;

    arr.forEach(function(v, i ,arr){        //这里利用map，filter方法也可以实现
        var bool =  arr.indexOf(v,i+1);        //从传入参数的下一个索引值开始寻找是否存在重复
        if(bool === -1){
            result.push(v);
        }
    })

    return result;
};

var a = [1,1,1,1,1,1,1,1,1,2,2,2,2,2,2,3,3,3,3,3,3,3,2,3,3,2,2,1,23,1,23,2,3,2,3,2,3];
var b = a.distinct();
console.log(b.toString());    //1,23,2,3

 

Array.prototype.distinct = function (){
    var arr = this,
        i,
        obj = {},
        result = [],
        len = arr.length;

    for(i = 0; i< arr.length; i++){
        if(!obj[arr[i]]){    //如果能查找到，证明数组元素重复了
            obj[arr[i]] = 1;
            result.push(arr[i]);
        }
    }
    return result;
};

var a = [1,2,3,4,5,6,5,3,2,4,56,4,1,2,1,1,1,1,1,1,];
var b = a.distinct();
console.log(b.toString()); //1,2,3,4,5,6,56

 

解读

6.console.log({}==!{});

// false

7.Debounce 和 Throttle 的原理是什么？并用代码实现

/**
 *
 * @param func {Function}   实际要执行的函数
 * @param wait {Number}  延迟时间，单位是毫秒（ms）
 * @param wait {Boolean}  一定时间内，先执行／后执行
 * 
 * @return {Function}     返回一个“去抖”了的函数
 */

var debounce = function(func, wait, immediate) {
    // 设置定时器
    let timeout;
    return (...args) => {
        const later = () => {
            timeout = null;
            if (!immediate) func.apply(this, args);
        };
        const callNow = immediate && !timeout;
        // 进入先清除定时器 
        claerTimeout(timeout);
        // 重新设置一个定时器，如果没有连续触发函数，就执行定时器，也是就是核心原理
        timeout = setTimeout(later, wait);
        if (callNow) 
            func.apply(this, args);
    }
}；
window.addEventListener('resize',debounce(function(){ console.log(1); },1000,true));

/**
*
* @param fn {Function}   实际要执行的函数
* @param delay {Number}  执行间隔，单位是毫秒（ms）
*
* @return {Function}     返回一个“节流”函数
*/

function throttle(fn, threshhold) {

  // 记录上次执行的时间
  var last

  // 定时器
  var timer

  // 默认间隔为 250ms
  threshhold || (threshhold = 250)

  // 返回的函数，每过 threshhold 毫秒就执行一次 fn 函数
  return function () {

    // 保存函数调用时的上下文和参数，传递给 fn
    var context = this
    var args = arguments

    var now = +new Date()

    // 如果距离上次执行 fn 函数的时间小于 threshhold，那么就放弃
    // 执行 fn，并重新计时
    if (last && now < last + threshhold) {
      clearTimeout(timer)

      // 保证在当前时间区间结束后，再执行一次 fn
      timer = setTimeout(function () {
        last = now
        fn.apply(context, args)
      }, threshhold)

    // 在时间区间的最开始和到达指定间隔的时候执行一次 fn
    } else {
      last = now
      fn.apply(context, args)
    }
  }
}

答案

8.正则表达式限制文本框只能输入数字和小数点(二位小数点)

obj.value = obj.value.replace(/[^\d\.]/g,'');   
//必须保证第一个为数字而不是.   
obj.value = obj.value.replace(/^\./g,'');   
//保证只有出现一个.而没有多个.   
obj.value = obj.value.replace(/\.{2,}/g,'.'); 

 

9.纯css实现单行居中，两行居左，超过两行省略（dom结构自定）

<h2><p>单行居中，多行居左</p></h2>

p {
    display: inline-block;
    text-align: left;
    display: -webkit-box; // 设置display，将对象作为弹性伸缩盒子模型显示
    -webkit-line-clamp: 2; // 限制在一个块元素显示的文本的行数
    -webkit-box-orient: vertical; // 规定框的子元素应该被水平或垂直排列
}
h2{
    text-align: center;
}
// 利用 inline-block 元素可以被父级 text-align:center 居中的特性

 

// -webkit-line-clamp

10.下面这个图形，只使用一个标签，可以有多少种实现方式：

 

• border-left
• border-image
• box-shadow  内外阴影box-shadow:-5px 0px 0 0 deeppink;
• background-image 
• 伪类
• outline:5px solid deeppink;
• 渐变

答案

11.active-class是哪个组件的属性？嵌套路由怎么定义？

router-Link;

{
      path: '/me',
      name: 'Me',
      component: Me,
      children: [
        {
          path: 'collection',
          name: 'Collection',
          component: Collection
        },
        {
          path: 'trace',
          name: 'Trace',
          component: Trace
        }
      ]
}

 

12.说出至少4种vue当中的指令和它的用法？

v-model 和 v-show,v-html,v-text,v-on,v-bind,v-for,v-if

官方文档

13.vuex有哪几种属性？

state => 基本数据 
getters => 从基本数据派生的数据 
mutations => 提交更改数据的方法，同步！ 
actions => 像一个装饰器，包裹mutations，使之可以异步。 
modules => 模块化Vuex

 

快手二面

vue组件的依赖管理是如何实现的。

双向绑定的定义和实现原理。

vue指令，如何写自定义指令。

node的require的原理，资源如何引入的，node的单线程和多进程的关系。

vue的生命周期。

如何实现多个页面渲染时间的统计（pv和渲染耗时）

算出一个数组元素最后一次出现的位置，时间复杂度和空间复杂度。

如何实现一个暂停函数，1分钟后再执行后续的逻辑，不能用定时器。

面试官还真的是要看脸缘~~~

 

阿里云（待定）

---

 一面：谈谈自己使用的项目，讲解了很长时间的项目；具体讲解URL访问的整体流程（访问流程，DOM和render进程等）；事件机制；SSR。

 

搜狗

---

 一面：一面面试官是搜索VP，聊了百度大搜的整体的技术架构，还是很愉快的，约一个小时。

二面：二面是HR面，面的比较随意，约半个小时。

三面：三面试技术小组长，约一个小时。还算凑合。

挂了的原因可能是要的太多，可能是学校比较渣, 非985，挂的莫名其妙。

 

美团外卖（GG）

---

 一面：实现Vue的事件通信机制；实现Vue的双向绑定；当用户频繁点击页面出现弹窗的时候如何优化性能（各种***钻角度提问）。代码里如何鉴别是ajax请求（有方法判断我吃翔）。在电脑上实践代码，面试官口述表达偶尔不清，意思理解错误。Done。

 

美团新零售（待定，对hr一脸懵逼）

---

 

一面：问了问项目经验和相关技术。三个常见题目（1.找到数组中最后一次出现的index 2.实现一个url获取参数函数，需要对字符串，数字，URL，null等做单独处理 3.从左到右，从上到下元素递增的二维数组，找出指定元素，如何更快）。

 

映客直播（23k，放弃）

---

 

一面：四页面试题，基本都是常规题目，讲了讲百度的检索机制，题目基本也过了一遍。感觉良好

二面：面试官特别装逼，是映客的前端负责人，主要问的几个常见的问题（vue的双向绑定原理；数组如何使用不会更新视图；继承里面的各种__proto__和构造函数，对原型链的继承要很熟悉；webpack/fis的实现原理，以及常见的配置项。）

三面: 整体技术负责人，谈了谈面包，感觉一般般。

hr: HR给人感觉很强势，不想给很高的价。不推荐映客直播！！！

 

滴滴外卖（GG）

---

 一面：CSS选择器权重，具体情境很特殊；变量提升和作用域，也是各种复杂嵌套；LeetCode算法题三道。Done。

 

__EOF__

本文作者：Paxster
本文链接：https://www.cnblogs.com/paxster/p/9398711.html
关于博主：评论和私信会在第一时间回复。或者直接私信我。
版权声明：本博客所有文章除特别声明外，均采用 BY-NC-SA 许可协议。转载请注明出处！
声援博主：如果您觉得文章对您有帮助，可以点击文章右下角【推荐】一下。您的鼓励是博主的最大动力！