Как написать метод расширения в JavaScript

Следующий код добавляет метод к объекту Array.

Array.prototype.remove = function (index) {
  const temp = [].concat(this);
  return [].concat(temp.slice(0, index)).concat(temp.slice(index + 1));
};

let arr = [0, 1, 2, 3, 4, 5];
console.info(arr.remove(3))

Механизм работает: метод remove возвращает новый массив, отличный от исходного, в котором удален элемент, помещенный по индексу index.

Я хотел бы переписать метод remove так, чтобы он изменял начальный массив и возвращал удаленный элемент, точно так же, как ведет себя метод Array.prototype.pop.

    Array.prototype.remove = function (index) {...};
    let arr = [0, 1, 2, 3, 4, 5];
    let removed = arr.remove(3);
    console.info({arr, removed}); // arr: [0, 1, 2, 4, 5], removed: 3

Какова техника достижения такого результата?

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
0
66
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Использование метода splice в массиве для удаления одного элемента из него index.
Метод splice вернет массив с удаленными элементами (в нашей ситуации это просто массив с одним элементом), вы можете получить доступ к элементу по индексу 0

Array.prototype.remove = function (index) {
  const removedItems = this.splice(index, 1);
  return removedItems[0];
};

Как поделился @jsejcksn, для Typescript

interface Array<T> { remove(index: number): T | undefined; }

@AkiraTakeshi Обязательно обратите внимание на определенное поведение первого параметра для Array.prototype.splice() — особенно в тех случаях, когда это отрицательное число.

jsejcksn 29.04.2024 12:32

Вот типы, если вы хотите включить их в свой ответ: tsplay.dev/wE0vvW (Это не мой отрицательный голос!)

jsejcksn 29.04.2024 12:35

Другие вопросы по теме

Похожие вопросы

Как я могу показать только одно предупреждение о нескольких удалениях в angular?
Показывать заголовок дня на временной шкале
Выпадающее меню закрывается при открытии другого
Захват пар ключ/значение объектной строки (аналогично JSON) с использованием регулярного выражения
Нужно ли мне возвращать что-то важное из случаев переключения или этого достаточно, чтобы различать разные PHP?
Как исправить данные, которые не отображаются на странице, но отображаются при предварительном просмотре в сети
Преобразовать список массивов внутри объекта в элементы div, содержащие до четырех элементов в React
Пользовательский клик передается только один раз в JavaScript вместе с другим поведением
Vue Quill css применяется только к моему первому компоненту Quill Editor + как настроить панель инструментов
Ошибка Alpine.js «paginationData не определена» в компоненте Laravel Jetstream