Jerome Carter Jerome Carter - 4 months ago 8
Javascript Question

How Do I Separate an Array in Typescript

I'm creating an application with Angular2, and I have an array of parties.

const PARTIES: Party[] = [
{ id: 1, title: "Main Event", description: "The biggest, most extravagant event in the last 10,000,000 years." },
{ id: 2, title: "Secondary Event", description: "The not as biggest, less extravagant event in the last 10,000,000 years." },
{ id: 3, title: "Another Event", description: "N/A" },
{ id: 4, title: "Another Event", description: "N/A" },
{ id: 5, title: "Another Event", description: "N/A" },
{ id: 6, title: "Another Event", description: "N/A" },
{ id: 7, title: "Another Event", description: "N/A" },
{ id: 8, title: "Another Event", description: "N/A" },
{ id: 9, title: "Another Event", description: "N/A" },
{ id: 10, title: "Another Event", description: "N/A" }
];


While preserving the original array, I would like to split this array up into segments of 3.

In plain old JavaScript, I would use the following.

var chunk_size = 3;
var arr = PARTIES;
var groups = arr.map(function(e,i){
return i%chunk_size===0 ? arr.slice(i,i+chunk_size) : null;
})
.filter(function(e){ return e; });
PARTIES = groups


However, I'm using TypeScript. Is there any possible way to perform what I'm trying to achieve using TypeScript?

Answer

Your JavaScript code:

var chunk_size = 3;
var arr = PARTIES;
var groups = arr.map(function(e,i){
    return i%chunk_size===0 ? arr.slice(i,i+chunk_size) : null;
})
.filter(function(e){ return e; });
PARTIES = groups

Is not correct. If it was it would be valid TypeScript and it would just work because JavaScript is TypeScript https://basarat.gitbooks.io/typescript/content/docs/why-typescript.html :)

Fix

The following is a working sample :

const PARTIES = [
  { id: 1, title: "Main Event", description: "The biggest, most extravagant event in the last 10,000,000 years." },
  { id: 2, title: "Secondary Event", description: "The not as biggest, less extravagant event in the last 10,000,000 years." },
  { id: 3, title: "Another Event", description: "N/A" },
  { id: 4, title: "Another Event", description: "N/A" },
  { id: 5, title: "Another Event", description: "N/A" },
  { id: 6, title: "Another Event", description: "N/A" },
  { id: 7, title: "Another Event", description: "N/A" },
  { id: 8, title: "Another Event", description: "N/A" },
  { id: 9, title: "Another Event", description: "N/A" },
  { id: 10, title: "Another Event", description: "N/A" }
];

var chunk_size = 3;
const groups = PARTIES.map(function(e,i){
    return i%chunk_size===0 ? PARTIES.slice(i,i+chunk_size) : null;
})
.filter(x=>!!x)

console.log(groups);

Some notes on the fixes: