面试系列 on Hawkeye-xb Blog

几个关于字体和Electron有趣的面试题

Thu, 10 Oct 2024 07:47:40 +0000

经过这么些面试，对于所做过的字体和 Electron，要么不根据项目来问，直接就是 Vue 原理，要么就是前端八股，最多也就是几个简单的 Electron 使用的问题。没想到在非互联网大厂的面试，碰到几个非常有意思的问题。

99%手写的Promise，都没法过的case

Sat, 29 Jun 2024 07:47:40 +0000

今儿个朋友在重构代码的时候，和我吐槽了如下题这么个代码。让判断下调用顺序，真是Promise写出了callback的感觉。
先不看答案，试试能不能解答正确。
这道题可以说99%手写的promise都不能正确输出。
答案由Google Chrome 控制台输出（目前使用的是 125.0.6422.176 正式版本，arm64架构）。

手写面试题

Sat, 08 Jun 2024 07:47:40 +0000

手写call、apply、bind

区别：

call 接收多个参数
apply 接收数组
bind 返回函数，不直接调用。能够分两次接收参数。

原理上就是把function挂在target对象上面，通过target.function 的方式，隐式的将执行上下文修改。

原型链

Fri, 07 Jun 2024 07:47:40 +0000

原型链是JavaScript中实现继承和对象间属性共享的一种机制。

当谈到继承时，JavaScript 只有一种结构：对象。每个实例对象（object）都有一个私有属性（称之为 proto ）指向它的构造函数的原型对象（prototype）。该原型对象也有一个自己的原型对象（proto），层层向上直到一个对象的原型对象为 null。根据定义，null 没有原型，并作为这个原型链中的最后一个环节。

从版号排序到手写Sort

Mon, 03 Jun 2024 00:00:00 +0000

给版本号排序

var versions = ['2.0.1', '1.1.0', '1.0.2', '2.0.0', '1.0.0', '3.0.10', '2.1.10', '2.0.0'];

versions.sort((a, b) => {
    const alist = a.split('.');
    const blist = b.split('.');

    for (let i = 0; i < alist.length; i ++) {
        if (alist[i] > blist[i]) {
            return 1;
        } else if (alist[i] < blist[i]) {
            return -1;
        } else {
            continue;
        }
    }

    return 0;
})

sort是怎么实现的

compareFn(a, b) 返回值	排序顺序
> 0	a 在 b 后，如 [b, a]
< 0	a 在 b 前，如 [a, b]
=== 0	保持 a 和 b 原来的顺序

const MySort = function (list, compareFn) {
    if (!compareFn) throw "compareFn is not a function";
    if (list.length <= 1) return list;
    // null list fn ...
    const mid = Math.floor(list.length / 2);
    const midValue = list[mid];
    const beforeList = [];
    const midList = []
    const afterList = [];

    for(let i = 0; i < list.length; i ++) {
        if (
            compareFn(list[i], list[mid]) < 0
        ) {
            beforeList.push(list[i])
        } else if (
            compareFn(list[i], list[mid]) > 0
        ) {
            afterList.push(list[i])
        } else {
            midList.push(list[i])
        }
    }

    return [].concat(
        MySort(beforeList, compareFn),
        midList,
        MySort(afterList, compareFn)
    )
}

（别的实现方式）

http相关

Sun, 02 Jun 2024 00:00:00 +0000

三次握手四次挥手

客户端发起请求，携带请求序列号
服务端接收，发送应答，返回请求序列号，携带新的服务序列号
客户端收到应答和对应的请求序列号，发送确认应答，发送数据

序列号保证请求的正确性。接收之后再发送请求，避免超时重复发送。

script中的defer和async属性

Sat, 01 Jun 2024 00:00:00 +0000

html.spec.whatwg.org 对属性的描述

The async and defer attributes are boolean attributes that indicate how the script should be evaluated. Classic scripts may specify defer or async, but must not specify either unless the src attribute is present. Module scripts may specify the async attribute, but must not specify the defer attribute.

Async 和defer 是用于指示脚本应该怎么被解析的布尔值属性。对于传统的脚本，除非src属性存在，否则不能指定defer或者async属性。对于module类型的脚本，可以指定async，但不能指定defer属性。