Javascript Javascript过滤器与地图问题
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2442798/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Javascript filter vs map problem
提问by graham.reeds
As a continuation of my min/max across an array of objects I was wondering about the performance comparisons of filter vs map.
作为对一系列对象的最小值/最大值的延续，我想知道过滤器与地图的性能比较。
So I put together a test on the values in my code as was going to look at the results in FireBug.
所以我对代码中的值进行了测试，以查看 FireBug 中的结果。
This is the code:
这是代码：
var _vec = this.vec;
min_x = Math.min.apply(Math, _vec.filter(function(el){ return el["x"]; }));
min_y = Math.min.apply(Math, _vec.map(function(el){ return el["x"]; }));
The mapped version returns the correct result. However the filtered version returns NaN. Breaking it out, stepping through and finally inspecting the results, it would appear that the inner function returns the xproperty of _vecbut the actual array returned from filteris the unfiltered _vec.
该mapPED版本返回正确的结果。但是filtered 版本返回 NaN。打破它，逐步完成并最终检查结果，看起来内部函数返回了 的x属性，_vec但返回的实际数组filter是未过滤的_vec。
I believe my usage of filteris correct - can anyone else see my problem?
我相信我的用法filter是正确的 - 其他人能看到我的问题吗？
Here's a simple test:
这是一个简单的测试：
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>S:GTC Map Test</title>
</head>
<body>
<script type="text/javascript">
function vector(x,y,z) { this.x = x; this.y =y; this.z=z; }
var vec = [];
vec.push(new vector(1,1,1));
vec.push(new vector(2,2,2));
vec.push(new vector(2,3,3));
var _vec = vec;
min_x = Math.min.apply(Math, _vec.filter(function(el){ return el["x"]; }));
min_y = Math.min.apply(Math, _vec.map(function(el){ return el["x"]; }));
document.write("<br>filter = " + min_x);
document.write("<br>map = " + min_y);
</script>
</body>
</html>
回答by Guffa
No, the filtermethod doesn't return the unfiletered array. It returns an array containing the items where the inner function returns true.
不，该filter方法不会返回未过滤的数组。它返回一个数组，其中包含内部函数返回 true 的项目。
As you are not returning a boolean value from the inner function, the value is converted to boolean, so the object reference is converted to true. Thus, it returns a new array that contains all the items from the original array.
由于您没有从内部函数返回布尔值，因此该值将转换为布尔值，因此对象引用将转换为 true。因此，它返回一个包含原始数组中所有项目的新数组。
The filtermethod doesn't do the same as the mapmethod. The mapmethod is used to convert each item of an array, while the filtermethod is used to select certain items of an array. Comparing the performance between the methods is moot, as only one of them does what you want to do.
该filter方法与map方法不同。该map方法用于转换数组的每一项，而该filter方法用于选择数组的某些项。比较这些方法之间的性能没有实际意义，因为只有其中一种方法可以做您想做的事情。
回答by Nayagam
Quoted from:
引用自：
JavaScript: The Definitive Guide
by David Flanagan
JavaScript: The Definitive Guide
by David Flanagan
map()
The
map()method passes each element of the array on which it is invoked to the function you specify, and returns an array containing the values returned by that function.For example:
a = [1, 2, 3]; b = a.map(function(x) { return x*x; }); // b is [1, 4, 9]The function you pass to map() is invoked in the same way as a function passed to forEach(). For the map() method, however, the function you pass should return a value.Note that map() returns a new array: it does not modify the array it is invoked on. If that array is sparse, the returned array will be sparse in the same way: it will have the same length and the same missing elements.
filter()
The method returns an array containing a subset of the elements of the array on which it is invoked. The function you pass to it should be predicate: a function that returns true or false. The predicate is invoked just as for forEach() and map(). If the return value is true , or a value that converts to true, then the element passed to the predicate is a member of the subset and is added to the array that will become the return value.
Examples:
a = [5, 4, 3, 2, 1]; smallvalues = a.filter(function(x) { return x < 3 }); // [2, 1] everyother = a.filter(function(x,i) { return i%2==0 }); // [5, 3, 1]
地图（）
该
map()方法将调用它的数组的每个元素传递给您指定的函数，并返回一个包含该函数返回值的数组。例如：
a = [1, 2, 3]; b = a.map(function(x) { return x*x; }); // b is [1, 4, 9]传递给 map() 的函数的调用方式与传递给 forEach() 的函数的调用方式相同。但是，对于 map() 方法，您传递的函数应该返回一个值。注意 map() 返回一个新数组：它不会修改调用它的数组。如果该数组是稀疏的，则返回的数组将以相同的方式稀疏：它将具有相同的长度和相同的缺失元素。
筛选（）
该方法返回一个数组，其中包含调用它的数组元素的子集。你传递给它的函数应该是谓词：一个返回真或假的函数。谓词就像 forEach() 和 map() 一样被调用。如果返回值为 true 或转换为 true 的值，则传递给谓词的元素是子集的成员，并添加到将成为返回值的数组中。
例子：
a = [5, 4, 3, 2, 1]; smallvalues = a.filter(function(x) { return x < 3 }); // [2, 1] everyother = a.filter(function(x,i) { return i%2==0 }); // [5, 3, 1]
