草庐IT

前端面试笔试题-高频

et-008 2023-03-28 原文

前端面试高频笔试题，前端面试要做到提前准备提前练习，刷一定的面试题笔试题量，面试才能事半功倍一路畅通。

1. 实现快速排序

var arr = [9, 4, 3, 1, 6, 3, 8, 7]

/**
 * 快速排序
 * @param {array} arr 需要排序的数组
 * @returns {array}
 */
function quickSort (arr) {
    if (arr.length <= 1) return arr
    var arr1 = [], arr2 = []
    for (var i = 1; i < arr.length; i++) {
        if (arr[i] < arr[0]) {
            arr1.push(arr[i])
        } else {
            arr2.push(arr[i])
        }
    }
    arr1 = quickSort(arr1)
    arr2 = quickSort(arr2)
    arr1.push(arr[0])
    return arr1.concat(arr2)
}

console.log(quickSort(arr))    // [1, 3, 3, 4, 6, 7, 8, 9]

步骤分析：

  • 首先设定一个分界值，通过该分界值将数组分成左右两部分。
  • 将大于或等于分界值的数据集中到数组右边，小于分界值的数据集中到数组的左边。此时，左边部分中各元素都小于分界值，而右边部分中各元素都大于或等于分界值。
  • 然后，左边和右边的数据可以独立排序。对于左侧的数组数据，又可以取一个分界值，将该部分数据分成左右两部分，同样在左边放置较小值，右边放置较大值。右侧的数组数据也可以做类似处理。
  • 重复上述过程，可以看出，这是一个递归定义。通过递归将左侧部分排好序后，再递归排好右侧部分的顺序。当左、右两个部分各数据排序完成后，整个数组的排序也就完成了。

2. 实现 add(1)(2,3)(4,5,6) 的调用方式

function add(...args) {
    var f = add.bind(null, ...args) 
    f.sum = () => {
        return args.reduce((a, b) => a + b, 0)
    }
    return f
}

console.log(add(1)(2,3)(4,5,6).sum())    // 21

步骤分析：

  • 使用 bind 返回新函数以保证满足柯里化保留参数的特性
  • 通过 reduce 进行值累加

3. 深拷贝


function clone (obj) {
    if (obj === null || typeof obj !== 'object') return obj
    
    // 处理数组和对象
    if (obj instanceof Array || obj instanceof Object) {
        var copy = obj instanceof Array ? [] : {}
        for (let item in obj) {
            copy[item] = clone(obj[item])
        }
        return copy
    }
}

var data = {
    a: 1,
    b: [ 2, 3, 4 ],
    c: {
        d: 5
        e: [ 6 ]
    }
}

console.log(clone(data))

步骤分析：

  • 判断 obj 是否是值类型，如何是值类型直接返回
  • 如果 obj 是数组或者对象，新建空对象
  • 通过循环获取到 obj 的值进行递归，结果赋给新建的空对象
  • 该实现方式只实现了对象、值类型的拷贝，时间、方法等等可自行新增 if 进行创建赋值

4. 写出这段程序的输出内容


async function async1 () {
    console.log('async1 start')
    await async2()
    console.log('async1 end')
}

async function async2 () {
    console.log('async2')
}

console.log('script start')

setTimeout(function () {
    console.log('setTimeout')
})

async1()

new Promise(function (resolve) {
    console.log('promise1')
    resolve()
}).then(function () {
    console.log('promsise2')
})

console.log('script end')

输出结果：

script start
async1 start
async2
promise1
script end
async1 end
promsise2
setTimeout

步骤分析：

  • 首先，事件循环从宏任务（macrostack）队列开始，这个时候，宏任务 (整体 script、setTimeout、setInterval) 队列中，只有一个 script (整体代码)任务 ()。
  • 首先执行 console.log('script start')，输出 'script start'
  • 遇到 setTimeout 把 console.log('setTimeout') 放到 macrotask 队列中
  • 执行 aync1() 输出 'async1 start' 和 'async2' ,把 console.log('async1 end') 放到 micro 队列中
  • 执行到 promise ，输出 'promise1' ，把 console.log('promise2') 放到 micro 队列中
  • 执行 console.log('script end')，输出 'script end'
  • macrotask 执行完成会执行 microtask ，把 microtask quene 里面的 microtask 全部拿出来一次性执行完，所以会输出 'async1 end' 和 'promise2'
  • 开始新一轮的事件循环，去除执行一个 macrotask 执行，所以会输出 'setTimeout'

微信交流群：前端攻城狮 3 群

试笔端面consoleasyncarrJavaScript

有关前端面试笔试题-高频的更多相关文章

  1. Hive SQL 五大经典面试题 - 2

    目录第1题连续问题分析：解法：第2题分组问题分析：解法：第3题间隔连续问题分析：解法：第4题打折日期交叉问题分析：解法：第5题同时在线问题分析：解法：第1题连续问题如下数据为蚂蚁森林中用户领取的减少碳排放量iddtlowcarbon10012021-12-1212310022021-12-124510012021-12-134310012021-12-134510012021-12-132310022021-12-144510012021-12-1423010022021-12-154510012021-12-1523.......找出连续3天及以上减少碳排放量在100以上的用户分析：遇到这类

  2. 蓝桥杯C/C++VIP试题每日一练之报时助手 - 2

    ?作者主页：静Yu?简介：CSDN全栈优质创作者、华为云享专家、阿里云社区博客专家，前端知识交流社区创建者?社区地址：前端知识交流社区?博主的个人博客：静Yu的个人博客?博主的个人笔记本：前端面试题个人笔记本只记录前端领域的面试题目，项目总结，面试技巧等等。接下来会更新蓝桥杯官方系统基础练习的VIP试题，依然包括解题思路，源代码等等。问题描述：给定当前的时间，请用英文的读法将它读出来。时间用时h和分m表示，在英文的读法中，读一个时间的方法是：　　如果m为0，则将时读出来，然后加上“o’clock”，如3:00读作“threeo’clock”。　　如果m不为0，则将时读出来，然后将分读出来，如5

  3. 华为OD机试 -旋转骰子（Python） | 机试题算法思路 【2023】 - 2

    最近更新的博客华为OD机试-卡片组成的最大数字（Python）|机试题算法思路华为OD机试-网上商城优惠活动（一）（Python）|机试题算法思路华为OD机试-统计匹配的二元组个数（Python）|机试题算法思路华为OD机试-找到它（Python）|机试题算法思路华为OD机试-九宫格按键输入（Python）|机试算法备考思路华为OD机试-身高排序（Python）|备考思路使用说明参加华为od机试，一定要注意不要完全背诵代码，需要理解之后模仿写出，通过率才会高。华为OD清单查看地址：blog.csdn.net/hihell/catego

  4. 网络安全岗位面试题 - 2

    前言介绍了网络安全岗位常见的面试题，仅供参考！一、常识部分1.Linux服务器种用户关键信息存储在那个文件中？启动、停止、重启、开机自启mysql服务命令？如何查找/etc/test.txt文件中"password"关键字信息?如何精确查找80端口？/etc/passwdsystemctlstartmysqld或systemmysqldstart 启动systemctlstopmysqld或systemmysqldstop 停止systemctlrestartmysqld或systemmysqldrestart 重启systemctlenablemysqld或systemmysqldenabl

  5. ruby 面试题 - 2

    我在之前的面试中遇到了这个问题，但做不到，知道吗？这是做什么的:`$=`;$_=\%!;($_)=/(.)/;$==++$|;($.,$/,$,,$\,$",$;,$^,$#,$~,$*,$:,@%)=($!=~/(.)(.).(.)(.)(.)(.)..(.)(.)(.)..(.)......(.)/,$"),$=++;$.++;$.++;$_++;$_++;($_,$\,$,)=($~.$"."$;$/$%[$?]$_$\$,$:$%[$?]",$"&$~,$#,);$,++;$,++;$^|=$";`$_$\$,$/$:$;$~$*$%[$?]$.$~$*${#}$%[$?]$;

  6. 华为OD机试题 Q2 押题【贪心的商人 or 最大利润】用 C++ 编码，速通 - 2

    最近更新的博客华为od2023|什么是华为od，od薪资待遇，od机试题清单华为OD机试真题大全，用Python解华为机试题|机试宝典【华为OD机试】全流程解析+经验分享,题型分享,防作弊指南华为od机试，独家整理已参加机试人员的实战技巧本篇题解：贪心的商人or最大利润题目描述商人经营一家店铺，有number种商品，由于仓库限制每件商品的最大持有数量是item[index]，每种商品的价格在每天是item_price[item_index][day]，通过对商品的买进和卖出获取利润，请给出商人在days天内能获取到的最大的利润；注：同一件商品可以反复买进和卖出；输入描述3//输入商品的数量nu

  7. 网络安全必备1000道面试题集锦（附答案） - 2

    前言以下为网络安全各个方向涉及的面试题，星数越多代表问题出现的几率越大，祝各位都能找到满意的工作。注：本套面试题，已整理成pdf文档，但内容还在持续更新中，因为无论如何都不可能覆盖所有的面试问题，更多的还是希望由点达面，查漏补缺。一、渗透测试方向：如何绕过CDN找到真实IP，请列举五种方法(★★★)redis未授权访问如何利用，利用的前提条件是？(★★★)mysql提权方式有哪些?利用条件是什么?(★)windows+mysql，存在sql注入，但是机器无外网权限，可以利用吗?(★)常用的信息收集手段有哪些，除去路径扫描，子域名爆破等常见手段，有什么猥琐的方法收集企业信息?(★★)SRC挖掘与

  8. 【JavaScript】手撕前端面试题：对象参数浅拷贝 | 简易深拷贝 | 完整深拷贝 - 2

    🖥️NodeJS专栏：Node.js从入门到精通🖥️博主的前端之路（源创征文一等奖作品）：前端之行，任重道远（来自大三学长的万字自述）🖥️TypeScript知识总结：TypeScript从入门到精通（十万字超详细知识点总结）🧑‍💼个人简介：大三学生，一个不甘平庸的平凡人🍬👉你的一键三连是我更新的最大动力❤️！文章目录1、浅拷贝要求思路代码2、简易深拷贝要求思路代码3、完整深拷贝要求思路代码1、浅拷贝要求补全JavaScript代码，要求实现一个对象参数的浅拷贝并返回拷贝之后的新对象。注意：参数可能包含函数、正则、日期、ES6新对象是对对象的参数进行浅拷贝，并不是直接对整个对象进行浅拷贝（整个

  9. 【测试面经】软件测试面试题大全，软件测试必问必背面试题，敢说会70%就可以轻松拿offer...... - 2

    目录：导读前言一、测试面试基础题二、测试实战面试题三、测试基础知识点四、总结前言大部分人学软件测试的从业者，在找工作的同时，会因为软件测试面试题挡在门前。……跳槽最重要的一步自然是面试，正值跳槽季，网上出现了各种面试题，一时会让人眼花缭乱，分不清最该看哪个，所以为大家做了一些软件测试面试的真题，想跳槽的小伙伴们，请准备好你的小本本！一、测试面试基础题1、简述测试流程？2、什么是软件测试？软件测试的目的与原则？3、软件生存周期及其模型是什么？4、什么是软件质量？5、自动化测试脚本开发的主要步骤？6、目前主要的测试用例设计方法是什么？7、常见的测试用例设计方法都有哪些?请分别以具体的例子来说明这些

  10. 【软件测试】企业测试面试题9道，从自我介绍到项目考察+回答...... - 2

    目录：导读前言一、Python编程入门到精通二、接口自动化项目实战三、Web自动化项目实战四、App自动化项目实战五、一线大厂简历六、测试开发DevOps体系七、常用自动化测试工具八、JMeter性能测试九、总结（尾部小惊喜）前言1、自我介绍您好，我叫xxxx，xx年从专业毕业，毕业至今已经工作三年。从xx年xx月至xx年xx月就职于，主要负责的项目是测试，这个系统是。我主要负责备案模块的开发，功能测试，测试用例设计。我另外接触的两个项目分别是系统和系统。对于系统，是平台。在这个项目中我的职责是需求分析、测试案例设计、功能测试。对于系统，我参与需求分析、测试案例设计、功能测试、接口测试。我个人

随机推荐