2021前端面试题（附答案）.pdf

2021前端⾯试题 （附答案） css部分 什么是盒⼦模型 盒⼦模型分为ie盒⼦模型和w3c盒⼦模型 ie盒⼦模型width=co te t+paddi g+border box-sizi g:border-box w3c标准盒⼦模型width=co te t box-sizi g:co te t-box 使盒⼦⽔平垂直居中 1. positio ：absolute；left ：50% ；top：50% ；tra sform：tra slate(-50%,-50%) 2. flex布局 ：display:flex ；alig -items:ce ter；j ustify-co te t ：ce ter； 优雅降级 ⼀开始就构建站点的完整功能，然后针对浏览器测试和修复。⽐如⼀开始使⽤ CSS3 的特性构建了⼀个应⽤，然后逐步针对各⼤浏览器进 ⾏ hack 使其可以在低版本浏览器上正常浏览。 渐进增强 ⼀开始就针对低版本浏览器进⾏构建页⾯，完成基本的功能，然后再针对⾼级浏览器进⾏效果、交互、追加功能达到更好的体验。 js问题 js的基本数据类型 Number、Stri g、Boolea 、Null、u defi ed、symbol、bigI t 判断⼀个对象属于某⼀类 Obj totype.toStri g.call() Bind，call，apply的区别是什么？ 三者都是⽤来改变this的指向的 传参的⽅式不同：call直接传参，apply需要⽤[]包含参数，意思就是传递⼀个类数组进来，⽐如argume ts对象 bi d与call传参⽅式⼀样，但是返回的是函数，所以需要 （）调⽤ 数组的常⽤⽅法 1. push 添加到最后 返回添加后的数组 2. u shift 添加到最前⾯ 返回添加后的数组 3. shift 删除 （从前⾯） 返回处理后的数组 4. pop 删除最后⼀项 返回处理后的数组 5. reverse 数组翻转 返回处理后的数组 6. j oi 数组转化为字符串 7. slice(start,e d) 截取数组 从start （开始） 到e d （结束 不包含） 8. co cat 数组合并 9. splice （开始下标,个数,ele1,ele2…） 剪接数组 10. forEach map 遍历 11. sort 排序 字符串的常⽤⽅法 1. slice(start开始位置索引，e d结束位置索引) 基本和substri g相似,区别在参数为负数。 2. charAt(i dex) ⽅法返回指定索引位置处的字符。 3. i dexOf (stri g) 返回Stri g对象内第⼀次出现⼦字符串位置 4. lastI dexOf (stri g) 倒叙查找 5. split(str) 将字符串以参数分割为数组 6. search ⽅法返回与正则表达式查找内容匹配的第⼀个字符串的位置 7. replace ⽤来查找匹配⼀个正则表达式的字符串，然后使⽤新字符串代替匹配 简单介绍⼀下闭包 有权访问⼀个函数内部变量的函数，也就是常说的函数内部嵌套函数，内部函数访问外部函数变量，从⽽导致垃圾回收机制没有将当前变量 回收掉。这样的操作，有可能会带来内存泄漏。好处就是可以设计私有的⽅法和变量。 解决办法 ：将事件处理函数定义在外部，解除闭包,或者在定义事件处理函数的外部函数中，删除对dom的引⽤。 原型链 每个被实例对象都有__proto__对象，它指向了构造该对象的构造函数的prototype属性。同时该对象可以通过__proto__对象来寻找不属于 ⾃⾝的属性 防抖 抖动停⽌后的时间超过设定的时间时执⾏⼀次函数。注意 ：这⾥的抖动停⽌表⽰你停⽌了触发这个函数，从这个时间点开始计算，当间隔时 间等于你设定时间，才会执⾏⾥⾯的回调函数。如果你⼀直在触发这个函数并且两次触发间隔⼩于设定时间，则⼀定不会到回调函数那⼀ 步。 节流 按照设定的时间固定执⾏⼀次函数，⽐如200ms⼀次。注意 ：固定就是你在mousemove过程中，执⾏这个节流函数，它⼀定是 200ms （你设定的定时器延迟时间）内执⾏⼀次。没到200ms，⼀定会返回，没有执⾏回调函数的。 深拷贝和浅拷贝 ⾸先深拷贝和浅拷贝只针对像 Obj ect, Array 这样的复杂对象的。浅拷