本文要讲的是:使用apply方法处理数组的三个技巧
.
apply方法
apply是所有函数都有的方法
.它的签名如下:
func.apply(thisValue, [arg1, arg2, ...])
如果不考虑thisValue的影响
,上面的调用等同于:
也就是说,apply允许我们将一个数组"解开"成为一个个的参数再传递给调用函数
.让我们分别看看apply使用中的三个技巧.
技巧1: 将一个数组传递给一个不接受数组作为参数的函数
JavaScript中没有返回一个数组中最大值的函数.但是,有一个函数Math.max可以返回任意多个数值类型的参数中的最大值
.再配合apply
,我们可以实现我们的目的:
> Math.max.apply(null, [10, -1, 5])
10
译者注:注意Math.max方法的参数中只要有一个值被转为NaN,则该方法直接返回NaN
>Math.max(1,null
) //
相当于Math.max(1,0)
1
>Math.max(1,undefinded) //
相当于Math.max(1,NaN)
NaN
>Math.max(0,-0) //
正零比负零大,和==不同
0
>Math.max(-0,-1) //
负零比-1大
-0
技巧2: 填补稀疏数组
数组中的缝隙
这里提醒一下读者:在JavaScript中,一个数组就是一个数字到值的映射.所以如果某个索引处缺失了一个元素(一条缝隙)和某个元素的值为undefined
,是两种不同的情况.前者在被Array.prototype中的相关方法
(forEach
,
map
, 等.)遍历时,会跳过那些缺失的元素,而后者不会:
> ["a",,"b"].forEach(function
(x) { console.log(x) })
a
b
> ["a",undefined,"b"].forEach(function
(x) { console.log(x) })
a
undefined
b
译者注:这里作者说"数组就是一个数字到值的映射",严格意义上是不对的,正确的说法是"数组就是一个字符串到值的映射".下面是证据:
>for (i in ["a", "b"]) {
console.log(typeof i) //数组的索引实际上是个字符串
}
"string"
"string"
>["a", "b"].forEach(function (x, i) {
console.log(typeof i) //这里的i实际上不是索引,只是个数字类型的累加器
})
"number
"
"number
"
你可以使用in运算符来检测数组中是否有缝隙
.
> 1 in
["a",,"b"]
false
> 1 in
["a", undefined, "b"]
true
译者注:这里之所以用1可以,是因为in运算符会把1转换成"1".
你过你尝试读取这个缝隙的值,会返回undefined,和实际的
undefined元素是一样
.
> ["a",,"b"][1]
undefined
> ["a", undefined, "b"][1]
undefined
译者注:[1]也会被转换成["1"]
填补缝隙
apply配合
Array
(这里不需要加new)使用,可以将数组中的缝隙填补为undefined
元素:
> Array.apply(null, ["a",,"b"])
[ 'a', undefined, 'b' ]
这都是因为apply不会忽略数组中的缝隙
,会把缝隙作为undefined参数
传递给函数
:
> function
returnArgs() { return
[].slice.call(arguments) }
> returnArgs.apply(null
, ["a",,"b"])
[
'a', undefined, 'b' ]
但需要注意的是,如果Array方法接收到的参数是一个单独的数字,则会把这个参数当成数组长度,返回一个新数组
:
> Array.apply(null
, [ 3 ])
[ , , ]
因此,最靠谱的方法是写一个这样的函数来做这种工作:
function
fillHoles(arr) {
var
result = [];
for
(var
i=0; i < arr.length; i++) {
result[i]
= arr[i];
}
return
result;
}
执行:
> fillHoles(["a",,"b"])
[
'a', undefined, 'b' ]
Underscore中的_.compact
函数会移除数组中的所有假值,包括缝隙:
> _.compact(["a",,"b"])
[
'a', 'b' ]
> _.compact(["a", undefined, "b"])
[
'a', 'b' ]
> _.compact(["a", false
, "b"])
[
'a', 'b' ]
技巧3:
扁平
化
数组
任务:将一个包含多个数组元素的数组转换为一个一阶数组.我们利用apply解包数组的能力配合
concat来做这件事
:
> Array.prototype.concat.apply([], [["a"], ["b"]])
[
'a', 'b' ]
混合非数组类型的元素也可以:
> Array.prototype.concat.apply([], [["a"], "b"])
[
'a', 'b' ]
apply
方法的thisValue必须指定为
[]
,因为concat是一个数组的方法
,不是一个独立的函数.这种写法的限制是最多只能扁平化二阶数组:
> Array.prototype.concat.apply([], [[["a"]], ["b"]])
[ [
'a' ], 'b' ]
所以你应该
考虑一个替代方案
.比如Underscore中的_.flatten
函数就可以处理任意层数的
嵌套数组
:
> _.flatten([[["a"]], ["b"]])
[
'a', 'b' ]
原文地址: http://www.cnblogs.com/ziyunfei/archive/2012/09/18/2690412.html
分享到:
相关推荐
现在,我们来看看`apply`方法及其在处理数组时的三个技巧: **技巧1:将一个数组传递给不接受数组作为参数的函数** 在JavaScript中,`apply`方法允许我们将数组“解开”为单独的参数传递给函数。例如,如果我们想...
- **类型**:ECMAScript 支持多种基本数据类型,如数字、字符串、布尔值等,并支持复杂数据类型如对象和数组。 - **类型转换**:在不同的数据类型之间进行转换的能力。 - **执行上下文**:定义了代码执行时的环境,...
1. 定义一个递归函数getGroup,该函数接收三个参数:data表示数据源数组,index表示当前处理到数据源的哪个位置,group表示已经产生的组合数组。 2. 在函数中,首先将数据源当前索引的元素放入到一个临时数组need_...
- **列表与数组**:比较了列表和数组在内存使用和访问速度方面的差异,指导开发者根据实际需求选择合适的数据结构。 - **列表与集合**:讨论了列表和集合在元素唯一性和查找效率方面的区别,以及何时使用集合可以...
上述代码中,我们创建了一个数组arr,并赋值了三个元素。然后,我们通过Math.min.apply(null, arr)和Math.max.apply(null, arr)来分别获取这个数组中的最小值和最大值。apply()方法的第一个参数是null,因为Math.min...
在JavaScript中,我们可以通过避免修改传入的对象和数组,以及确保函数只返回新的数据结构来编写纯函数。 3. 高阶函数 高阶函数是接受一个或多个函数作为参数,或者返回一个新的函数的函数。在JavaScript中,`map`...
本章详细阐述了Kotlin类型系统的特点,包括为空性处理、基本类型、集合和数组等。 #### 七、操作符重载和其他习惯用法 **7.1 重载算术操作符** - **操作符重载**:Kotlin允许用户自定义操作符的行为,如加法(`+`)...
在对象和数组方面,JavaScript提供了灵活的对象字面量语法和数组字面量。对象可以看作键值对的集合,数组则是一系列有序的元素。我们可以通过原型链实现继承,使用方法如call、apply和bind改变函数的上下文。数组...
随后,使用for循环从数组的第二个元素开始遍历,每次循环比较当前的最大值`max`和数组当前索引`i`的值。如果发现更大的值,则更新`max`。当遍历完成后,`max`就是数组中的最大值。 ### 方法三:使用Math.max.apply...
在“JS经典实例大全”这个压缩包中,包含了丰富的JavaScript编程实例,旨在帮助开发者深入理解和掌握这门语言的核心概念、语法以及实际应用技巧。 一、变量与数据类型 在JavaScript中,变量的声明使用`var`、`let`...