How to configure an array iteration with mustache? - javascript

I have an array like this:
array = [0, 1, 2, 3, 4, 5, 6, 7]
And 2 configuration variables:
var start = 2;
var count = 3;
And I want mustache to render the array exactly as the configuration demands to. My template is like this:
{#array}
<p>{.}</p>
{/array}
I want my output to be this one:
<p>2</p>
<p>3</p>
<p>4</p>
How can I achieve that?

In your javascript you need to build subset of data using your start and count. For this you can use a library like underscore.js as shown below:
var array = [0, 1, 2, 3, 4, 5, 6, 7];
var start = 2, count=3;
var subset = _.range(start, start+count);
Then your Mustache template can be passed with the subset variable. You need to keep your Mustache templates as simple as possible.

Related

Constant Array in JavaScript

How can I keep an array of constants in JavaScript?
And likewise, when comparing, it gives me the correct result.
Example,
const vector = [1, 2, 3, 4];
vector[2] = 7; // An element is not constant!
console.log(JSON.stringify(vector));
// [1,2,7,4] ... Was edited
// OR
const mirror = [1, 2, 7, 4];
console.log(`are equals? ${vector == mirror}`);
// false !
With Object.freeze you can prevent values from being added or changed on the object:
'use strict';
const vector = Object.freeze([1, 2, 3, 4]);
vector[2] = 7; // An element is not constant!
'use strict';
const vector = Object.freeze([1, 2, 3, 4]);
vector.push(5);
That said, this sort of code in professional JS is unusual and a bit overly defensive IMO. A common naming convention for absolute constants is to use ALL_CAPS, eg:
const VECTOR =
Another option for larger projects (that I prefer) is to use TypeScript to enforce these sorts of rules at compile-time without introducing extra runtime code. There, you can do:
const VECTOR: ReadonlyArray<Number> = [1, 2, 3, 4];
or
const VECTOR = [1, 2, 3, 4] as const;
I have not investigated thoroughly, but it is inferred that JS will have immutable native types, here is a presentation:
https://2ality.com/2020/05/records-tuples-first-look.html
const vector = #[1, 2, 3, 4]; // immutable
The const keyword can be confusing, since it allows for mutability. What you would need is immutability. You can do this with a library like Immutable or Mori, or with Object.freeze:
const array = [1,2,3]
Object.freeze(array)
array[0] = 4
array // [1,2,3]

How to access this array in javascript

I would like the code to be able to access the string "carros", in the following array:
var ourArray = [["carros", 4], 5, "casa"];
You'd get the first element with index 0, then the first element of that array with index 0:
var ourArray = [["carros", 4], 5, "casa"];
console.log(ourArray[0][0]);

Javascript Sub-Array

I recently ran into the problem where I would like to select multiple elements from an array, to return a sub-array. For example, given the array:
a = [1, 5, 1, 6, 2, 3, 7, 8, 3]
And the index array of:
i = [3, 5, 6]
I want to select all elements in a, who's index appears in i. So the output in my simple example would be:
[6, 3, 7]
I completely realise I could use a for loop over i and construct a new array then use Array.push(a[index (in i)]) to add in each, but I was wondering if there was a clearer/cleaner way to achieve this (possibly using underscore.js, or something similar).
i.map(function(x) { return a[x]; })
// => [6, 3, 7]
You can try this
a = [1, 5, 1, 6, 2, 3, 7, 8, 3];
i = [3,5,6];
var res= []; //for show result array
for (var n in a){ //loop a[]
for(var index in i){ //loop i[]
if( n == i[index] ) //n is index of a[]
res.push(a[n]); //add array if equal n index and i[] value
}
}
alert(res); // 6,3,7
You could use map function to achieve your desired result.
var a = [1, 5, 1, 6, 2, 3, 7, 8, 3];
var i = [3, 5, 6];
var mapped = i.map(function(index) {
return a[index];
});
console.log(mapped);
Here is the working jsfiddle.
However with above example, map not be available in all browsers yet. Here is the quote from documentation of map.
map was added to the ECMA-262 standard in the 5th edition; as such it
may not be present in all implementations of the standard.
If your code will be running in old browsers then you will need to add a polyfill. However there are libraries that give you similar functionality with polyfills for older browsers. Along with map function, underscodejs has tons of other helpful functions. I higly recommend you to look at what underscorejs has to offer. It provides tons of helper functions and has quite wide range browser support.
You would do following in underscorejs and wont have to worry if your code works in cross browsers.
var a = [1, 5, 1, 6, 2, 3, 7, 8, 3];
var mapped = _.map([3, 5, 6], function(index) {
return a[index];
});
alert(mapped);
Here is jsfiddle for that.

JavaScript Array Index Insertion when out of index

How could I insert an array of items into an existing array if the start index is outside the bounds of the array I'm inserting.
For example:
[ 1, 2, 3 ]
I need to insert at index 10. I tried something like this:
Array.prototype.splice.apply(curData, [newData[0].index, 0].concat(newData));
but it respected the array bounds. This COULD be accomplished with a for loop but i'd say it wouldn't be very performant at all. Any ideas?
arrOne = [1, 2, 3];
arrTwo = [10, 11, 12, 13];
arrOne[9] = undefined;
arrOne.concat(arrTwo);

Auto-formatting Javascript arrays into new lines in Aptana Studio 3

It seems that Aptana Studio 3 only has the option for auto-formatting Javascript arrays into one line. I was wondering if there is a way to make Aptana Studio 3 auto-format Javascript arrays into a new line for each array element (similar to the option for auto-formatting php arrays - "Insert new line between array creation elements").
For example, I want
var dataset = [1, 2, 3, 4];
to become
var dataset = [1,
2,
3,
4];
What I usually do in Aptana is this:
var dataset = [
//
1,
//
2,
//
3,
//
4
//
];
And Aptana is dumb enough to be smart about not trying to interpolate with line comments.
Then you can even have:
var dataset = [
//
[1, 3, 5, 7, 9],
//
[2, 4, 6, 8, 0],
//
'Some string here',
//
function( ) {
return 'even a function';
}
//
];
try this,
var dataset = [1,//
2,//
3,//
4];
Aptana doesnt put it in one line, if its followed by a comment.

Categories

Resources