replaceArrayElementsByIndexesImmutably.md

replaceArrayElementsByIndexesImmutably - Replace array elements by indexes immutably

Creates the copy of target array and replaces the elements by specified indexes. Such functionality is demanded in some JavaScript frameworks which could not observe the mutations of array.

<ArrayElement>(
  sourceData:
      Readonly<
        { targetArray: ReadonlyArray<ArrayElement>; } &
        (
          {
            index: number;
            newElement: ArrayElement;
          } |
          {
            replacements: ReadonlyArray<{
              index: number;
              newElement: ArrayElement;
            }>;
          }
        )
      >
): Array<ArrayElement>

Usage

If you want to replace just one element, you can specify index and newElement at first level of named parameters object:

type Product = { title: string; price: number; };

const sampleArray: Array<Product> = [
  { title: "ALPHA", price: 100 },
  { title: "BRAVO", price: 500 },
  { title: "CHARLIE", price: 1000 },
  { title: "DELTA", price: 1500 }
];

console.log(replaceArrayElementsByIndexesImmutably({
  targetArray: sampleArray,
  index: 2,
  newElement: { title: "GOLF", price: 2000 }
}));

Output:

[
  { title: "ALPHA", price: 100 },
  { title: "BRAVO", price: 500 },
  { title: "GOLF", price: 2000 },
  { title: "DELTA", price: 1500 }
]

If you want to replace the multiple element, specify replacements with array of replacements:

console.log(replaceArrayElementsByIndexesImmutably({
  targetArray: sampleArray,
  replacements: [
    { index: 2, newElement: { title: "GOLF", price: 2000 } },
    { index: 3, newElement: { title: "HOTEL", price: 5000 } }
  ]
}))

Output:

[
  { title: "ALPHA", price: 100 },
  { title: "BRAVO", price: 500 },
  { title: "GOLF", price: 2000 },
  { title: "HOTEL", price: 5000 }
]

Quick inputting

Use Live templates functionality of IntelliJ IDEA family IDEs (including WebStorm sharpened for web development) to input the function calling expression quickly (available in official YDEE plugin):

If target array has been copied to clipboard preliminarily, it will be immediately substituted.