¿Cómo reemplazar un elemento en una matriz con Javascript?


315

Cada elemento de esta matriz es un número.

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

¿Cómo reemplazo algún número con una matriz nueva?

Por ejemplo, queremos reemplazar 3452 con 1010, ¿cómo haríamos esto?


55
¿Hay varias instancias de 3452 que deben cambiarse, o solo una?
mellamokb

53
Habrá una instancia, si las fuerzas oscuras no agregan una más.
James

2
Cuando hay una cadena de reemplazo, ¿por qué no hay un replacemétodo para las matrices?
Lifebalance

Respuestas:


464
var index = items.indexOf(3452);

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

También se recomienda que no use el método constructor para inicializar sus matrices. En su lugar, use la sintaxis literal:

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

También puedes usar el ~operador si te gusta JavaScript y quieres acortar la -1comparación:

var index = items.indexOf(3452);

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

A veces incluso me gusta escribir una containsfunción para abstraer esta verificación y facilitar la comprensión de lo que está sucediendo. Lo sorprendente es que esto funciona tanto en matrices como en cadenas:

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

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

Comenzando con ES6 / ES2015 para cadenas, y propuesto para ES2016 para matrices, puede determinar más fácilmente si una fuente contiene otro valor:

if (haystack.includes(needle)) {
    // do your thing
}

99
Sólo pensé que le daría una versión de ES6 contains: var contains = (a, b) => !!~a.indexOf(b): P
Florrie

1
@geon, ¿puedes explicar las desventajas?
Karl Taylor

1
@KarlTaylor Simplemente no es muy idiomático. Si puede usar ES2017, use Array.prototype.includesen su lugar.
Geon

1
¿Puedo usar IndexOf con elementos de objeto?
ValRob

2
@ValRob no, pero puede usar inpara ver si un objeto tiene una clave (por ejemplo, 'property' in obj), o también puede recorrer los valores de un objeto con Object.values(obj).forEach(value => {}).
Eli

95

El Array.indexOf()método reemplazará la primera instancia. Para obtener cada instancia use Array.map():

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

Por supuesto, eso crea una nueva matriz. Si desea hacerlo en su lugar, use Array.forEach():

a.forEach(function(item, i) { if (item == 3452) a[i] = 1010; });

77
Para cualquiera que lea esto. Tanto map () como forEach () son nuevas incorporaciones a la especificación Javascript y no están presentes en algunos navegadores más antiguos. Si desea usarlos, es posible que deba agregar un código de compatibilidad para navegadores antiguos: developer.mozilla.org/en/JavaScript/Reference/Global_Objects/…
jfriend00

2
Array.indexOf()fue introducido al mismo tiempo que map()y forEach(). Si es compatible con IE8 o anterior, y no está utilizando una cuña para agregar soporte, mejor vaya con la respuesta de mellamokb .
gilly3

array.map también devuelve el índice en su segundo parámetro a = a.map (function (item, key) {if (item == 3452) a [key] = 1010;});
Ricky sharma

38

Mi solución sugerida sería:

items.splice(1, 1, 1010);

La operación de empalme eliminará 1 elemento, comenzando en la posición 1 de la matriz (es decir 3452), y lo reemplazará con el nuevo elemento 1010.


66
Esto es engañoso ya que connotas que el primer parámetro significa que el 1elemento se eliminará cuando, de hecho, el primer parámetro significa que la operación se lleva a cabo en el índice 1. developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
InsOp


23

Fácilmente logrado con un forbucle.

for (var i = 0; i < items.length; i++)
    if (items[i] == 3452)
        items[i] = 1010;

99
Fácilmente, pero no necesariamente eficientemente;)
Eli

77
@Eli: OP no estaba claro si estaban reemplazando una instancia o varias instancias. Mi solución maneja múltiples instancias.
mellamokb

@Eli En todo caso, esta sería la respuesta más eficiente publicada para reemplazar todas las ocurrencias
Tobiq

15

Puede editar cualquier número de la lista usando índices

por ejemplo :

items[0] = 5;
items[5] = 100;

11

Si usa un objeto complejo (o incluso uno simple) y puede usar es6, Array.prototype.findIndexes bueno. Para la matriz del OP, podrían hacer,

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

Para objetos más complejos, esto realmente brilla. Por ejemplo,

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

items[index].lastName = 'Utah'
items[index].firstName = 'Johnny'

6

El reemplazo se puede hacer en una línea:

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);

O cree una función para reutilizar:

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);


6

Manera ES6 :

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

Queremos reemplazar 3452con 1010, solución:

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

Seguramente, la pregunta es hace muchos años y por ahora solo prefiero usar una solución inmutable , definitivamente, es increíble ReactJS.

Para uso frecuente ofrezco la siguiente función:

const itemReplacer = (array, oldItem, newItem) =>
  array.map(item => item === oldItem ? newItem : item);

4

Primer metodo

La mejor manera en solo una línea para reemplazar o actualizar el elemento de la matriz

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

P.ej:

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

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

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

Segundo método

Otra forma sencilla de hacer la misma operación es:

items[items.indexOf(oldValue)] = newValue

3

La forma más fácil es usar algunas bibliotecas como el subrayado y el método de mapa.

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

_.map(items, function(num) {
  return (num == 3452) ? 1010 : num; 
});
=> [523, 1010, 334, 31, ...5346]

2
Tipo de deseo lodash / subrayado proporcionó una matriz de replace_.replace([1, 2, 3], 2, 3);
reconocimiento

3

La forma inmutable de reemplazar el elemento en la lista utilizando operadores y .slicemétodo de propagación ES6 .

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

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

Verifica que funciona

console.log(arr)     // [ 'fir', 'next', 'third' ]
console.log(nextArr) // ['fir', 'second', 'third']

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

Si conoce el valor, use,

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

Si desea saber si el valor está presente o no, use,

var point = items.indexOf(334);

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

Si conoce el lugar (posición), use directamente,

items[--position] = 1010;

Si desea reemplazar algunos elementos, y sabe que solo la posición inicial solo significa,

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

para más información sobre .splice


1
var index = Array.indexOf(Array value);
        if (index > -1) {
          Array.splice(index, 1);
        }

desde aquí puede eliminar un valor particular de la matriz y, según el mismo índice, puede insertar un valor en la matriz.

 Array.splice(index, 0, Array value);

1

Bueno, si alguien está interesado en cómo reemplazar un objeto de su índice en una matriz, aquí hay una solución.

Encuentre el índice del objeto por su id:

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

Reemplace el objeto usando el método Object.assign ():

Object.assign(items[index], newValue)

1

La respuesta de @ gilly3 es genial.

Cómo extender esto para una matriz de objetos

Prefiero la siguiente forma de actualizar el nuevo registro actualizado en mi conjunto de registros cuando obtengo datos del servidor. Mantiene el orden intacto y bastante sencillo.

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);


0

Primero, reescribe tu matriz así:

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

A continuación, acceda al elemento en la matriz a través de su número de índice. La fórmula para determinar el número de índice es:n-1

Para reemplazar el primer elemento (n=1)de la matriz, escriba:

items[0] = Enter Your New Number;

En su ejemplo, el número 3452está en la segunda posición (n=2). Entonces la fórmula para determinar el número de índice es 2-1 = 1. Entonces escriba el siguiente código para reemplazarlo 3452con 1010:

items[1] = 1010;

0

Aquí está la respuesta básica hecha en una función reutilizable:

function arrayFindReplace(array, findValue, replaceValue){
    while(array.indexOf(findValue) !== -1){
        let index = array.indexOf(findValue);
        array[index] = replaceValue;
    }
}

1
dejar indice; while ((index = indexOf (findValue))! == -1) para evitar el doble indexOf (findValue)
Juan R

0

Resolví este problema usando bucles e iterando a través de la matriz original y agregando las posiciones de los arreas coincidentes a otra matriz y luego recorriendo esa matriz y cambiándola en la matriz original y luego la devolví, utilicé una función de flecha pero una función regular funcionaría también

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.

0

La forma más fácil es esto.

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]

no funciona para los elementos encontrados en el índice 0 replaceWhat = 523, replaceWith = 999999no produce resultados correctos
Anthony Chung

0

Aquí hay un trazador de líneas. Se supone que el elemento estará en la matriz.

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

Si quiere un simple sintax de azúcar, puede:

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

Me gusta:

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

Si no tiene identificación, puede clasificar el elemento como:

(elements = elements.filter(element => JSON.stringify(element) !== JSON.stringify(updatedElement))).push(updatedElement);
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.