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)); 
2 alert(typeof(undefined)); 
3 alert(typeof(NaN)); 
// object
// undefined
// number

2.

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

3.

 1 var x =1 ;y=0;z=0;
 2 var add = function(x){
 3     return x=x+1;
 4 }
 5 y=add(x);
 6 function add(x){
 7     return x=x+2;
 8 }
 9 z=add(x);
10 console.log(x);
11 console.log(y);
12 console.log(z);

4.

1 for(var i = 0; i < 3;i++){
2     (function(){
3         setTimeout(function(){
4            console.log(i);
5         },0)
6     })()
7 }
// 3 输出三次
1 for(var i = 0; i < 10; i++) {
2     (function(e) {
3         setTimeout(function() {
4             console.log(e);  
5         }, 1000);
6     })(i);
7 }
// 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。

原文地址:https://www.cnblogs.com/paxster/p/9398711.html