问题描述
在此处提出以下问题：
我创建了一些使用knockout的复选框，允许从数组中进行选择。从上面的帖子中获取的
工作小提琴：
I've created some checkboxes using knockout that allow selection from an array.working fiddle taken from above post:
是否有一种简单的创建方式只是水果的ID的数组？
Is there a simple way of creating an array of just the fruit's ID's?
我在C＃的家里更多，我会按照 selectedFruits.select（水果）做点什么=> fruit.id）;
I'm more at home with C# where I would do something along the lines of selectedFruits.select(fruit=>fruit.id);
是否有一些方法/现成函数用于执行与javascript / jquery类似的操作？或者最简单的选择是循环遍历列表并创建第二个数组？
我打算用JSON将数组发回服务器，所以我试图最小化发送的数据。
Is there some method/ready made function for doing something similar with javascript/jquery? Or would the simplest option be to loop through the list and create a second array?I intend to post the array back to the server in JSON so am trying to minimize the data sent.
推荐答案
是的，或做同样的事情。
Yes, Array.map() or $.map() does the same thing.
//array.map:
var ids = this.fruits.map(function(v){
return v.Id;
});
//jQuery.map:
var ids2 = $.map(this.fruits, function (v){
return v.Id;
});
console.log(ids, ids2);
由于旧浏览器不支持array.map，我建议你坚持使用jQuery方法。
Since array.map isn't supported in older browsers, I suggest that you stick with the jQuery method.
如果你因为某些原因更喜欢另一个，你可以随时添加一个polyfill用于旧的浏览器支持。
If you prefer the other one for some reason you could always add a polyfill for old browser support.
您也可以随时向数组原型添加自定义方法：
You can always add custom methods to the array prototype as well:
Array.prototype.select = function(expr){
var arr = this;
//do custom stuff
return arr.map(expr); //or $.map(expr);
};
var ids = this.fruits.select(function(v){
return v.Id;
});
如果你使用函数构造函数的扩展版本传递一个字符串。或许可以解决的问题：
An extended version that uses the function constructor if you pass a string. Something to play around with perhaps:
Array.prototype.select = function(expr){
var arr = this;
switch(typeof expr){
case 'function':
return $.map(arr, expr);
break;
case 'string':
try{
var func = new Function(expr.split('.')[0],
'return ' + expr + ';');
return $.map(arr, func);
}catch(e){
return null;
}
break;
default:
throw new ReferenceError('expr not defined or not supported');
break;
}
};
console.log(fruits.select('x.Id'));
更新：
由于这已成为如此受欢迎的答案，我正在添加类似的我的其中（） + firstOrDefault（）。这些也可以与基于字符串的函数构造函数方法（这是最快的）一起使用，但这是使用对象文字作为过滤器的另一种方法：
Since this has become such a popular answer, I'm adding similar my where() + firstOrDefault(). These could also be used with the string based function constructor approach (which is the fastest), but here is another approach using an object literal as filter:
Array.prototype.where = function (filter) {
var collection = this;
switch(typeof filter) {
case 'function':
return $.grep(collection, filter);
case 'object':
for(var property in filter) {
if(!filter.hasOwnProperty(property))
continue; // ignore inherited properties
collection = $.grep(collection, function (item) {
return item[property] === filter[property];
});
}
return collection.slice(0); // copy the array
// (in case of empty object filter)
default:
throw new TypeError('func must be either a' +
'function or an object of properties and values to filter by');
}
};
Array.prototype.firstOrDefault = function(func){
return this.where(func)[0] || null;
};
用法：
var persons = [{ name: 'foo', age: 1 }, { name: 'bar', age: 2 }];
// returns an array with one element:
var result1 = persons.where({ age: 1, name: 'foo' });
// returns the first matching item in the array, or null if no match
var result2 = persons.firstOrDefault({ age: 1, name: 'foo' });
这是来比较函数构造函数和对象文字速度。如果您决定使用前者，请记住正确引用字符串。
Here is a jsperf test to compare the function constructor vs object literal speed. If you decide to use the former, keep in mind to quote strings correctly.
我个人的偏好是在过滤1-2个属性时使用基于对象文字的解决方案，并且传递回调函数以进行更复杂的过滤。
My personal preference is to use the object literal based solutions when filtering 1-2 properties, and pass a callback function for more complex filtering.
在向本机对象原型添加方法时，我将以2个一般提示结束：
I'll end this with 2 general tips when adding methods to native object prototypes:
-
在覆盖之前检查现有方法的发生，例如：
Check for occurrence of existing methods before overwriting e.g.:
if（！ Array.prototype.where）{
Array.prototype.where = ...
如果你不这样做需要支持IE8及以下版本，使用使它们不可枚举。如果有人在数组上使用 for..in （首先是错误的）
他们也会迭代可枚举的属性。只是抬头。
If you don't need to support IE8 and below, define the methods using Object.defineProperty to make them non-enumerable. If someone used for..in on an array (which is wrong in the first place)they will iterate enumerable properties as well. Just a heads up.
这篇关于Javascript相当于C＃LINQ Select的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！