前端面试题17(js快速检索方法详解)

在这里插入图片描述
在前端JavaScript中,快速检索数据通常涉及到数组或对象的搜索。这里我会介绍几种常见的快速检索方法,并提供相应的代码示例。

1. 数组的findfindIndex方法

  • find: 返回数组中满足条件的第一个元素的值。
  • findIndex: 返回数组中满足条件的第一个元素的索引。
const array = [5, 12, 8, 130, 44];// 使用find查找值为130的元素
const foundValue = array.find(element => element === 130);
console.log(foundValue); // 输出: 130// 使用findIndex查找值为130的元素的索引
const foundIndex = array.findIndex(element => element === 130);
console.log(foundIndex); // 输出: 3

2. 对象的键值对检索

  • 直接访问: 如果你知道键名,可以直接通过键名获取值。
  • Object.keys/Object.values/Object.entries: 可以用来遍历对象的键、值或键值对进行检索。
const obj = {name: "Alice", age: 30, job: "Engineer"};// 直接访问
console.log(obj.name); // 输出: Alice// 遍历键值对查找
for(const [key, value] of Object.entries(obj)) {if(value === "Engineer") {console.log(`Key for 'Engineer' is: ${key}`);}
}

3. 二分查找(适用于已排序数组)

二分查找是一种在有序数组中查找特定元素的高效算法,其时间复杂度为O(log n)。

function binarySearch(sortedArray, target) {let left = 0;let right = sortedArray.length - 1;while (left <= right) {const mid = Math.floor((left + right) / 2);if (sortedArray[mid] === target) {return mid; // 找到目标值,返回索引} else if (sortedArray[mid] < target) {left = mid + 1; // 调整左边界} else {right = mid - 1; // 调整右边界}}return -1; // 没有找到目标值
}const sortedArray = [1, 3, 5, 7, 9];
const target = 5;
const index = binarySearch(sortedArray, target);
console.log(index !== -1 ? `Found at index: ${index}` : "Not found");

4. 使用Set进行唯一性检查

Set是ES6引入的一种新的数据结构,类似于数组,但成员的值都是唯一的,可以用来快速判断一个元素是否存在于集合中。

const uniqueValues = new Set([1, 2, 3, 4, 5]);console.log(uniqueValues.has(3)); // 输出: true
console.log(uniqueValues.has(6)); // 输出: false

以上就是一些前端JavaScript中常用的快速检索方法,根据具体需求选择合适的方法可以提高代码的效率和可读性。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/bicheng/42620.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【mindspore进阶】02-ResNet50迁移学习

Mindspore 应用&#xff08;2&#xff09;ResNet50迁移学习 在实际应用场景中&#xff0c;由于训练数据集不足&#xff0c;所以很少有人会从头开始训练整个网络。普遍的做法是&#xff0c;在一个非常大的基础数据集上训练得到一个预训练模型&#xff0c;然后使用该模型来初始化…

MongoDB:掌握核心常用命令语句,精通数据操作

标题&#xff1a;MongoDB&#xff1a;掌握核心命令&#xff0c;精通数据操作 前言&#xff1a; MongoDB 是一种非关系型数据库&#xff0c;以文档为中心&#xff0c;使用 JSON 格式的 BSON 来存储数据。它具有高可用性、高性能和易于扩展的特点&#xff0c;被广泛应用于各种规…

Laravel: 优雅构建PHP应用的现代框架

在PHP开发生态中&#xff0c;Laravel是一个广受欢迎的现代Web应用框架。以其优雅、简洁的代码风格和强大的功能著称&#xff0c;Laravel使得开发复杂应用变得简单而高效。本文将带你深入了解Laravel框架的核心特性、优势以及如何开始使用这个框架。 Laravel框架简介 Laravel是…

接口(interface)中定义 `default` 方法

在 Java 8 及以后版本中&#xff0c;接口&#xff08;interface&#xff09;中可以定义 default 方法。default 方法允许接口提供一个默认的实现&#xff0c;使得接口不仅仅是方法签名的集合&#xff0c;也可以包含方法的具体实现。这一特性提供了更大的灵活性和向后兼容性。以…

张量分解(2)——张量运算(内积、外积、直积、范数)

&#x1f345; 写在前面 &#x1f468;‍&#x1f393; 博主介绍&#xff1a;大家好&#xff0c;这里是hyk写算法了吗&#xff0c;一枚致力于学习算法和人工智能领域的小菜鸟。 &#x1f50e;个人主页&#xff1a;主页链接&#xff08;欢迎各位大佬光临指导&#xff09; ⭐️近…

MATLAB贝叶斯线性回归模型案例

采用辛烷值数据集“spectra_data.mat”&#xff08;任意数据集均可&#xff09;&#xff0c;介绍贝叶斯线性回归模型的构建和使用流程。 运行结果如下&#xff1a; 训练集预测精度指标如下: 训练集数据的R2为: 1 训练集数据的MAE为: 0.00067884 训练集数据的RMSE为: 0.0008893…

STM32点灯闪烁

stm32c8t6引脚图 开发板引脚图 GPIO端口的每个位可以由软件分别配置成 多种模式。 ─ 输入浮空 ─ 输入上拉 ─ 输入下拉 ─ 模拟输入 ─ 开漏输出 ─ 推挽式输出 ─ 推挽式复用功能 ─ 开漏复用功能 配置GPIO端口步骤&#xff1a;开启时钟->使用结构体设置输出模式…

水仙花数算法

一、水仙花的传说 希腊神话故事 传说希腊神话里&#xff0c;美少年纳西索斯&#xff08;Narcissus&#xff09;是希腊最俊美的男子&#xff0c;无数的少女对他一见倾心&#xff0c;可他却自负地拒绝了所有的人。这当中包括美丽的山中仙女伊可&#xff08;Echo&#xff09;。伊可…

分享一些提升效率的办公、学习神器!

分享一些提升效率的办公、学习神器&#xff01; 文章目录 分享一些提升效率的办公、学习神器&#xff01; 一、 ✅ 文件搜索工具 Everything&#xff1a;1.1 Everything 主要功能&#xff1a;1.2 Everything 下载地址&#xff1a; 二、 ✅ 文件压缩解压工具 7 - Zip&#xff1a…

AI免费英语学习在线工具:Pi;gpt;其他大模型AI 英语学习智能体工具

1、pi(强烈推荐&#xff1a;可以安卓下载使用) https://pi.ai/talk &#xff08;网络国内使用方便&#xff09; 支持实时聊天与语音对话 2、chatgpt&#xff08;强烈推荐&#xff1a;可以安卓下载使用) https://chat.openai.com/ &#xff08;网络国内使用不方便&#xf…

2028年企业云存储支出翻倍,达到1280亿美元

根据Omdia的研究&#xff0c;到2028年&#xff0c;企业云存储支出将从去年的570亿美元翻一番以上&#xff0c;达到1280亿美元。该研究分析了基础设施即服务&#xff08;IaaS&#xff09;和平台即服务&#xff08;PaaS&#xff09;数据中心的收入&#xff0c;作为年度存储数据服…

C++初学者指南-4.诊断---valgrind

C初学者指南-4.诊断—Valgrind Valgrind&#xff08;内存错误检测工具&#xff09; 检测常见运行时错误 读/写释放的内存或不正确的堆栈区域使用未初始化的值不正确的内存释放&#xff0c;如双重释放滥用内存分配函数内存泄漏–非故意的内存消耗通常与程序逻辑缺陷有关&#xf…

Halcon 背景网格产品刮伤缺陷检测

* 关闭窗口 dev_close_window ()*关闭程序计数器,图形变量更新,窗口图形更新 dev_update_off ()*设置图像路径 Path : lcd/mura_defects_blur_*读取一张图像 read_image (Image, Path 01)*获取图像大小 get_image_size (Image, Width, Height)*创建一个新窗体 dev_open_window…

Apache Seata应用侧启动过程剖析——注册中心与配置中心模块

本文来自 Apache Seata官方文档&#xff0c;欢迎访问官网&#xff0c;查看更多深度文章。 本文来自 Apache Seata官方文档&#xff0c;欢迎访问官网&#xff0c;查看更多深度文章。 Apache Seata应用侧启动过程剖析——注册中心与配置中心模块 前言 在Seata的应用侧&#xf…

SpringBoot Elasticsearch painless 查询某个属性是否存在的复杂判断for循环判断,深入理解Painless脚本查询

在使用Spring Boot与Elasticsearch结合进行搜索应用开发时&#xff0c;我们经常会遇到需要对文档中的数组或列表类型字段进行复杂查询的情况。Elasticsearch的Painless脚本语言提供了一种强大的方式来执行这类查询&#xff0c;允许开发者在查询时执行自定义的逻辑判断。 深入理…

强化训练:day13(牛牛冲钻五、最长无重复子数组、重排字符串)

文章目录 前言1. 牛牛冲钻五1.1 题目描述1.2 解题思路1.3 代码实现 2. 最长无重复子数组2.1 题目描述2.2 解题思路2.3 代码实现 3. 重排字符串3.1 题目描述3.2 解题思路3.3 代码实现 总结 前言 1. 牛牛冲钻五   2. 最长无重复子数组   3. 重排字符串 1. 牛牛冲钻五 1.1 题…

【Scrapy】深入了解 Scrapy 中间件中的 process_spider_output 方法

准我快乐地重饰演某段美丽故事主人 饰演你旧年共寻梦的恋人 再去做没流着情泪的伊人 假装再有从前演过的戏份 重饰演某段美丽故事主人 饰演你旧年共寻梦的恋人 你纵是未明白仍夜深一人 穿起你那无言毛衣当跟你接近 &#x1f3b5; 陈慧娴《傻女》 Scrapy 是…

使用Python连接本地MySQL数据库并创建表

一、使用Python连接本地MySQL数据库并创建表 端口号&#xff1a;3307 用户名&#xff1a;root 密码&#xff1a;lms123456 数据库&#xff1a;test_01 from orm import *# 数据库连接对象 db MySQLDatabase(host"localhost",port3307,user"root",pas…

CUDA Install--Configure

CUDA环境正确设置 要确保你的系统环境变量正确设置&#xff0c;以包含CUDA 12.2的路径&#xff0c;可以按照以下步骤操作 步骤1&#xff1a;编辑.bashrc文件 打开并编辑你的.bashrc文件&#xff0c;以确保环境变量正确设置。 nano ~/.bashrc 在文件末尾添加以下内容&#xff…

LeetCode 35, 242, 994

目录 35. 搜索插入位置题目链接标签思路代码 242. 有效的字母异位词题目链接标签思路代码 994. 腐烂的橘子题目链接标签思路代码 35. 搜索插入位置 题目链接 35. 搜索插入位置 标签 数组 二分查找 思路 本题与 704. 二分查找 十分相似&#xff0c;只不过本题在找不到 tar…