JavaScript学习:取数组中最大值和最小值
在实际业务中有的时候要取出数组中的最大值或最小值。但在数组中并没有提供arr.max()和arr.min()这样的方法。那么是不是可以通过别的方式实现类似这样的方法呢?那么今天我们就来整理取出数组中最大值和最小值的一些方法。
取数组中最大值
可以先把思路理一下:
- 将数组中第一个元素赋值给一个变量,并且把这个变量作为最大值;
- 开始遍历数组,从第二个元素开始依次和第一个元素进行比较
- 如果当前的元素大于当前的最大值,就把当前的元素值赋值给最大值
- 移动到下一个元素,继续按前面一步操作
- 当数组元素遍历结束时,这个变量存储的就是最大值
代码如下:
Array.prototype.max = function () {
// 将数组第一个元素的值赋给max
var max = this[0];
// 使用for 循环从数组第一个值开始做遍历
for (var i = 1; i < this.length; i++) {
// 如果元素当前值大于max,就把这个当前值赋值给max
if (this[i] > max) {
max = this[i];
}
}
// 返回最大的值
return max;
}
来看一个示例:
var arr = [1,45,23,3,6,2,7,234,56];
arr.max(); //
上面的示例,数组中都是数值,那么如果数组中不全是数值会是一个什么样的效果呢?来测试一下先:
var arr = [1,45,23,3,6,2,7,234,56,'2345','a','c'];
arr.max(); // 'c'
这并不是我们想要的结果吧。
通过前段时间的学习,都知道for循环性能要比forEach()差,那可以将上面的方法改成forEach()方法:
Array.prototype.max = function (){
var max = this[0];
this.forEach (function(ele,index,arr){
if(ele > max) {
max = ele;
}
})
return max;
}
var arr = [1,45,23,3,6,2,7,234,56];
arr.max(); //
取数组中最小值
类似取最大值的思路一样,我们可以很轻松的实现 arr.min() 方法,取出数组中的最小值:
Array.prototype.min = function () {
var min = this[0];
this.forEach(function(ele, index,arr) {
if(ele < min) {
min = ele;
}
})
return min;
}
var arr = [1,45,23,3,6,2,7,234,56];
arr.min(); //
其他方法
除了上面的方案,还可以有其他方法,比如使用数组的 reduce() 方法。回忆前面的学过的知识,reduce()方法可以接收一个回调函数 callbackfn ,可以在这个回调函数中拿数组中的初始值 (preValue) 与数组中当前被处理的数组项 (curValue) 做比较,如果 preValue 大于 curValue 值返回 preValue ,反之返回 curValue 值,依此类推取出数组中最大值:
Array.prototype.max = function() {
return this.reduce(function(preValue, curValue,index,array) {
return preValue > curValue ? preValue : curValue;
})
}
var arr = [1,45,23,3,6,2,7,234,56];
arr.max(); //
同样的也可以使用类似的方法实现 arr.mix() 方法,取出数组中的最小值:
Array.prototype.min = function() {
return this.reduce(function(preValue, curValue,index,array) {
return preValue > curValue ? curValue : preValue;
})
}
var arr = [1,45,23,3,6,2,7,234,56];
arr.min(); //
内置函数Math.max()和Math.min()方法
对于纯数字数组,可以使用JavaScript中的内置函数 Math.max() 和 Math.min() 方法。使用这两个内置函数可以分别找出数组中的最大值和最上值。在使用这两种内置函数取出数组最大和最小值之前,先学习一下 Math.max() 和 Math.min() 两个函数。
Math.max()
Math.max() 函数返回一组数中的最大值。
Math.max(1,32,45,31,3442,4); //
Math.max(10, 20); //
Math.max(-10, -20); // -10
Math.max(-10, 20); //
Math.min()
Math.min() 函数和 Math.max() 函数刚好相反,其会返回一组数中的最小值:
Math.min(10,20); //
Math.min(-10,-20); //-20
Math.min(-10,20); //-10
Math.min(1,32,45,31,3442,4); //
这些函数如果没有参数,则结果为 -Infinity;如果有任一参数不能被转换为数值,则结果为 NaN。最主要的是这两个函数对于数字组成的数组是不能直接使用的。但是,这有一些类似地方法。
Function.prototype.apply() 让你可以使用提供的 this 与参数组与的数组来调用参数。
// 取出数组中最大值
Array.max = function( array ){
return Math.max.apply( Math, array );
};
// 取出数组中最小值
Array.min = function( array ){
return Math.min.apply( Math, array );
}; var arr = [1,45,23,3,6,2,7,234,56];
Array.max(arr); //
Array.min(arr); //
Math对象也是一个对象,可以使用对象的字面量来写,如:
Array.prototype.max = function () {
return Math.max.apply({},this);
}
Array.prototype.min = function () {
return Math.min.apply({},this);
}
var arr = [1,45,23,3,6,2,7,234,56];
arr.max(); //
arr.min(); //
其实还有更简单的方法。基于ES2015的方法来实现此功能,是使用展开运算符:
var numbers = [1, 2, 3, 4];
Math.max(...numbers) //
Math.min(...numbers) //
此运算符使数组中的值在函数调用的位置展开。
总结
这篇文章整理了几个从数组中取出最大值和最小值的方法。这几个方法都只是会对于数字数组,而对于数组中包含其他数据类型时,如何只取出最大的数值和最小的数值(如果您知道如何实现,还望指点迷津)。而这几种方法当中,使用JavaScript的内置函数Math.max()和Math.min()配合Function.prototype.apply()可以轻松取出数组中的最大值和最小值。当然最最简单的要当数ES2015中使用展示运算符的方法。如果大家还有更好的方案,希望能在下面的评论中与我们一起分享
JavaScript学习:取数组中最大值和最小值的更多相关文章
- 转载——JavaScript学习笔记:取数组中最大值和最小值
转载自:http://www.w3cplus.com/javascript/calculate-the-max-min-value-from-an-array.html. 取数组中最大值 可以先把思路 ...
- js获取数组中最大值和最小值
var max = Math.max.apply(null, 数组); 获取最大值 var min = Math.min.apply(null, 数组);获取最小值 一句话获取数组中最大的数,最小数
- JavaScript 获取数组中最大值、最小值
笨方法 Array.prototype.max = function() { var max = this[0]; var len = this.length; for (var i = 1; i & ...
- js获取数组中最大值,最小值
遍历方法 var arr =[12,14,34,566,34,98,77] var max = arr[0]; for(var i=0;i<arr.length;i++){ if(max< ...
- 编程之美 set 5 寻找数组中最大值和最小值
解法 1. 设置 min, max 两个变量, 然后遍历一遍数组, 比较次数为 2*N 2. 依然设置 min, max 两个变量并遍历数组, 但将遍历的 step 设置为 2, 比较次数为 1.5 ...
- Javascript获取数组中最大和最小值
取出数组中最大值或最小值是开发中常见的需求,今天继续讲解如何获取javascript数组中最大和最小值. 1.排序法 首先我们给数组进行排序,可以按照从小到大的顺序来排,排序之后的数组中第一个和最后一 ...
- 使用JavaScript·求数组的最大值和最小值
前言 在数组中并没有提供arr.max()和arr.min()这样的方法.那么是不是可以通过别的方式实现类似这样的方法呢?那么今天我们就来整理取出数组中最大值和最小值的一些方法. 法一:其实利用 ...
- js中关于一个数组中最大、最小值以及它们的下标的输出的一种解决办法
今天在学习js中的数组时,遇到的输出一个数组中最大.最小值以及它们的下表,以下是自己的解决方法! <script type="text/javascript"> var ...
- JavaScript学习12 JS中定义对象的几种方式
JavaScript学习12 JS中定义对象的几种方式 JavaScript中没有类的概念,只有对象. 在JavaScript中定义对象可以采用以下几种方式: 1.基于已有对象扩充其属性和方法 2.工 ...
随机推荐
- openGL之坐标变换
- Linux中Grep常用的15个例子【转】
转自:https://www.aliyun.com/jiaocheng/1390860.html?spm=5176.100033.1.9.6a1e41e8Pdjynm 摘要:Grep命令主要用于从文件 ...
- Windows PowerShell 入門(5)-制御構文
Windows PowerShellにおける制御構文について学びます.数ある制御構文の中でもSwitch文は.他の言語に比べ豊富な機能が用意されています. 対象読者 Windows PowerShel ...
- System.Data.SqlClient.SqlException: 数据类型 text 和 varchar 在 equal to 运算符中不兼容。
一.引起的源头 环境:vs2015,sqlserver2008 相关程序包:ef6 定义了一个实体article public class Article { public string Data{g ...
- 【转】细说new与malloc的10点区别
1.申请的内存所在位置 new操作符从自由存储区(free store)上为对象动态分配内存空间,而malloc函数从堆上动态分配内存.自由存储区是C++基于new操作符的一个抽象概念,凡是通过new ...
- oracle 12514文件解决
listener.ora的SID_LIST_LISTENER添加一下内容 (SID_DESC = (GLOBAL_DBNAME = ORCL) (ORACLE_HOME = f:\app\Admini ...
- vue.js如何更改默认端口号8080为指定端口
执行npm run dev实际是在调用根目录下的package.json 打开package.json后可发现有这样一段代码 由此可知,我们应该查看build目录下的dev-server.js文件 在 ...
- sass个人学习笔记
Materliu 在慕课的视频: http://www.imooc.com/learn/364 . http://www.imooc.com/wiki/371 sass入门:http://www.w3 ...
- MySQL数据库的一些方法使用
substring_index(windSpeed,)/3.6 as windSpeed 可将 .8公里.0m/s 进行拆分 嵌套使用replace方法 replace( replace( repla ...
- CSS入门(二)
一.组合选择器 每个选择器位可以是任意基础选择器或选择器组合 1.群组选择器 可以一次性控制多个选择器 选择器之间用逗号(,)隔开 div,.d1,#div{ color:red; } 2.子代(后代 ...