頭條面試題

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如何綁定事件處理函數