JS算法题之查找数字在数组中的索引位置


Posted in Javascript onMay 15, 2019

前言

编写算法时,排序是一个非常重要的概念。它有各种各样的种类:冒泡排序、希尔排序、分块块排序,梳排序,鸡尾酒排序,侏儒排序 —— 这些可不是我瞎编的!

这个算法题能够让我们一睹精彩的世界。我们必须对数字数组进行升序排序,并找出给定数字在该数组中的位置。

算法说明

将值(第二个参数)插入到数组(第一个参数)中,并返回其在排序后的数组中的最低索引。返回的值应该是一个数字。
例如 getIndexToIns([1,2,3,4], 1.5) 应该返回 1,因为 1.5 大于 1(索引0),但小于 2(索引1)。

同样,getIndexToIns([20,3,5], 19) 应该返回 2,因为数组排序后应该是 [3,5,20] , 19 小于 20 (索引2)且大于 5(索引1)。

function getIndexToIns(arr, num) {
 return num;
}

getIndexToIns([40, 60], 50);

本算法题原题

测试用例

  • getIndexToIns([10, 20, 30, 40, 50], 35) 应该返回一个数字 3。
  • getIndexToIns([10, 20, 30, 40, 50], 30) 应该返回一个数字 2.
  • getIndexToIns([40, 60], 50) 应该返回一个数字 1.
  • getIndexToIns([3, 10, 5], 3) 应该返回一个数字 0.
  • getIndexToIns([5, 3, 20, 3], 5) 应该返回一个数字 2.
  • getIndexToIns([2, 20, 10], 19) 应该返回一个数字 2.
  • getIndexToIns([2, 5, 10], 15) 应该返回一个数字 3.
  • getIndexToIns([], 1) 应该返回一个数字 0.

解决方案#1:.sort(),. indexOf()

PEDAC

理解问题:有两个输入:一个数组和一个数字。我们的目标是将输入的数字在输入数组后中排序后,再返回它的索引。
示例/测试用例:我们不知道输入的数组是以哪种方式排序的,但是提供的测试用例清楚地表明,输入的数组应该从小到大进行排序。

请注意,在最后一个测试用例中存在边界问题,其中输入数组是一个空数组。

数据结构:由于我们最终将会返回索引,因此应该坚持使用数组。

我们将会用一个名为 .indexOf() 的方法:

.indexOf() 返回元素在数组中出现的第一个索引,如果元素根本不存在则返回 -1。例如:

let food = ['pizza', 'ice cream', 'chips', 'hot dog', 'cake']
food.indexOf('chips')
// returns 2
food.indexOf('spaghetti')
// returns -1

我们将使用 .concat() 而不是 .push()。为什么呢?因为当使用 .push() 向数组添加元素时,它会返回新数组的长度。而使用 .concat() 向数组添加元素时,它会返回新数组本身。例如:

let array = [4, 10, 20, 37, 45]
array.push(98)
// returns 6
array.concat(98)
// returns [4, 10, 20, 37, 45, 98]

算法:

  1. 将num 插入 arr。
  2. 将 arr 进行升序排序。
  3. 返回 num 的索引。

代码:

function getIndexToIns(arr, num) {
 // Insert num into arr, creating a new array.
  let newArray = arr.concat(num)
 //    [40, 60].concat(50)
 //    [40, 60, 50]

 // Sort the new array from least to greatest.
  newArray.sort((a, b) => a - b)
 // [40, 60, 50].sort((a, b) => a - b)
 // [40, 50, 60]

 // Return the index of num which is now
 // in the correct place in the new array.
  return newArray.indexOf(num);
 // return [40, 50, 60].indexOf(50)
 // 1
}

getIndexToIns([40, 60], 50);

去掉局部变量和注释后的代码:

function getIndexToIns(arr, num) {
 return arr.concat(num).sort((a, b) => a - b).indexOf(num);
}

getIndexToIns([40, 60], 50);

解决方案#2:.sort(),.findIndex()

PEDAC

理解问题:有两个输入:一个数组和一个数字。我们的目标是将输入的数字在输入数组后中排序后,再返回它的索引。
示例/测试用例:我们不知道输入的数组是以哪种方式排序的,但是提供的测试用例清楚地表明,输入的数组应该从小到大进行排序。

这个解决方案需要考虑两个边界情况:

  • 如果输入数组为空,则我们需要返回 0,因为 num 将是该数组中的唯一元素,所以它在索引为 0 的位置。
  • 如果 num 的位置处于升序排序后的 arr 的末尾,那么我们需要返回 arr 的长度。

数据结构:由于我们最终将会返回索引,因此应该坚持使用数组。

让我们看看.findIndex() 并了解它将如何帮助解决这一挑战:

.findIndex() 返回数组中第一个满足条件的元素索引。否则它将返回 -1,这表示没有元素通过测试。例如:

let numbers = [3, 17, 94, 15, 20]
numbers.findIndex((currentNum) => currentNum % 2 == 0)
// returns 2
numbers.findIndex((currentNum) => currentNum > 100)
// returns -1

这对我们很有用,因为我们可以用 .findIndex() 将输入 num 与输入 arr 中的每个数字进行比较,并找出它从最小到最大的顺序。

算法:

  1. 如果 arr 是一个空数组,则返回 0。
  2. 如果 num 处于排序后数组的末尾,则返回 arr 的长度。
  3. 否则,返回索引 num。

代码:

function getIndexToIns(arr, num) {
 // Sort arr from least to greatest.
 let sortedArray = arr.sort((a, b) => a - b)
 //     [40, 60].sort((a, b) => a - b)
 //     [40, 60]

 // Compare num to each number in sortedArray
 // and find the index where num is less than or equal to 
 // a number in sortedArray.
 let index = sortedArray.findIndex((currentNum) => num <= currentNum)
 //   [40, 60].findIndex(40 => 50 <= 40) --> falsy
 //   [40, 60].findIndex(60 => 50 <= 60) --> truthy
 //   returns 1 because num would fit like so [40, 50, 60]

 // Return the correct index of num.
 // If num belongs at the end of sortedArray or if arr is empty 
 // return the length of arr.
 return index === -1 ? arr.length : index
}

getIndexToIns([40, 60], 50);

去掉局部变量和注释的代码:

function getIndexToIns(arr, num) {
 let index = arr.sort((a, b) => a - b).findIndex((currentNum) => num <= currentNum)
 return index === -1 ? arr.length : index
}

getIndexToIns([40, 60], 50);

如果你有其他解决方案或建议,请在评论中分享!

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
fancybox1.3.1 基于Jquery的插件在IE中图片显示问题
Oct 01 Javascript
javascript中使用replaceAll()函数实现字符替换的方法
Dec 25 Javascript
js倒计时简单实现代码
Aug 11 Javascript
微信公众号-获取用户信息(网页授权获取)实现步骤
Oct 21 Javascript
原生JavaScript实现的简单省市县三级联动功能示例
May 27 Javascript
AngularJS 验证码60秒倒计时功能的实现
Jun 05 Javascript
Node.js连接mongodb实例代码
Jun 06 Javascript
vue2.0 中#$emit,$on的使用详解
Jun 07 Javascript
JS实现页面打印(整体、局部)
Aug 18 Javascript
Angular如何在应用初始化时运行代码详解
Jun 11 Javascript
JQueryDOM之样式操作
Mar 27 jQuery
微信小程序实现打卡签到页面
Sep 21 Javascript
JQuery属性操作与循环用法示例
May 15 #jQuery
前端js中的事件循环eventloop机制详解
May 15 #Javascript
mpvue小程序循环动画开启暂停的实现方法
May 15 #Javascript
微信小程序的tab选项卡的实现效果
May 15 #Javascript
少女风vue组件库的制作全过程
May 15 #Javascript
vue两组件间值传递 $router.push实现方法
May 15 #Javascript
JavaScript+HTML5 canvas实现放大镜效果完整示例
May 15 #Javascript
You might like
Access数据库导入Mysql的方法之一
2006/10/09 PHP
PHP 获取客户端真实IP地址多种方法小结
2010/05/15 PHP
php array_map()数组函数使用说明
2011/07/12 PHP
字符串长度函数strlen和mb_strlen的区别示例介绍
2014/09/09 PHP
两个php日期控制类实例
2014/12/09 PHP
ECSHOP在PHP5.5及高版本上报错的解决方法
2015/08/31 PHP
php关键字仅替换一次的实现函数
2015/10/29 PHP
PHP常见字符串处理函数用法示例【转换,转义,截取,比较,查找,反转,切割】
2016/12/24 PHP
PHP正则替换函数preg_replace()报错:Notice Use of undefined constant的解决方法分析
2017/02/04 PHP
php 截取GBK文档某个位置开始的n个字符方法
2017/03/08 PHP
浅析JavaScript中的delete运算符
2013/11/30 Javascript
基于jquery ui的alert,confirm方案(支持换肤)
2015/04/03 Javascript
JavaScript实现彩虹文字效果的方法
2015/04/16 Javascript
jquery实现的Banner广告收缩效果代码
2015/09/02 Javascript
使用BootStrap建立响应式网页——通栏轮播图(carousel)
2016/12/21 Javascript
javascript兼容性(实例讲解)
2017/08/15 Javascript
vue el-table实现自定义表头
2019/12/11 Javascript
JavaScript简单编程实例学习
2020/02/14 Javascript
[46:27]DOTA2上海特级锦标赛主赛事日 - 1 胜者组第一轮#2LGD VS MVP.Phx第一局
2016/03/02 DOTA
Python决策树分类算法学习
2017/12/22 Python
python导入模块交叉引用的方法
2019/01/19 Python
浅析python,PyCharm,Anaconda三者之间的关系
2019/11/27 Python
Transpose 数组行列转置的限制方式
2020/02/11 Python
opencv 图像礼帽和图像黑帽的实现
2020/07/07 Python
详解CSS中iconfont的使用
2015/08/04 HTML / CSS
HTML5 CSS3新的WEB标准和浏览器支持
2009/07/16 HTML / CSS
悬挂训练绳:TRX
2017/12/14 全球购物
NOTINO英国:在线购买美容和香水
2020/02/25 全球购物
毕业自我鉴定总结
2014/03/24 职场文书
研究生考核个人自我鉴定
2014/03/27 职场文书
遗产继承公证书
2014/04/09 职场文书
大型公益活动策划方案
2014/08/20 职场文书
2014年班级工作总结
2014/11/14 职场文书
审查起诉阶段律师意见书
2015/05/19 职场文书
一篇带你入门Java垃圾回收器
2021/06/16 Java/Android
Ubuntu Server 安装Tomcat并配置systemctl
2022/04/28 Servers