头条面试题

1.用reduce实现map

用reduce实现map

2.Promise和setTimeout综合输出顺序问题，宏事件微事件考察。

• 浏览器运行机制详解
• 重点在于：在执行异步队列时，执行完一个宏任务 ==> 执行完全部微任务 ===> 执行下一个宏任务，即优先执行微任务。

3.实现一个函数delay(alert,3,4000)(“hello”),每间隔4秒打印一次“hello”，打印三次。

function delay(func, times, delay) {
    return async function(content) {
        for (var i = 0; i < times; i++) {
            await new Promise(resolve => {
                setTimeout(() => {
                    func.call(this, content);
                    resolve(true);
                }, delay);
            });
        }
    };
}

delay(console.log, 3, 4000)(123);
复制代码

4.手写一个双向绑定，input输入的值响应在p标签上

5.实现左右布局，输入框自适应，按钮定宽的样式

<style> div { display: flex; } input { flex: 1; } button{ width: 100px; } </style>
<div>
    <input type="text" />
    <button>提交</button>
</div>
复制代码

6. 伪数组转换为数组的方法

let fakeArr = {
        0: 2,
        1: 3,
        2: 4,
        3: 4,
        length: 4
    }

    console.log(Array.prototype.slice.call(fakeArr, 0))
    console.log(Array.from(fakeArr))
复制代码

7. 抽取数组中n个数字，其和为sum的函数

面试题：

1. 一个元素，先transform:translate(100px,100px),再rotate(45deg)的效果，以及两个操做颠倒执行后的效果

rotate会致使元素的X、Y轴旋转

2. 响应码的意义

3.

function A(params) {
        this.c = 1;
    }
    let a = new A();
    A.prototype = {
        c: 1,
        d: 2
    };
    console.log(a.c);
    console.log(a.d);
复制代码

• a始终指向A以前无数据的原型
• a实例自己包含属性c
• 因此输出1 undefined

4. 手写一个360旋转的动画

/* animation-name 规定须要绑定到选择器的 keyframe 名称。。 animation-duration 规定完成动画所花费的时间，以秒或毫秒计。 animation-timing-function 规定动画的速度曲线。 animation-delay 规定在动画开始以前的延迟。 animation-iteration-count 规定动画应该播放的次数。 animation-direction 规定是否应该轮流反向播放动画。*/

    @keyframes circle {
        100% {
            transform: rotate(360deg);
        }
    }

    .box1 {
        animation: circle 3s linear 0s infinite;
    }
复制代码

5. keydown keypress keyup的区别

key相关事件发生顺序：onkeydown onkeypress onkeyup，只有onkeyup可以获取输入框完整的输入。

6. 防抖节流函数

7. 输入查询时， 两次的ajax都会修改dom， 如何解决

7. ==和===的比较规则

• 双等号==：
  • 1. 若是两个值类型相同，再进行三个等号(===)的比较
  • 2. 若是两个值类型不一样，也有可能相等，需根据如下规则进行类型转换在比较：
    • 若是一个是null，一个是undefined，那么相等
    • 若是一个是字符串，一个是数值，把字符串转换成数值以后再进行比较
• 三等号===:
  • 1. 若是类型不一样，就必定不相等
  • 2. 若是两个都是数值，而且是同一个值，那么相等；若是其中至少一个是NaN，那么不相等。（判断一个值是不是NaN，只能使用isNaN( ) 来判断）
  • 3. 若是两个都是字符串，每一个位置的字符都同样，那么相等，不然不相等。
  • 4. 若是两个值都是true，或是false，那么相等
  • 5. 若是两个值都引用同一个对象或是函数，那么相等，不然不相等
  • 6. 若是两个值都是null，或是undefined，那么相等

8. rem的使用

9. react如何绑定事件处理函数