Seeking out the index of each instance of a specific element within an array using Ramda.js techniques

Question

Seeking out the index of each instance of a specific element within an array using Ramda.js techniques

I am currently attempting to locate the index of all occurrences of both Header and Footer within an array.

var arr = [
'data',
'data',
'data',
'data',
'Header',
'data',
'data',
'data',
'Footer',
'data',
'Header',
'data',
'Footer',
'data'
];

While I am familiar with how to achieve this using vanilla JavaScript (How to find index of all occurrences of element in array?), I am curious to see how it can be accomplished using functional programming, specifically with ramda.js.

I have been able to find the index of the first occurrence using

R.findIndex(R.test(_regexForHeader))

, but I am struggling to figure out how to loop through the entire array. Any assistance would be greatly appreciated.

javascript arrays ramda.js

Answer 1

Answer №1

@pierrebeitz's response is spot-on, especially when it comes to needing access to indices while looping through a list. Ramda offers an R.addIndex function that can be used to customize functions like map to include the index along with each element during iteration.

If you prefer, you can simplify the nesting in the example by using a composition pipeline:

const zipWithIndex = addIndex(map)(pair);

const isHeaderOrFooter = either(equals('Header'), equals('Footer'));

const hfIndices = pipe(
  zipWithIndex,
  filter(pipe(head, isHeaderOrFooter)),
  map(nth(1))
);

hfIndices(arr);

However, it's important to note that both of these methods require iterating over the list multiple times. While this may not be an issue for smaller lists, it's worth considering using R.into for larger lists, as it combines the map and filter operations into a transducer, allowing for a more efficient single pass over the list (check out for a good introduction to transducers).

To implement this with the previous example, simply switch the composition from pipe to compose (since transducer functions compose in reverse order) and wrap it with into.

const hfIndices = into([], compose(
  zipWithIndex,
  filter(pipe(head, isHeaderOrFooter)),
  map(nth(1))
));

Answer 2

@pierrebeitz's response is spot-on, especially when it comes to needing access to indices while looping through a list. Ramda offers an R.addIndex function that can be used to customize functions like map to include the index along with each element during iteration.

If you prefer, you can simplify the nesting in the example by using a composition pipeline:

const zipWithIndex = addIndex(map)(pair);

const isHeaderOrFooter = either(equals('Header'), equals('Footer'));

const hfIndices = pipe(
  zipWithIndex,
  filter(pipe(head, isHeaderOrFooter)),
  map(nth(1))
);

hfIndices(arr);

However, it's important to note that both of these methods require iterating over the list multiple times. While this may not be an issue for smaller lists, it's worth considering using R.into for larger lists, as it combines the map and filter operations into a transducer, allowing for a more efficient single pass over the list (check out for a good introduction to transducers).

To implement this with the previous example, simply switch the composition from pipe to compose (since transducer functions compose in reverse order) and wrap it with into.

const hfIndices = into([], compose(
  zipWithIndex,
  filter(pipe(head, isHeaderOrFooter)),
  map(nth(1))
));

Answer 3

Answer №2

While I may not be completely immersed in FP, I do believe that in order to manipulate data effectively, you need to first "generate" the data you want to work with. You then need to add an index to apply your filter afterwards:

 var arr = ['data', 'data', 'data', 'data', 'Header', 'data', 'data', 'data', 'Footer', 'data', 'Header', 'data', 'Footer', 'data'];

R.map((e) => e[1], 
  R.filter(val => val[0] == 'Header' || val[0] == 'Footer', 
    R.addIndex(R.map)((e, i) => [e,i], arr)
  )
);
// => [4, 8, 10, 12]

Although this solution may not be the most intricate, it should provide a good starting point for your needs!

Answer 4

While I may not be completely immersed in FP, I do believe that in order to manipulate data effectively, you need to first "generate" the data you want to work with. You then need to add an index to apply your filter afterwards:

 var arr = ['data', 'data', 'data', 'data', 'Header', 'data', 'data', 'data', 'Footer', 'data', 'Header', 'data', 'Footer', 'data'];

R.map((e) => e[1], 
  R.filter(val => val[0] == 'Header' || val[0] == 'Footer', 
    R.addIndex(R.map)((e, i) => [e,i], arr)
  )
);
// => [4, 8, 10, 12]

Although this solution may not be the most intricate, it should provide a good starting point for your needs!

Seeking out the index of each instance of a specific element within an array using Ramda.js techniques

Answer №1

Answer №2

Similar questions

What is the best way to divide an array while extracting data from a JSON object using

Updating information within an ArcGIS Service using REST and JSON using jQuery/JavaScript

What is the best way to retrieve the outcome of a node-sqlite3 query beyond the scope of db.get()?

Angular 5 offers the ability to incorporate dynamic checkbox input into your application

Steps to remove a specific child element using jQuery:

Tips for creating an Enumerable 'similarity' search using linq.js

Failed to establish Modbus TCP connection

Why does Res.send return an empty object when console.log indicates it is not empty?

Ways to add a string to an array as a labeled object in javascript?

Unable to perform dynamic query with $in operator in Mongoose find method

Troubleshooting inactive CSS hover animation

Transitioning to Meteor and React or Immigrating to Meteor

What is the process for retrieving my dates from local storage and displaying them without the time?

Why are the UI components (`Card Number`, `MM/YY`, `CVC`) not being displayed in the React app when using Card

Combining Multiple .ts Files into a Single File: A Simplified Application Structure with TypeScript 1.8

Is there a way to customize event property setters such as event.pageX in JavaScript?

Invalid index when trying to add to an array

What is the process for requiring web workers in npm using require()?

Determining the unique values within a sub-array across various queries

Guide to integrating the Google identity services library in a React application