Как заменить элемент в массиве с помощью Javascript?

315

Каждый элемент этого массива является некоторым числом.

var items = Array(523,3452,334,31, ...5346);

Как заменить некоторое число в массиве новым?

Например, мы хотим заменить 3452 на 1010, как бы мы это сделали?

Джеймс
источник
5
Есть ли несколько экземпляров 3452, которые нужно изменить, или только один?
mellamokb
53
Будет один случай, если темные силы не добавят еще один.
Джеймс
2
Когда есть замена строки, почему нет replaceметода для массивов?
спасательный круг

Ответы:

465
var index = items.indexOf(3452);

if (index !== -1) {
    items[index] = 1010;
}

Также рекомендуется не использовать метод конструктора для инициализации ваших массивов. Вместо этого используйте буквальный синтаксис:

var items = [523, 3452, 334, 31, 5346];

Вы также можете использовать ~оператор, если вы в лаконичном JavaScript и хотите сократить -1сравнение:

var index = items.indexOf(3452);

if (~index) {
    items[index] = 1010;
}

Иногда мне даже нравится писать containsфункцию для абстрагирования этой проверки и облегчения понимания того, что происходит. Что удивительно, так это то, что он работает с массивами и строками:

var contains = function (haystack, needle) {
    return !!~haystack.indexOf(needle);
};

// can be used like so now:
if (contains(items, 3452)) {
    // do something else...
}

Начиная с ES6 / ES2015 для строк и предлагая ES2016 для массивов, вы можете легче определить, содержит ли источник другое значение:

if (haystack.includes(needle)) {
    // do your thing
}
Eli
источник
9
Просто думал , что я дал бы версию ES6 из contains: var contains = (a, b) => !!~a.indexOf(b): P
Флори
1
@ geon не могли бы вы объяснить недостатки?
Карл Тейлор
1
@KarlTaylor Это просто не очень идиоматично. Если вы можете использовать ES2017, используйте Array.prototype.includesвместо этого.
Geon
1
я могу использовать IndexOf с элементами объекта?
ValRob
2
@ValRob нет, но вы можете использовать, inчтобы увидеть, есть ли у объекта ключ (например, 'property' in obj), или вы также можете перебирать значения объекта с помощью Object.values(obj).forEach(value => {}).
Эли
95

Array.indexOf()Метод заменяет первый экземпляр. Чтобы получить каждый экземпляр, используйте Array.map():

a = a.map(function(item) { return item == 3452 ? 1010 : item; });

Конечно, это создает новый массив. Если вы хотите сделать это на месте, используйте Array.forEach():

a.forEach(function(item, i) { if (item == 3452) a[i] = 1010; });
gilly3
источник
7
Для всех, кто читает это. И map (), и forEach () являются более новыми дополнениями к спецификации Javascript и отсутствуют в некоторых старых браузерах. Если вы хотите их использовать, вам, возможно, придется добавить код совместимости для старых браузеров: developer.mozilla.org/en/JavaScript/Reference/Global_Objects/…
jfriend00
2
Array.indexOf()был введен одновременно с map()и forEach(). Если вы поддерживаете IE8 или более раннюю версию и не используете шим для добавления поддержки, лучше ответьте на вопрос mellamokb .
gilly3
array.map также возвращает индекс во втором параметре a = a.map (function (item, key) {if (item == 3452) a [key] = 1010;});
Рикки Шарма
38

Мое предлагаемое решение будет:

items.splice(1, 1, 1010);

Операция сращивания удалит 1 элемент, начиная с позиции 1 в массиве (т.е. 3452), и заменит его новым элементом 1010.

Шимон Агасси
источник
6
Это вводит в заблуждение, поскольку вы указываете, что первый параметр означает, что 1элемент будет удален, тогда как на самом деле первый параметр означает, что операция выполняется с индексом 1. developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
InsOp
28

Используйте indexOf, чтобы найти элемент.

var i = items.indexOf(3452);
items[i] = 1010;
Tesserex
источник
1
Что делать, если это не ожидаемый элемент. если он найден, он вернет индекс найденного элемента, но если нет, он вернет -1. и он собирается установить это значение -1. пожалуйста, обращайтесь по адресу jsbin.com/wugatuwora/edit?js,console
шелха,
23

Легко достигается с помощью forпетли.

for (var i = 0; i < items.length; i++)
    if (items[i] == 3452)
        items[i] = 1010;
mellamokb
источник
9
Легко, но не обязательно эффективно;)
Илай
7
@Eli: OP не было ясно, заменяли ли они один или несколько экземпляров. Мое решение обрабатывает несколько экземпляров.
mellamokb
@ Eli Если что-нибудь, это был бы самый эффективный ответ, отправленный, чтобы заменить все
вхождения
15

Вы можете редактировать любой номер списка, используя индексы

например :

items[0] = 5;
items[5] = 100;
VirtualTroll
источник
11

Если вы используете сложный объект (или даже простой), и вы можете использовать es6, Array.prototype.findIndexэто хороший. Для массива OP, они могли бы сделать,

const index = items.findIndex(x => x === 3452)
items[index] = 1010

Для более сложных объектов это действительно светит. Например,

const index = 
    items.findIndex(
       x => x.jerseyNumber === 9 && x.school === 'Ohio State'
    )

items[index].lastName = 'Utah'
items[index].firstName = 'Johnny'
Yatrix
источник
6

Замена может быть выполнена в одну строку:

var items = Array(523, 3452, 334, 31, 5346);

items[items.map((e, i) => [i, e]).filter(e => e[1] == 3452)[0][0]] = 1010

console.log(items);

Или создайте функцию для повторного использования:

Array.prototype.replace = function(t, v) {
    if (this.indexOf(t)!= -1)
        this[this.map((e, i) => [i, e]).filter(e => e[1] == t)[0][0]] = v;
  };

//Check
var items = Array(523, 3452, 334, 31, 5346);
items.replace(3452, 1010);
console.log(items);

Artee
источник
6

ES6 способ:

const items = Array(523, 3452, 334, 31, ...5346);

Мы хотим заменить 3452с 1010, решением:

const newItems = items.map(item => item === 3452 ? 1010 : item);

Конечно, вопрос стоит много лет назад, а пока я просто предпочитаю использовать неизменное решение, безусловно, это круто ReactJS.

Для частого использования я предлагаю ниже функцию:

const itemReplacer = (array, oldItem, newItem) =>
  array.map(item => item === oldItem ? newItem : item);
AmerllicA
источник
4

Первый способ

Лучший способ в одну строку заменить или обновить элемент массива

array.splice(array.indexOf(valueToReplace), 1, newValue)

Например:

let items = ['JS', 'PHP', 'RUBY'];

let replacedItem = items.splice(items.indexOf('RUBY'), 1, 'PYTHON')

console.log(replacedItem) //['RUBY']
console.log(items) //['JS', 'PHP', 'PYTHON']

Второй метод

Другой простой способ сделать ту же операцию:

items[items.indexOf(oldValue)] = newValue
Гомс
источник
3

Самый простой способ - использовать некоторые библиотеки, такие как underscorejs и map method.

var items = Array(523,3452,334,31,...5346);

_.map(items, function(num) {
  return (num == 3452) ? 1010 : num; 
});
=> [523, 1010, 334, 31, ...5346]
mrded
источник
2
Вид желания lodash / underscore обеспечил массив осведомленности replaceсейчас ..._.replace([1, 2, 3], 2, 3);
Дрооганс
3

Неизменный способ замены элемента в списке с использованием операторов и .sliceметода распространения ES6 .

const arr = ['fir', 'next', 'third'], item = 'next'

const nextArr = [
  ...arr.slice(0, arr.indexOf(item)), 
  'second',
  ...arr.slice(arr.indexOf(item) + 1)
]

Убедитесь, что работает

console.log(arr)     // [ 'fir', 'next', 'third' ]
console.log(nextArr) // ['fir', 'second', 'third']
Пурхало Алекс
источник
2
var items = Array(523,3452,334,31,5346);

Если вы знаете значение, используйте

items[items.indexOf(334)] = 1010;

Если вы хотите знать, присутствует это значение или нет, используйте:

var point = items.indexOf(334);

if (point !== -1) {
    items[point] = 1010;
}

Если вы знаете место (положение), то непосредственно используйте,

items[--position] = 1010;

Если вы хотите заменить несколько элементов, и вы знаете, только означает только начальная позиция,

items.splice(2, 1, 1010, 1220);

для больше о .splice

KarSho
источник
1
var index = Array.indexOf(Array value);
        if (index > -1) {
          Array.splice(index, 1);
        }

отсюда вы можете удалить определенное значение из массива и на основе того же индекса вы можете вставить значение в массив.

 Array.splice(index, 0, Array value);
Гунджан Кумар
источник
1

Хорошо, если кто-то интересуется, как заменить объект из его индекса в массиве, вот решение.

Найдите индекс объекта по его идентификатору:

const index = items.map(item => item.id).indexOf(objectId)

Замените объект с помощью метода Object.assign ():

Object.assign(items[index], newValue)
faye.babacar78
источник
1

Ответ от @ gilly3 отличный.

Как расширить это для массива объектов

Я предпочитаю следующий способ обновления новой обновленной записи в моем массиве записей при получении данных с сервера. Это сохраняет порядок в целости и сохранности.

users = users.map(u => u.id !== editedUser.id ? u : editedUser);

var users = [
{id: 1, firstname: 'John', lastname: 'Sena'},
{id: 2, firstname: 'Serena', lastname: 'Wilham'},
{id: 3, firstname: 'William', lastname: 'Cook'}
];

var editedUser = {id: 2, firstname: 'Big Serena', lastname: 'William'};

users = users.map(u => u.id !== editedUser.id ? u : editedUser);

console.log('users -> ', users);

muasif80
источник
0

Во-первых, перепишите ваш массив следующим образом:

var items = [523,3452,334,31,...5346];

Затем получите доступ к элементу в массиве через его порядковый номер. Формула для определения номера индекса:n-1

Чтобы заменить первый элемент (n=1)в массиве, напишите:

items[0] = Enter Your New Number;

В вашем примере номер 3452находится на второй позиции (n=2). Так что формула для определения номера индекса есть 2-1 = 1. Поэтому напишите следующий код для замены 3452на 1010:

items[1] = 1010;
Энтони Левато
источник
0

Вот основной ответ, превращенный в функцию многократного использования:

function arrayFindReplace(array, findValue, replaceValue){
    while(array.indexOf(findValue) !== -1){
        let index = array.indexOf(findValue);
        array[index] = replaceValue;
    }
}
JohnP2
источник
1
пусть индексировать; while ((index = indexOf (findValue))! == -1), чтобы избежать двойного indexOf (findValue)
Хуан Р
0

Я решил эту проблему, используя циклы for и итерируя по исходному массиву и добавляя позиции совпадающих массивов в другой массив, а затем циклически перебирая этот массив и изменяя его в исходном массиве, затем возвращая его, я использовал и функцию стрелки, но обычную функцию будет работать тоже.

var replace = (arr, replaceThis, WithThis) => {
    if (!Array.isArray(arr)) throw new RangeError("Error");
    var itemSpots = [];
    for (var i = 0; i < arr.length; i++) {
        if (arr[i] == replaceThis) itemSpots.push(i);
    }

    for (var i = 0; i < itemSpots.length; i++) {
        arr[itemSpots[i]] = WithThis;
    }

    return arr;
};
Я. Свек
источник
0
presentPrompt(id,productqty) {
    let alert = this.forgotCtrl.create({
      title: 'Test',
      inputs: [
        {
          name: 'pickqty',
          placeholder: 'pick quantity'
        },
        {
          name: 'state',
          value: 'verified',
          disabled:true,
          placeholder: 'state',

        }
      ],
      buttons: [
        {
          text: 'Ok',
          role: 'cancel',
          handler: data => {

            console.log('dataaaaname',data.pickqty);
            console.log('dataaaapwd',data.state);


          for (var i = 0; i < this.cottonLists.length; i++){

            if (this.cottonLists[i].id == id){
                this.cottonLists[i].real_stock = data.pickqty;

            }
          }

          for (var i = 0; i < this.cottonLists.length; i++){

            if (this.cottonLists[i].id == id){
              this.cottonLists[i].state = 'verified';   

          }
        }
            //Log object to console again.
            console.log("After update: ", this.cottonLists)
            console.log('Ok clicked');
          }
        },

      ]
    });
    alert.present();
  }

As per your requirement you can change fields and array names.
thats all. Enjoy your coding.
mahendren
источник
0

Самый простой способ это.

var items = Array(523,3452,334,31, 5346);
var replaceWhat = 3452, replaceWith = 1010;
if ( ( i = items.indexOf(replaceWhat) ) >=0 ) items.splice(i, 1, replaceWith);

console.log(items);
>>> (5) [523, 1010, 334, 31, 5346]
Владимир Прудников
источник
не работает для предметов, найденных по индексу 0 replaceWhat = 523, replaceWith = 999999, не дает правильных результатов
Энтони Чунг
0

Вот один лайнер. Предполагается, что элемент будет в массиве.

var items = [523, 3452, 334, 31, 5346]
var replace = (arr, oldVal, newVal) => (arr[arr.indexOf(oldVal)] = newVal, arr)
console.log(replace(items, 3452, 1010))

Алекс Кори
источник
0

Если вы хотите простой сахарный синтаксис, вы можете просто:

(elements = elements.filter(element => element.id !== updatedElement.id)).push(updatedElement);

Подобно:

let elements = [ { id: 1, name: 'element one' }, { id: 2, name: 'element two'} ];
const updatedElement = { id: 1, name: 'updated element one' };

Если у вас нет идентификатора, вы можете привести строку в строчку:

(elements = elements.filter(element => JSON.stringify(element) !== JSON.stringify(updatedElement))).push(updatedElement);
Марко Сильва
источник