最新面试详情

最新面试详情

面试情况

标准提升 hc
周末统一面试 7~30天

1. promise
   （1）allSettled race
   （2）then
   （3）async await

//new Promise
static allSettled(promises){
    return new Promise((resolve, reject) => {
        const res = []
        let count = 0;

        const addData = (status, value, i) => {
            res[i] = {
                status,
                value
            }
            count++;
            if (count === promises.length) {
                resolve(res)
            }
        }

        promises.forEach((promise, index) => {
            if (promise instanceof Promise) {
                promise.then(res => {
                    addData('fulfilled', res, index);
                }, err => {
                    addData('rejected', err, index)
                })
            } else {
                addData('fulfilled', promise, index)
            }
        })
    })
}


//race
static race(promises){
    return new Promise((resolve, reject) => {
        promises.forEach(promise => {
            if (promise instanceof Promise) {
                promise.then(res => {
                    resolve(res)
                    }, err => {
                    reject(err)
                })
            } else {
                resolve(promise)
            }
        })
    })
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48

2. composition API optional API区别
   • composition API 好处
     • 提供比较灵活的逻辑抽离方式
     • TS
     • bundle
   • 与 optional API 对比
     • teleport
   • react hooks 对比
     • 有一定的条件限制
     • reactive Proxy VueUse
3. React Hooks 防抖节流

function debounce(fn,ms) {
    let timeout;
    return function () {
        let ctx = this;
        let args = arguments;
        if (timeout) {
            clearTimeout(timeout)
        }

        timeout = setTimeout(() => {
            fn.apply(ctx, args)
        }, ms)
    }
}
import { useEffect,useRef } from 'react'

const useDebounce = (fn,ms = 500,deps =[])=> {
    let timeout = useRef();
    useEffect(() => {
        if (timeout.current) {
            clearTimeout(timeout.current)

            timeout.current = setTimeout(() => {
                fn()
            }, ms)
          }
        }, deps)
        const cancelDebounce =() => {
            clearTimeout(timeout.current)
            timeout = null
        }
        return cancelDebounce
    
}

function throttle(fn, ms) {
    let previous = 0;
    return function () {
        let now = Date.now();
        let ctx = this;
        let args = arguments;
        if (now - previous > ms) {
            fn.apply(ctx, args)
            previous = now;
        }
    }
}

const useThrottle = (fn, ms = 500, deps = []) => {
    let previous = useRef(0);
    const [time, setTime] = usestate(0)

    useEffect(() => {
        let now = Date.now();
        if (now - previous.curent > time) {
            fn();
            previous.current = now;
        }
    }, deps)
    const cancelThrottle = () => {
        setTime(0)
    }
    return cancelThrottle
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64

前端稳定性

1. 基础介绍
2. 技能介绍
3. 项目
   项目亮点：API调用之外 基础业务功能的

简历例子：

技术描述:

对页面静态资源进行压缩、合并，并使用CDN加速，以提高页面加载速度。
使用Webpack进行打包优化，包括代码压缩、懒加载和按需加载，以及利用Tree shaking等技术来减小包的体积。
优化网络请求，减少不必要的请求次数，合并请求
采用图片压缩、懒加载和响应式图片等技术，以提高页面加载速度和用户体验。
针对不同浏览器进行测试和调试，处理兼容性问题，确保在各大主流浏览器下的良好兼容性。
通过代码优化，减少不必要的JavaScript和CsS文件大小，进行代码压缩和混淆，以减小加载时间。
将请求逻辑与业务逻辑分离，持续的优化项目，实现代码的可复用性和易维护性

问题：

1. 项目名称项目中的角色项目周期
2. 项目简介
3. 技术选型 Vue + vuex + vue-router + vueUse +XXxx
4. 项目难点和亮点
   （1）问题
   （2）问题分析 技术方案
   （3）action
   （4）业务提升

PC uniapp app
性能优化
用户体验