Manipulating Arrays in JavaScript/Typescript - Populating a new Array based on a specific key from the original

Question

Manipulating Arrays in JavaScript/Typescript - Populating a new Array based on a specific key from the original

In the provided array below: https://i.sstatic.net/HtmTI.png

My objective is to create a new array that starts with the element in the initial array where its name property is 'Raged Barbarian'. I have a solution for this, but I believe there may be a more semantically appropriate approach.

Here is my current method:

  public getNewArr(initialArr) {
    const newArr = [];
    let isRagedBarbarian: boolean = false;
    for (const troop of initialArr) {
      if (troop.name === 'Raged Barbarian') {
        isRagedBarbarian = true;
      } 
      if (isRagedBarbarian === true) {
        newArr.push(troop);
      }
    }

javascript arrays typescript filter iterator

Answer 1

Answer №1

If you're looking to extract a portion of an array based on a specific condition, the combination of the slice function and the findIndex function can be very useful.

const targetIndex = originalArray.findIndex(item => item.name === 'Raged Barbarian');
const extractedArray = originalArray.slice(Math.max(targetIndex, 0));

Answer 2

If you're looking to extract a portion of an array based on a specific condition, the combination of the slice function and the findIndex function can be very useful.

const targetIndex = originalArray.findIndex(item => item.name === 'Raged Barbarian');
const extractedArray = originalArray.slice(Math.max(targetIndex, 0));

Answer 3

Answer №2

If you are looking to extract elements from an array after a certain index, you can utilize the slice method as shown below:

function getModifiedArray(initialArray) {
    const index = initialArray.findIndex(item => item.name === 'Raged Barbarian');
    if(index !== -1) {
       return initialArray.slice(index + 1);
    }
    return [];
}

Answer 4

If you are looking to extract elements from an array after a certain index, you can utilize the slice method as shown below:

function getModifiedArray(initialArray) {
    const index = initialArray.findIndex(item => item.name === 'Raged Barbarian');
    if(index !== -1) {
       return initialArray.slice(index + 1);
    }
    return [];
}

Manipulating Arrays in JavaScript/Typescript - Populating a new Array based on a specific key from the original

Answer №1

Answer №2

Similar questions

PHP: utilizing an array with a conditional statement within

Error: implode() function received invalid arguments

removing the click event from a particular element within a set of classes

Convert Python strings into HTML JavaScript blocks using Jinja2

Meteor is not recognizing the defaultValue property in React

methods for obtaining access in JavaScript when dealing with an ArrayList<Object> that has been converted to a JSONArray

What is the most effective way to tally how many times a specific character appears within a specified section of a string?

Engaging JavaScript Navigation

The canvas remains empty as requestAnimationFrame fails to render any content

Nested Tab Generation on the Fly

Enhance the standard input control in Vue.js by extending it to include features such as

Navigate to a different page after signing in or out without losing any current data or information

ReactJS Error: Rendering objects as a React child is not supported. If you intended to render multiple children, make sure to use an array instead

Currently in the process of developing a Figma plugin that requires retrieving cookies from a website. However, encountered an error while attempting to do so. Seeking solutions to

Developing a new React application with Access Control List (ACL) and encountering an issue with Casl

How can I use React to dynamically generate text fields when a button is clicked, and continue adding more text fields each time the button is clicked again?

Encountering a CORS issue for the second consecutive time when making the identical GET request

When I interact with a button on my View file in CodeIgniter 3.x, I aim to add a record to the database

The Angular Material form field fails to update when there are changes made to the values within the component

React Query successfully retrieves the path, but unfortunately fails to render the image in the display