当前位置: 首页 > news >正文

面试手写第五期

文章目录

  • 一. 实现一个函数用来对 URL 的 querystring 进行编码
  • 二. 如何实现一个数组洗牌函数 shuffle
  • 三. 异步加法的几种方式
  • 四. 实现trim函数
  • 五. 求多个数组的交集
  • 六. 手写实现render函数
  • 七. 驼峰转- -转驼峰
  • 八. instanceof实现
  • 九. 组合问题
  • 十. 字符串分组

一. 实现一个函数用来对 URL 的 querystring 进行编码

const data = {a: 3,b: 4,c: 5,
};
function stringify(data) {const pairs = Object.entries(data);const qs = pairs.map(([k, v]) => {let noValue = false;if (v === null || v === undefined || typeof v === "object") {noValue = true;}return `${encodeURIComponent(k)}=${noValue ? "" : encodeURIComponent(v)}`;}).join("&");return qs;
}
// 对 data 编码后得到 querystring 如下
//=> 'a=3&b=4&c=5'
stringify(data);

二. 如何实现一个数组洗牌函数 shuffle

function shuffle(array) {let len = array.length;let _array = [...array];while (len) {let index = Math.floor(Math.random() * len--);[_array[index], _array[len]] = [_array[len], _array[index]];}return _array;
}

三. 异步加法的几种方式

串行

function add(a, b) {return Promise.resolve(a + b);
}
async function sum(arr) {let s = arr[0];for (let i = 1; i < arr.length; i++) {s = await add(s, arr[i]);}return s;
}

并行

function add(a, b) {return Promise.resolve(a + b);
}function chunk(list, size) {const l = [];for (let i = 0; i < list.length; i++) {const index = Math.floor(i / size);l[index] ??= [];l[index].push(list[i]);}return l;
}async function sum(arr) {if (arr.length === 1) return arr[0];const promises = chunk(arr, 2).map(([x, y]) =>// 注意此时单数的情况y === undefined ? x : add(x, y),);return Promise.all(promises).then((list) => sum(list));
}sum([1, 2, 3, 4]).then(res => {console.log(res);
})

四. 实现trim函数

function trim(str = "") {str = String(str);let left = 0;let right = str.length - 1;while (/\s/.test(str[left]) && left < right) {left += 1;}while (/\s/.test(str[right]) && left < right) {right -= 1;}return str.slice(left, right + 1);
}

五. 求多个数组的交集

function intersection(...args) {return args.reduce((res, cur) => [...new Set(res.filter(item => cur.includes(item)))])
}
console.log(intersection([1, 2, 2], [1, 2, 2], [1, 2]));

六. 手写实现render函数

function get(source, path, defaultValue = undefined) {// a[3].b -> a.3.b -> [a, 3, b]const paths = path.replace(/\[(\w+)\]/g, ".$1").replace(/\["(\w+)"\]/g, ".$1").replace(/\['(\w+)'\]/g, ".$1").split(".");let result = source;for (const p of paths) {result = result?.[p];}return result === undefined ? defaultValue : result;
}function render(template, data) {return template.replace(/{{\s+([^\s]+)\s+}}/g, (capture, key) => {return get(data, key);});
}

七. 驼峰转- -转驼峰

//驼峰转短横线
function toKebabCase(str) {let res = str.replace(/([A-Z])/g, (all, i) => {return "-" + i.toLowerCase();});if (res.slice(0, 1) === "-") {res = res.slice(1); //去除开头的-}return res;
}
//短横线转驼峰
function toCamelCase(str) {return str.replace(/-([a-zA-Z])/g, function (all, i) {return i.toUpperCase();});
}console.log(toCamelCase("get-element-by-id"));
console.log(toKebabCase("GetElementById"));

八. instanceof实现

function fakeInstanceOf(instance, parent) {if (typeof instance !== "object" && typeof instance !== "function") {return false;}let proto = instance?.__proto__ || null;while (true) {if (proto === null) {return false;}if (proto === parent.prototype) {return true;}proto = proto.__proto__;}
}//=> true
console.log(fakeInstanceOf([], Array));//=> true
console.log(fakeInstanceOf([], Object));//=> true
console.log(fakeInstanceOf(x => x, Object));//=> false
console.log(fakeInstanceOf('hello', Object));

九. 组合问题

function combinationGenerator(m, n) {const results = [];function backtracking(start, currentComb) {if (currentComb.length === n) {results.push(currentComb.slice());return;}for (let i = start; i <= m; i++) {currentComb.push(i);backtracking(i + 1, currentComb);currentComb.pop();}}backtracking(1, []);return results;
}
console.log(combinationGenerator(3, 2));

十. 字符串分组

function groupAnagrams(strs) {const groups = new Map();for (let str of strs) {const sortStr = str.split('').sort().join();if (!groups.has(sortStr)) {groups.set(sortStr, []);}groups.get(sortStr).push(str);}return Array.from(groups.values());
}const strings = ['eat', 'tea', 'tan', 'ate', 'nat', 'bat'];
console.log(groupAnagrams(strings));

相关文章:

面试手写第五期

文章目录 一. 实现一个函数用来对 URL 的 querystring 进行编码二. 如何实现一个数组洗牌函数 shuffle三. 异步加法的几种方式四. 实现trim函数五. 求多个数组的交集六. 手写实现render函数七. 驼峰转- -转驼峰八. instanceof实现九. 组合问题十. 字符串分组 一. 实现一个函数用…...

【CSS】css选择器和css获取第n个元素(:nth-of-type(n)、:nth-child(n)、first-child和last-child)

:nth-of-type、:nth-child的区别 一、css选择器二、:nth-of-type、:nth-child的区别:nth-of-type(n)&#xff1a;选择器匹配属于父元素的特定类型的第N个子元素:nth-child(n)&#xff1a;选择器匹配属于其父元素的第 N 个子元素&#xff0c;不论元素的类型:first-child&#xf…...

解析Excel文件内容,按每列首行元素名打印出某个字符串的统计占比(超详细)

目录 1.示例&#xff1a; 1.1 实现代码1&#xff1a;列数为常量 运行结果&#xff1a; 1.2 实现代码2&#xff1a;列数为变量 运行结果&#xff1a; 1.示例&#xff1a; 开发需求&#xff1a;读取Excel文件&#xff0c;统计第3列到第5列中每列的"False"字段占…...

qt中遇到[Makfile.Debug:119:debug/app.res.o] Error 1的原因以及解决方法

当我们将项目已到本地qt环境中会出现下图的代码错误 解决方法&#xff1a;在主界面中&#xff0c;点击左边的项目栏&#xff0c;选择构建设置&#xff0c;看Shadow build下面的路径是否为中文&#xff0c;改成英文&#xff0c;或者直接将Shadow build这个 √ 去掉就行了,如图已…...

pytorch调用gpu训练的流程以及示例

首先需要确保系统上安装了CUDA支持的NVIDIA GPU和相应的驱动程序。 基本步骤如下 检查CUDA是否可用&#xff1a; 使用 torch.cuda.is_available() 来检查CUDA是否可用。 指定设备&#xff1a; 可以使用 torch.device(“cuda:0”) 来指定要使用的GPU。如果系统有多个GPU&…...

学习Android的第一天

目录 什么是 Android&#xff1f; Android 官网 Android 应用程序 Android 开发环境搭建 Android 平台架构 Android 应用程序组件 附件组件 Android 第一个程序 HelloWorld 什么是 Android&#xff1f; Android&#xff08;发音为[ˈnˌdrɔɪd]&#xff0c;非官方中文…...

回归预测 | Matlab实现CPO-LSTM【24年新算法】冠豪猪优化长短期记忆神经网络多变量回归预测

回归预测 | Matlab实现CPO-LSTM【24年新算法】冠豪猪优化长短期记忆神经网络多变量回归预测 目录 回归预测 | Matlab实现CPO-LSTM【24年新算法】冠豪猪优化长短期记忆神经网络多变量回归预测效果一览基本介绍程序设计参考资料 效果一览 基本介绍 1.Matlab实现CPO-LSTM【24年新算…...

Typora导出html文件图片自动转换成base64

Typora导出html文件图片自动转换成base64 一、出现问题二、解决方案三、编码实现3.1.创建Java项目3.2.代码3.3.打包成Jar包 四、如何使用endl 一、出现问题 typora 导出 html 的时候必须带有原图片&#xff0c;不方便交流学习&#xff0c;文件太多显得冗余&#xff0c;只有将图…...

『C++成长记』string使用指南

&#x1f525;博客主页&#xff1a;小王又困了 &#x1f4da;系列专栏&#xff1a;C &#x1f31f;人之为学&#xff0c;不日近则日退 ❤️感谢大家点赞&#x1f44d;收藏⭐评论✍️ 目录 一、string类介绍 二、string类的常用接口说明 &#x1f4d2;2.1string类对象的常…...

硬件连通性测试:构建数字世界的无形基石

在当今数字化的时代&#xff0c;硬件设备的连通性对于系统的正常运行至关重要。硬件连通性测试作为确保设备协同工作的关键步骤&#xff0c;扮演着构建数字世界的无形基石的角色。本文将深入探讨硬件连通性测试的意义、方法以及在现代科技生态系统中的重要性。 1. 硬件连通性测…...

mysql的安装与卸载

mysql的安装 mysql 8.0的安装步骤&#xff1a; 1. 从mysql官网上下载mysql安装软件 https://www.mysql.com/ 2. 双击msi文件进行安装 3. 选择安装的类型 选择server only可以远程访问数据库 4. 选择服务并安装 5. 安装中&#xff0c;安装完成后直接next 6. 进入mysql的配置 …...

假期作业 2.2

第一章 命名空间 一&#xff0e;选择题 1、编写C程序一般需经过的几个步骤依次是&#xff08; B &#xff09; A. 编辑、调试、编译、连接 B. 编辑、编译、连接、运行 C. 编译、调试、编辑、连接 D. 编译、编辑、连接、运行 2、所谓数据封装就是将一组数据和与这组数…...

运维SRE-02 正则表达式、grep

1.特殊符号补充 1.1位置相关的特殊符号 . 当前目录 .. 当前目录的上级目录 ~ 当前用户家目录 / 根目录 cd - 返回上次所在目录1.2熟练掌握 # 注释符号,root命令提示符 | 管道符号.1.3了解其他特殊符号 $ 取值(取出变量的值),普通用户的提示符 ! % ^ & * (){} [] ; ? \…...

【SpringCloud】使用OpenFeign进行微服务化改造

目录 一、需求与背景二、OpenFeign 远程调用技术原理三、项目代码演示3.1 引入依赖3.2 实现OpenFeign注解修饰接口3.3 指定 OpenFeign 远程调用接口的扫描路径 四、OpenFeign 在日志中打印Request和Response五、OpenFeign 客户端超时配置六、使用 OpenFeign 实现服务降级6.1 实…...

DRV8313和L298N都是电机驱动,一个是驱动三相FOC无刷直流电机的,一个是驱动有刷电机,使stm32控制无刷电机简单入门知识

DRV8313和L298N都是电机驱动器&#xff0c;但它们之间存在一些关键的区别&#xff1a; DRV83131&#xff1a; 由德州仪器&#xff08;TI&#xff09;制造。 具有集成的场效应晶体管&#xff08;FET&#xff09;。 最大电压为65V。 峰值电流为3A。 适用于三相电机驱动。 L298N…...

React16源码: React中event事件系统初始化源码实现

event 事件系统初始化 1 &#xff09;概述 react事件系统比较的复杂&#xff0c;它是基于dom的事件系统在dom事件系统上面进行了一个深度的封装它里面的很多实现逻辑都是自由的一套在初始化 react-dom 的源码的时候&#xff0c;会为react的事件系统注入 reactdom 相关的一些插…...

Qt6入门教程 15:QRadioButton

目录 一.简介 二.常用接口 三.实战演练 1.径向渐变 2.QSS贴图 3.开关效果 4.非互斥 一.简介 QRadioButton控件提供了一个带有文本标签的单选按钮。 QRadioButton是一个可以切换选中&#xff08;checked&#xff09;或未选中&#xff08;unchecked&#xff09;状态的选项…...

Json序列化和反序列化 笔记

跟着施磊老师学C 下载&#xff1a;GitHub - nlohmann/json: JSON for Modern C 在single_include/nlohmann里头有一个json.hpp&#xff0c;把它放到我们的项目中就可以了 #include "json.hpp" using json nlohmann::json;#include <iostream> #include <…...

新媒体与传媒行业数据分析实践:从网络爬虫到文本挖掘的综合应用,以“中国文化“为主题

大家好&#xff0c;我是八块腹肌的小胖&#xff0c; 下面将围绕微博“中国文化”以数据分析、数据处理、建模及可视化等操作 目录 1、数据获取 2、数据处理 3、词频统计及词云展示 4、文本聚类分析 5、文本情感倾向性分析 6、情感倾向演化分析 7、总结 1、数据获取 本…...

Visual Studio使用Git忽略不想上传到远程仓库的文件

前言 作为一个.NET开发者而言&#xff0c;有着宇宙最强IDE&#xff1a;Visual Studio加持&#xff0c;让我们的开发效率得到了更好的提升。我们不需要担心环境变量的配置和其他代码管理工具&#xff0c;因为Visual Studio有着众多的拓展工具。废话不多说&#xff0c;直接进入正…...

Nginx简单阐述及安装配置

目录 一.什么是Nginx 二.Nginx优缺点 1.优点 2.缺点 三.正向代理与反向代理 1.正向代理 2.反向代理 四.安装配置 1.添加Nginx官方yum源 2.使用yum安装Nginx 3.配置防火墙 4.启动后效果 一.什么是Nginx Nginx&#xff08;“engine x”&#xff09;是一个高性能的HTTP…...

【遥感入门系列】遥感分类技术之遥感解译

遥感的最终成果之一就是从遥感图像上获取信息&#xff0c;遥感分类是获取信息的重要手段。同时遥感图像分类也是目前遥感技术中的热点研究方向&#xff0c;每年都有新的分类方法推出。 本小节主要内容&#xff1a; 遥感分类基本概念常见遥感分类方法 1 遥感分类概述 遥感图…...

解决:IDEA无法下载源码,Cannot download sources, sources not found for: xxxx

原因 Maven版本太高&#xff0c;遇到http协议的镜像网站会阻塞&#xff0c;要改为使用https协议的镜像网站 解决方案 1.打开设置 2. 拿到settings.xml路径 3. 将步骤2里箭头2的User settings file&#xff1a;settings.xml打开&#xff0c;作以下修改 保存即可。如果还不行…...

什么是IDE,新手改如何选择IDE?

IDE 是 Integrated Development Environment&#xff08;集成开发环境&#xff09;的缩写&#xff0c;它是一种软件应用程序&#xff0c;为程序员提供了一站式的开发环境&#xff0c;整合了多种工具和服务&#xff0c;以便高效地创建、修改、编译、调试和运行软件程序。IDE 集成…...

springBoot+Vue汽车销售源码

源码描述: 汽车销售管理系统源码基于spring boot以及Vue开发。 针对汽车销售提供客户信息、车辆信息、订单信息、销售人员管理、 财务报表等功能&#xff0c;提供经理和销售两种角色进行管理。 技术架构&#xff1a; idea(推荐)、jdk1.8、mysql5.X(不能为8驱动不匹配)、ma…...

FPS游戏框架漫谈第五天

今天想了想整理下AnimatorManager 他的职责是负责动画的播放&#xff0c;那么在介绍该对象具备的对外接口&#xff0c;必须先介绍下拥有动画的对象他是怎么管理动画数据的&#xff0c;打个比方如果我们一个把武器需要播放开火动画&#xff0c;那么我们基于unity引擎可视化动画编…...

83.如何设计高可用系统

文章目录 一、简介二、导致系统不可用的常见原因三、高可用系统设计基本原则四、容错性设计五、弹性伸缩六、可观测七、安全防护设计八、自动化 一、简介 什么是高可用 高可用是指系统在面对各种故障和异常情况时&#xff0c;仍能够提供稳定、可靠的服务。对于企业和用户而言&…...

Map和Set讲解

&#x1f3a5; 个人主页&#xff1a;Dikz12&#x1f4d5;格言&#xff1a;那些在暗处执拗生长的花&#xff0c;终有一日会馥郁传香欢迎大家&#x1f44d;点赞✍评论⭐收藏 目录 集合框架 模型 Set 常见方法和说明 Set总结 Map说明 Map常见方法和说明 Map 中HashMap的 …...

PHP集成开发环境 PhpStorm 2023 for mac中文激活版

PhpStorm 2023 for Mac是一款功能强大的PHP集成开发环境&#xff08;IDE&#xff09;&#xff0c;旨在帮助开发者更高效地编写、调试和测试PHP代码。该软件针对Mac用户设计&#xff0c;提供了丰富的功能和工具&#xff0c;以简化开发过程并提高开发效率。 软件下载&#xff1a;…...

数学建模 - 线性规划入门:Gurobi + python

在工程管理、经济管理、科学研究、军事作战训练及日常生产生活等众多领域中&#xff0c;人们常常会遇到各种优化问题。例如&#xff0c;在生产经营中&#xff0c;我们总是希望制定最优的生产计划&#xff0c;充分利用已有的人力、物力资源&#xff0c;获得最大的经济效益&#…...