How Do I Separate an Array in Typescript

Question

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?

What makes you think you can't do with TypeScript what you could with JavaScript? — Marty
– Marty, Commented Jul 27, 2016 at 4:05
Could you show me an example of how to implement this functionality if it's so easy? @Marty — Jerome Carter
– Jerome Carter, Commented Jul 27, 2016 at 4:06
Sorry, what I meant was if something was in fact working in JavaScript, it would work perfectly fine in TypeScript as well :-) — Marty
– Marty, Commented Jul 27, 2016 at 4:08
That's understandable, but this code breaks my application @Marty — Jerome Carter
– Jerome Carter, Commented Jul 27, 2016 at 4:08
What errors do you get? As Basarat said, that original code isn't valid anyway which would break your application if it were plain JS as well. — Marty
– Marty, Commented Jul 27, 2016 at 4:09

basarat · Accepted Answer · 2016-07-27 04:09:59Z

5

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:

const cannot be reassigned. So you cannot reassign to PARTIES
the type of PARTIES ([]) is not the same as the types of groups ([][]) so you don't want to assign that anyways
Better to use true boolean in filter instead of truthy / falsy checks. More : https://basarat.gitbooks.io/typescript/content/docs/tips/truthy.html

edited Jul 27, 2016 at 4:09

answered Jul 27, 2016 at 4:06

basarat

278k60 gold badges475 silver badges528 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Jerome Carter Over a year ago

I'm doing it within a class, would that effect it?

Jerome Carter Over a year ago

Thanks, man. I was trying to do it from within a class. @basarat

Collectives™ on Stack Overflow

How Do I Separate an Array in Typescript

1 Answer 1

Fix

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Fix

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related