最新面试详情

面试情况

标准提升 hc

周末统一面试 7~30天

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

javascript 复制代码

//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)
            }
        })
    })
}

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

javascript 复制代码

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
}

前端稳定性

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

简历例子：

技术描述:

对页面静态资源进行压缩、合并，并使用CDN加速，以提高页面加载速度。

使用Webpack进行打包优化，包括代码压缩、懒加载和按需加载，以及利用Tree shaking等技术来减小包的体积。

优化网络请求，减少不必要的请求次数，合并请求

采用图片压缩、懒加载和响应式图片等技术，以提高页面加载速度和用户体验。

针对不同浏览器进行测试和调试，处理兼容性问题，确保在各大主流浏览器下的良好兼容性。

通过代码优化，减少不必要的JavaScript和CsS文件大小，进行代码压缩和混淆，以减小加载时间。

将请求逻辑与业务逻辑分离，持续的优化项目，实现代码的可复用性和易维护性

问题：

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

PC uniapp app

性能优化

用户体验