2018驾考宝典面试总结

时间 2019-12-05

原文原文链接

你们好，我来自驾考宝典。时间不知不觉进入2018金九银十，下半年的尾声了，想必不少朋友已经看过网上新出的各大厂面试题。同时，我在驾考宝典也工做一年多了。驾考宝典算不上一线大公司，但我我的不论是经过工做，日常的积累，仍是自主学习，我以为仍是能和你们分享一些更加实战化的面试题。主要是工做当中运用的相关技术和遇到的坑，但愿以此共勉。css

Q: JS 部分html

一、什么是自执行函数，它的优势是什么？
!function(){}()被称为"自执行函数"，好处是把全部变量都运行在函数内部，能够避免产生全局变量，而"!"的做用是使它和上面的代码隔绝，不会受到其影响。前端

二、求1-100里7的倍数及包含7的全部数字，最后放置数组中面试

function calculate() {
        var arr = [];
        var reg = /7/;
        for (var i = 1; i <= 100; i++) {
            reg.test(i) || (i % 7 == 0) ? arr.push(i) : arr;
        }
        return arr;
}
console.log(calculate());

更精简版是?canvas

三、为何0.1 + 0.2 != 0.3
js没有float型没有int型浏览器解析小数时会转换成二进制而小数转换成二进制时 js就会失精度 0.1+0.2会得0.30000004后面无穷个小数因此正确的作法是 parseFloat((0.1 + 0.2).toFixed(10))数组

四、将数组进行排序，好比浏览器

var arr = [ { name : 'a', value: 21}, { name : 'b', value: 10}, { name : 'c', value: -1}, { name : 'd', value: 1}];

该怎么写；若用箭头函数输出，() => {} 和() => ()区别是什么，各将输出什么。
若是数组是这样性能优化

var arr = [5,20,40,15];

用箭头函数输出，() => {} 和() => ()，又各将输出什么。为何没有实现咱们想要的排序，该如何作。app

var demo = arr.sort((a,b) => (
    a - b
    )
);
console.log(demo);

若是是二维数组框架

var arr = [ [30, -5, 0, 5], [100, 50, 20], [1, 15, 10] ];

又该如何作。

for(var i = 0; i < arr.length; i++){
    arr[i].sort(function(a,b){
        return a - b;
    });
}
console.log(arr);

五、如何将这么一组数据

var arr = ["123@qq.cn","zhangsan@163.cn"];转化为<123@qq.cn>;<zhangsan@163.cn>

var str = '';
for (var j = 0; j < arr.length -1; j++) {
    str += '<' + arr[j] + '>' + ";"
}
str += '<' + arr[arr.length -1] + '>'
console.log(str);

六、使用js匹配相同的questionId，三个相同的变绿色，四个红色，并从新渲染至页面中。

var data = [{
            projectId: 3,
            questionId: 1124900
        },
        {
            projectId: 2,
            questionId: 1124900
        },
        {
            projectId: 1,
            questionId: 1124900
        },
        {
            projectId: 1,
            questionId: 1120900
        },
        {
            projectId: 3,
            questionId: 1119600
        },
        {
            projectId: 2,
            questionId: 1119600
        },
        {
            projectId: 3,
            questionId: 1119500
        },
        {
            projectId: 2,
            questionId: 1119500
        },
        {
            projectId: 1,
            questionId: 1119500
        },
        {
            projectId: 3,
            questionId: 836200
        },
        {
            projectId: 2,
            questionId: 836200
        },
        {
            projectId: 3,
            questionId: 836100
        },
        {
            projectId: 2,
            questionId: 836100
        }
    ]

var obj = {};
var newData = data.length;
for (var i = 0; i < newData; i++) {
    if (obj[data[i].questionId]) {
        obj[data[i].questionId] += 1;
    } else {
        obj[data[i].questionId] = 1;
    }
}

for (var i = 0; i < newData; i++) {
    for (var n in obj) {
        if (data[i].questionId == n && obj[n] == 4) {
           data[i].color = "red";
        } else if (data[i].questionId == n && obj[n] == 3) {
           data[i].color = "green";
        }
    }
}

var html = [];
html.push("<ul>")
for (var i = 0, len = data.length; i < len; i++) {
    html.push("<li id=" + data[i].projectId + " style='color: " + data[i].color + "'>" + data[i].questionId + "</li>");
}
html.push("</ul>")
var conDom = document.getElementById("xxx");
conDom.innerHTML = html.join("");

七、用最少的原生JS实现文字超出...显示。

var oBox = document.getElementById('box');
var demoHtml = oBox.innerHTML.slice(0, 10) + '...';
oBox.innerHTML = demoHtml;

八、如何将获取的数据，里面分别是1 2 3 … 十、102等，转化为对应的1、2、三…10、一百零二。

九、移动端常见的字数统计，不论是递增或递减，同时兼容pc端的复制、粘贴、撤销等操做，实时统计，以及支持移动端的emoji表情的统计，该如何实现。
用 input propertychange 事件

十、define和require有什么区别。
简言之，define定义模块，require加载模块，模块依赖声明是很重要的一步。

十一、dom咱们都知道，bom是什么。
BOM是浏览器对象模型，DOM是文档对象模型，前者是对浏览器自己进行操做，然后者是对浏览器（可当作容器）内的内容进行操做。好比window.open()。

十二、如何优雅地用原生JS实现textarea随着内容增多，高度自动增长。

1三、如何监听app自带的返回键，以及安卓机里物理返回键。产品须要前端编写一个h5，里面有若干audio或video，不与客户端交互。当用户点击app自带返回键，如何暂停正在播放的文件。并处理好广大安卓机的兼容性。

1四、将全部的html内容一键转化为图片，有实现的大概思路吗。html2canvas.js插件bug太多，是否有替代方案。

1五、支付宝里的芝麻信用，目前是静态的，如何实现让小白点随着对应的分数、文案从零跳转到对应的位置。

1六、移动端轮播图，好比swiper3.js（目前是4），实现的原理是什么。当swiper.js有兼容性问题时，是否有轻量级替代方案。

1七、iscroll.js的替代方案有哪些，优缺点是什么。

1八、中英文一键切换，前端该怎么实现。

1九、模板渲染引擎用过吗。和传统的拼接字符串相比，优缺点是什么。

20、判断JS数据类型有哪些方式，它们的区别是什么。

2一、什么是防抖和节流。

2二、延迟加载有哪些方式，什么是阻塞模式。

2三、JSON全称是什么，JSON.parse()和JSON.stringify()区别是什么。

2四、移动端点击穿透、滚动穿透是否了解，是否解决过。

2五、移动端点击延迟300ms，怎么处理。

2六、click和input的区别。实际应用场景，当用户点击input要改变type的类型，你会如何处理。

2七、$(document).on(“click”,function(){})和$(document).on(“click”,”.xxx”,function(){})区别。

2八、jQ的on、bind、live、delegate各有什么异同。

2九、移动端和PC端jQ版本的选择，是否有差别，若是有，对应的规范、缘由是什么。

30、雅虎军规35条（前端性能优化）。

3一、什么是回流和重绘。

3二、let和var的区别。

3三、原生js实现图片上传，有哪些注意事项。

布局和css、框架暂时就不问了，此次先和各位分享到这，都是本人日常工做当中的部分积累，和各位高大上的面试题比起来，不值一提，喜欢的朋友能够收藏下。欢迎在评论区补充更多实用的坑。我会持续更新，各位下次见～