The following are a couple examples of some common array opperations done in the Miva Template Language.
They include a couple example problems and illustrate some different ways of providing a solution in MVT.
There are also JavaScript examples of the same problems & solutions to help bridge the MVT concepts for people that are more familiar with JavaScript.
- Sample Data
- Does the outfit list have a T-Shirt in it?
- mvt:foreach
- miva_array_search
- js
- for
- Array.forEach
- Array.some
- Which items in the outfit are blue?
- mvt:foreach
- miva_array_filter
- js
- for
- Array.forEach
- Array.filter
- Sum up the prices & quantities for each color of item in the outfit.
- mvt:foreach
- miva_array_filter_ref
- js
- for
- Array.forEach
- Array.reduce
<mvt:capture variable="l.outfit_products_json">
[
{
"name": "Hat",
"color": "Black",
"price": 19.99
},
{
"name": "T-Shirt",
"color": "Blue",
"price": 14.99
},
{
"name": "T-Shirt",
"color": "Blue",
"price": 15.99
},
{
"name": "Pants",
"color": "Blue",
"price": 39.99
},
{
"name": "Socks",
"color": "Black",
"price": 5.99
},
{
"name": "Socks",
"color": "Black",
"price": 5.99
},
{
"name": "Shoes",
"color": "Black",
"price": 39.99
}
]
</mvt:capture>
<mvt:assign name="l.result" value="miva_json_decode( l.outfit_products_json, l.settings:outfit_products )" />
var outfit_products = [
{
name: "Hat",
color: "Black",
price: 19.99
},
{
name: "T-Shirt",
color: "Blue",
price: 14.99
},
{
name: "T-Shirt",
color: "Blue",
price: 15.99
},
{
name: "Pants",
color: "Blue",
price: 39.99
},
{
name: "Socks",
color: "Black",
price: 5.99
},
{
name: "Socks",
color: "Black",
price: 5.99
},
{
name: "Shoes",
color: "Black",
price: 39.99
}
];<mvt:assign name="l.found_shirt" value="0" />
<mvt:foreach iterator="product" array="outfit_products">
<mvt:if expr="l.settings:product:name EQ 'T-Shirt'">
<mvt:assign name="l.found_shirt" value="1" />
<mvt:foreachstop />
</mvt:if>
</mvt:foreach><mvt:assign name="l.found_shirt" value="miva_array_search( l.settings:outfit_products, 0, l.product, 'l.product:name EQ \'T-Shirt\'' ) GT 0" />var found_shirt = false;
for (var i = 0, len = outfit_products.length; i < len; i++) {
var product = outfit_products[i];
if( product.name === 'T-Shirt' ) {
found_shirt = true;
break;
}
}var found_shirt = false;
outfit_products.forEach(function(product){
if( product.name === 'T-Shirt' ) {
found_shirt = true;
}
});var found_shirt = outfit_products.some(function(product){
return product.name === 'T-Shirt';
});<mvt:foreach iterator="product" array="outfit_products">
<mvt:if expr="l.settings:product:color EQ 'Blue'">
<mvt:assign name="l.result" value="miva_array_insert( l.blue_products, l.settings:product, -1 )" />
</mvt:if>
</mvt:foreach><mvt:assign name="l.count" value="miva_array_filter( l.settings:outfit_products, 0, l.product, 'l.product:color EQ \'Blue\'', l.blue_products )" />var blue_products = [];
for (var i = 0, len = outfit_products.length; i < len; i++) {
var product = outfit_products[i];
if( product.color === 'Blue' ) {
blue_products.push(product);
}
}var blue_products = [];
outfit_products.forEach(function(product){
if( product.color === 'Blue' ) {
blue_products.push(product);
}
});var blue_products = outfit_products.filter(function(product){
return product.color === 'Blue';
});<mvt:comment>It's not possible or recommended to even try this</mvt:comment><mvt:foreach iterator="outfit_product" array="outfit_products">
<mvt:assign name="l.existing_color_item_count" value="miva_array_filter_ref( l.color_items, 1, l.color_item, 'l.color_item:color EQ l.settings:outfit_product:color', l.existing_color_items )" />
<mvt:if expr="l.existing_color_item_count">
<mvt:assign name="l.existing_color_items[1]:total_quantity" value="l.existing_color_items[1]:total_quantity + 1" />
<mvt:assign name="l.existing_color_items[1]:total_price" value="l.existing_color_items[1]:total_price + l.settings:outfit_product:price" />
<mvt:else>
<mvt:assign name="l.new_color_item" value="''" />
<mvt:assign name="l.new_color_item:color" value="l.settings:outfit_product:color" />
<mvt:assign name="l.new_color_item:total_quantity" value="1" />
<mvt:assign name="l.new_color_item:total_price" value="l.settings:outfit_product:price" />
<mvt:assign name="l.result" value="miva_array_insert( l.color_items, l.new_color_item, -1 )" />
</mvt:if>
</mvt:foreach>var totals = {};
for (var i = 0, len = outfit_products.length; i < len; i++) {
var product = outfit_products[i];
if( typeof totals[product.color] === 'object' ){
totals[product.color].total_quantity++;
totals[product.color].total_price += product.price;
}
else {
totals[product.color] = {
total_quantity: 1,
total_price: product.price
};
}
}var totals = {};
outfit_products.forEach(function(product){
if( typeof totals[product.color] === 'undefined' ){
totals[product.color] = {
total_quantity: 1,
total_price: product.price
};
}
else {
totals[product.color].total_quantity++;
totals[product.color].total_price += product.price;
}
});var totals = outfit_products.reduce(function(accumulator_totals, product){
if( typeof accumulator_totals[product.color] === 'object' ){
accumulator_totals[product.color].total_quantity++;
accumulator_totals[product.color].total_price += product.price;
}
else {
accumulator_totals[product.color] = {
total_quantity: 1,
total_price: product.price
};
}
return accumulator_totals
}, {});