以优雅的方式基于模型的属性迭代 backbone 集合
Iterate over a backbone collection based on properties of models in an elegant way
我有一个 backbone 集合,基于集合中模型的属性,我遍历集合并将其显示在 UI.
逻辑是,如果模型有 属性 isNewCar
作为 true
,我将首先在 UI 中显示它们,然后是分隔符,然后我'将显示具有 属性 isNewCar
的所有模型为 false
。
this.cars.forEach(function (car, index)
{
if(car.isNewCar()){ //IF A NEW CAR
//some logic.
//Attach current view in DOM with this model's properties
}
});
//Here, Attach some separator in DOM
this.cars.forEach(function (car, index)
{
if(!car.isNewCar()){ //IF 'NOT' A NEW CAR
//some logic.
//Attach current view in DOM with this model's properties
}
});
这看起来很乱,我知道它不是那么优雅,有人可以建议一个更好的方法来用一些优雅的解决方案替换上面的代码吗?
我建议有一个通用的渲染逻辑来在单独的函数中渲染项目,比如 renderCars() 并按如下方式过滤集合
function filterCars(isNew) {
var isNewCar = isNew
return function(car) {
return (car.isNewCar() === isNewCar);
}
}
renderCars (this.cars.filter(filterCars(true)) );
renderCars (this.cars.filter(filterCars(false)) );
我们上面所做的只是创建了一个辅助函数 filterCars,它使用一个布尔值来决定我们是否需要新车。这个辅助函数 returns 一个用于过滤汽车的函数。
Backbone过滤器使用下划线过滤器,即returns过滤结果的新数组。我将其传递给通用渲染函数。
我没有对此进行测试,但这应该有助于清除一些重复的代码。
我有一个 backbone 集合,基于集合中模型的属性,我遍历集合并将其显示在 UI.
逻辑是,如果模型有 属性 isNewCar
作为 true
,我将首先在 UI 中显示它们,然后是分隔符,然后我'将显示具有 属性 isNewCar
的所有模型为 false
。
this.cars.forEach(function (car, index)
{
if(car.isNewCar()){ //IF A NEW CAR
//some logic.
//Attach current view in DOM with this model's properties
}
});
//Here, Attach some separator in DOM
this.cars.forEach(function (car, index)
{
if(!car.isNewCar()){ //IF 'NOT' A NEW CAR
//some logic.
//Attach current view in DOM with this model's properties
}
});
这看起来很乱,我知道它不是那么优雅,有人可以建议一个更好的方法来用一些优雅的解决方案替换上面的代码吗?
我建议有一个通用的渲染逻辑来在单独的函数中渲染项目,比如 renderCars() 并按如下方式过滤集合
function filterCars(isNew) {
var isNewCar = isNew
return function(car) {
return (car.isNewCar() === isNewCar);
}
}
renderCars (this.cars.filter(filterCars(true)) );
renderCars (this.cars.filter(filterCars(false)) );
我们上面所做的只是创建了一个辅助函数 filterCars,它使用一个布尔值来决定我们是否需要新车。这个辅助函数 returns 一个用于过滤汽车的函数。
Backbone过滤器使用下划线过滤器,即returns过滤结果的新数组。我将其传递给通用渲染函数。
我没有对此进行测试,但这应该有助于清除一些重复的代码。