3.31 腾讯前端笔试
- 实现5点骰子,给的是像下面的图的排列,比较简单,3的元素align-self:center,2、4元素align-self:flex-end,然后再分别transform:translate(-100%)和100%就可以,题目也提示用flex和transform实现
- 实现数据缓存,题目是通过一个闭包cache来保存,思路就是先判断下闭包里面有没有保存过,没有就获取新的并缓存下来
var fn = (function (val) {
var cache = {};
return function () {
if (cache.hasOwnProperty(val)) return cache[val];
cache[val] = getRandomArray();
return cache[val]
}
}) ()
- Intersection Observer图片懒加载,其实题目都有提示 if (entry.isIntersecting) {} 就是判断元素进入视口的条件,那么只需要在元素进入视口之后,把image的src换成对应的data-src,然后让Intersection Observer不再监听即可。
const img = entry.target
img.src = img.dataset.src;
io.unobserve(img);
- 实现格式化,个人感觉是要把用例先读懂,题目会好理解很多
- func('hello 0', 'john') // 输出 hello john
- func('hello 0.name', {name:'mike'}) // 输出 hello mike
- func('hello 0!toUpperCase', 'john') // 输出 hello JOHN
第一种比较简单,因为占位符的key其实就是0,所以直接value = args[key] 就可以了
第二种的占位符是 0.name,所以先要处理一下,根据 . 分割字符串再对应保存成key和objKeyArr,然后再根据key获取当前0这个占位符对应的对象,考虑到可能会出现0.info.name的情况,所以在遍历objKeyArr的过程中不断更新value
for (let i = 0; i < objKeyArr.length ; i++) value = value[objKeyArr[i]]
第三种属于存在转换器的情况,同样的道理,先把0对应的value获取到,!后面的就是转换器的key,将它保存在xf里面,然后在存在转换器的情况里面就可以直接调用 transformers[xf](value)
- 任务调度器,代码没拷下来,网上也能搜出来一堆任务调度器的手写,可以去参考下,题目还是说得很明白的,一步步的设计方案都给出来,按方案写基本就a了,如果就手写任务调度器没有其他描述,我估计我是a不出来的