资讯专栏INFORMATION COLUMN

web前端面试题一

bergwhite / 1558人阅读

摘要:需求一个输入框,用户输入时有联想搜索,每次用户输入都会触发请求,过多的请求会造成服务器的压力,如何去解决这个问题请求函数面试者延迟发送可以去解决这样的问题。

写在前面的话
一般来说,面试质量的高低很大程度影响公司是否想接受改人才,也影响了人才是否愿意去公司。质量高的面试,公司能表明对人才的要求,个人也能表明所期待的公司是一个什么模式的公司。最终会有利于双向选择的过程。能尽早的把问题暴露在面试过程中,而不会人才进入公司后。

公司和个人都会根据技术面试的情况去给个人和公司一个总体技术评价,直接影响最终的面试结果。如何能用几个技术面试题来判断面试者的知识储备是一个很值得探讨的问题。好的面试题能引导面试者,而不是故意去为难面试者,在解决问题的过程体现其思考方向。目前,web前端面试题,部分公司准备和个人准备都存在一定的问题,这几个问题,导致面试质量不高。本文旨在思考如何能提高web前端面试题的质量。

面试题常见问题
一.准备不足
个人在面试之前一定要有充足的准备,包括公司的业务,技术,发展方向。
面试官也要对面试者的项目有一定了解,面试题也应该有一个思考。

二.面试题来源
面试官常常会从网上搜面试题,模仿面试题。往往这些面试题和自己想招的人才所需的技术储备还是存在一定差距。

var name = "java"
var obj = {
    name: "javascript",
    func: function() {
        return this.name;
    }
};
console.log(name);
console.log(obj.func());
var newFunc = obj.func;
console.log(newFunc());

网上存在大量这样的面试题,请问这样的面试题能考验出来人才什么技能,什么思维方式?在没思考清楚这两个问题之前,无需拿此题去跟面试者谈论。

面试题
好的面试题应该能考查思维方式和技术能力,本文会持续分享这样的面试题。方式主要以对话的方式。

需求:一个输入框,用户输入时有联想搜索,每次用户输入都会触发请求,过多的请求会造成服务器的压力,如何去解决这个问题?

function ajax() {
    ...   //请求函数
}

面试者:延迟发送可以去解决这样的问题。

面试官:这是常见的解决方法,请写出代码。

var timer = 0;
$("input").on("change", function(){
    clearTimeout(timer);
    timer = setTimeout(function(){
        ajax()
    }, 1000)
});

面试官:这样是正确的,可以解决问题。但是全局变量timer不好,throttle与输入处理函数耦合在一起,能提取一个公共函数出来吗?

面试者:我想想。

面试官:试试闭包?timer作为一个自执行函数的变量?

面试者:我试试。

var delay = (function(){
    var timer = 0;
    return function(fn, time) {
        clearTimeout(timer);
        timer = setTimeout(fn, time)
    }
})();
$("input").on("change", function(){
    delay(function() {
        ajax()
    }, 1000);
});

面试官:问题基本解决了,但是页面上如果有两个这样的输入框,分别对应不同的联想搜索,输入框一输入完成之后马上在输入框二输入,有什么Bug吗?

面试者:输入框一没有发送请求吗?

面试官:是的!造成这个问题的原因是什么?怎么去解决这个问题?

面试者:原因是公用了timer。解决这个问题需要把timer分开。

var delay = function(){
    var timer = 0;
    return function(fn, time) {
        clearTimeout(timer);
        timer = setTimeout(fn, time)
    }
};
var deday1 = delay();
var delay2 = delay();

面试官:OK,问题解决了!lodash的throttle可以很好的解决这些问题。

面试官:如果不考虑性能,不允许使用clearTimeout,如何去解决这个问题呢?

面试者:...

面试官:不能用clearTimeout,也就是说每次setTimeout都必然执行。执不执行fn回调函数与setTimeout并没有直接关系,是不是可以考虑之前的定时器不去执行fn回调函数呢?只有最后一次执行fn回调函数。

面试者:我有思路了!

......

解决的方法有很多,就不给出代码了。

该面试题的小结:

考查了解决这样异步问题的方案好解决问题的思路。

对闭包的理解和高阶函数的理解。比直接问是否理解闭包,是不是更清晰呢?

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/81207.html

相关文章

  • 第九讲 软件测试面试题一

    1、软件测试的流程是什么? 答: 1)熟悉需求 2)制定测试计划 3)设计测试(分析与编写测试用例) 4)执行测试,记录测试结果 5)记录缺陷,通过《缺陷报告》记录,跟踪管理缺陷 6)测试总结(总结报告) 2、测试用例主要有哪些元素 答: 编号 缺陷的名称 缺陷的优先级 缺陷的等级 缺陷的复现步骤 3、软件测试有什么策略和阶段 答: 策略:动态测试、静态测试、白盒测试、黑盒测试 测试阶段按研发顺序...

    JouyPub 评论0 收藏0
  • 面试篇】2017腾讯IMWeb前端秋招特训营思考题

    摘要:月日思考题题一站点是否应该出现在标签中题二是否应该支持面试题什么是盒子模型答标准盒和怪异盒简述和的区别答从外部引入资源,将页面导向外部资源简述同步和异步的区别答同步当前进程执行完后,下一个进程才能执行异步当前进程的执行不影响下一个进程的执行 7月12日 思考题 题一:站点Logo是否应该出现在标签中? 题二:是否应该支持IE6? 面试题 什么是盒子模型?答:margin,bord...

    darkerXi 评论0 收藏0
  • 面试篇】2017腾讯IMWeb前端秋招特训营思考题

    摘要:月日思考题题一站点是否应该出现在标签中题二是否应该支持面试题什么是盒子模型答标准盒和怪异盒简述和的区别答从外部引入资源,将页面导向外部资源简述同步和异步的区别答同步当前进程执行完后,下一个进程才能执行异步当前进程的执行不影响下一个进程的执行 7月12日 思考题 题一:站点Logo是否应该出现在标签中? 题二:是否应该支持IE6? 面试题 什么是盒子模型?答:margin,bord...

    littlelightss 评论0 收藏0
  • 面试篇】2017腾讯IMWeb前端秋招特训营思考题

    摘要:月日思考题题一站点是否应该出现在标签中题二是否应该支持面试题什么是盒子模型答标准盒和怪异盒简述和的区别答从外部引入资源,将页面导向外部资源简述同步和异步的区别答同步当前进程执行完后,下一个进程才能执行异步当前进程的执行不影响下一个进程的执行 7月12日 思考题 题一:站点Logo是否应该出现在标签中? 题二:是否应该支持IE6? 面试题 什么是盒子模型?答:margin,bord...

    Keven 评论0 收藏0
  • 我的前端面试

    摘要:前言这次找工作也面了好几家公司,也通过了好几家公司的面试,毕竟之前也准备了一段时间,所以面试的时候心里也不是很虚。的代码分割怎么实现的说说刚才提到的和的区别前端缓存怎么实现扯扯强缓存和协商缓存,重点问了如何实现缓存二面就聊了项目。。。 前言 这次找工作也面了好几家公司,也通过了好几家公司的面试,毕竟之前也准备了一段时间,所以面试的时候心里也不是很虚。 这里记录一下面试过程中被问到的问题...

    meteor199 评论0 收藏0

发表评论

0条评论

bergwhite

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<