Nuevos métodos de matriz: 1. from (), que puede convertir un objeto iterable o similar a una matriz en una matriz real 2. of (), que puede convertir un conjunto de valores en una matriz, lo que compensa las deficiencias; del constructor de la matriz Array(); 3. find() y findIndex(), devuelven el primer elemento de la matriz que cumple las condiciones 4. fill() y así sucesivamente;
Cómo comenzar rápidamente con VUE3.0: Ingrese
al entorno operativo de este tutorial: sistema Windows 7, ECMAScript versión 6, computadora Dell G3.
1. Array.from()
El método Array.from se utiliza para convertir dos tipos de objetos en matrices reales:
objetos similares a matrices y
objetos iterables (incluido ES6 new La estructura de datos Set y Map)
significa que mientras A medida que se implementa la estructura de datos de la interfaz Iterator, Array.from puede convertirla en una matriz.
En el desarrollo real, generalmente se puede usar para convertir la colección NodeList devuelta por la operación DOM, así como los argumentos dentro de la función.
Cuandoel objeto
pasa un parámetro, se utiliza para convertir la matriz de clase en una matriz real
para eliminar la duplicación.
ajuste constante = [1,2,3,3,3,2,5]; console.log(Array.from(new Set(arr))); //[1,2,3,5] //... También se puede lograr el mismo efecto console.log([...new Set(arr)]) //[1,2,3,5]
Para navegadores que no implementan este método, puede usar Método array.prototipo.slice en lugar de
costnt toArray = (() => { Array.de? Array.de: obj => [].slice.call(obj) })()
también puede recibir un segundo parámetro, que se pasa a una función para lograr un efecto similar al método map, procesando cada elemento y devolviendo la matriz procesada
Array.from([1,2,3 ], item => item *2) //[2,4,6]
La longitud de la cadena devuelta
se puede usar para convertir la cadena en una matriz y luego devolver la longitud de la cadena, porque puede manejar correctamente varios caracteres Unicode. Esto evita El propio error de JS al contar caracteres Unicode mayores que /uFFFF como
función de 2 caracteres countLength(string) { devolver Array.from(cadena).longitud }
2. Array.of()
El método Array.of se utiliza para convertir un conjunto de valores en una matriz. Compense las deficiencias del constructor de matrices Array(). Debido a que el número de parámetros es diferente, el comportamiento de Array() será diferente
//El siguiente código muestra la diferencia Array.of(3); matriz.de(3, 11, 8); // [3,11,8] nueva matriz(3); // [, , ,] nueva matriz(3, 11, 8); // [3, 11, 8] //El método Array.of se puede simular con el siguiente código. función MatrizDe() { return [].slice.call(argumentos); }
3. Find() y findIndex() de instancias de matriz.
find()
devuelve el primer miembro de la matriz que cumple las condiciones. Su parámetro es una función de devolución de llamada. Todos los miembros de la matriz ejecutan esta función en secuencia hasta el primero que cumple las condiciones. se encuentra el miembro y luego devuelve el miembro. Si no hay ningún miembro que cumpla con las condiciones, devuelve indefinido.
La función de devolución de llamada de este método recibe tres parámetros: valor actual, posición actual,
ejemplo de matriz original 1
[1,12,4. ,0,5] .find((item,index, arr) => devolver elemento < 1) // 0
Ejemplo 2
// find() var elemento = [1, 4, -5, 10].find(n => n < 0); consola.log(elemento); // -5 // find también admite este tipo de búsqueda compleja var point = [ { x: 10, años: 20 }, { x: 20, años: 30 }, { x: 30, años: 40 }, { x: 40, años: 50 }, { x: 50, años: 60 } ]; puntos.find(matcher de función(punto) { punto de retorno.x % 3 == 0 && punto.y % 4 == 0; }); // { x: 30, y: 40 }La escritura y el uso de
findIndex()
es básicamente el mismo que el del método find(). Simplemente devuelve la posición del primer miembro de la matriz que cumple las condiciones. es ninguno, devuelve -1
Ejemplo 1
[1,2,4,15,0].findIndex((item, index,arr) => return item > 10) //3Ejemplo
2
var puntos = [. { x: 10, años: 20 }, { x: 20, años: 30 }, { x: 30, años: 40 }, { x: 40, años: 50 }, { x: 50, años: 60 } ]; puntos.findIndex(coincidencia de funciones(punto) { punto de retorno.x % 3 == 0 && punto.y % 4 == 0; }); // 2 puntos.findIndex(coincidencia de funciones(punto) { punto de retorno.x % 6 == 0 && punto.y % 7 == 0; }); //1
4. El método fill(
// El método de relleno llena una matriz con el valor dado. var fillArray = new Array(6).fill(1); console.log(fillArray); //[1, 1, 1, 1, 1, 1] // El método de llenado también puede aceptar el segundo y tercer parámetro, que se utilizan para especificar las posiciones inicial y final del llenado. ["a", "b", "c"].fill(7, 1, 2); // ['a', 7, 'c'] // Tenga en cuenta que si el tipo completado es un objeto, entonces el objeto asignado es la misma dirección de memoria, no el objeto de copia profunda. let arr = nueva matriz(3).fill({ nombre: "Mike" }); arr[0].nombre = "Ben"; consola.log(arr); // [{nombre: "Ben"}, {nombre: "Ben"}, {nombre: "Ben"}]
Ambos métodos pueden encontrar NaN en la matriz, pero indexOf() en ES5 no puede encontrar NaN 5. Los tres.
Los métodosentradas (), claves () y valores () de la instancia de la matriz
se
usan para atravesar la matriz y todos devuelven un objeto transversal. El bucle for...of se puede usar para atravesar la matriz.
claves () es un par de nombres clave. El recorrido de
valores () es un recorrido de valores clave
() es un recorrido de pares clave-valor
para (let index of ["a", "b"].keys. ()) { consola.log(índice); } // 0 1 for (dejemos el elemento de ["a", "b"].values()) { consola.log(elem); } //ab for (let [index, elem] of ["a", "b"].entries()) { console.log(índice, elemento); } // 0 "una" // 1 "b" var a = [1, 2, 3]; [...a.valores()] // [1,2,3] [...a.claves()] // [0,1,2] [...a.entries()]; // [ [0,1], [1,2], [2,3] ]
6. El método include() devuelve un valor booleano
. , indica si una matriz contiene un valor dado
[1, 2, 3].includes(2) // verdadero [(1, 2, 3)].includes(4) // false
también puede recibir un segundo parámetro, que indica la posición inicial de la búsqueda, el valor predeterminado es 0. Si el segundo parámetro es un número negativo, indica la posición del número. Si el segundo parámetro es mayor que la longitud de la matriz, el método incluye comienza desde el subíndice 0
para compensar las deficiencias del método indexOf que no es lo suficientemente semántico y juzga mal NaN
[1, 23, NaN].includes(NaN) // verdadero
método compatible:
la función contiene = ( () => { matriz.prototipo.incluye ?(arr, val) => arr.incluye(val) :(arr, val) => arr.some(artículo => devolver artículo === val) })()
7. Flat() de instancias de matriz, flatMap()
// flat() [1, 2, [3, [4, 5]]].plano() // [1, 2, 3, [4, 5]] [1, 2, [3, [4, 5]]].plano(2) // [1, 2, 3, 4, 5] //mapa plano() [2, 3, 4]. FlatMap((x) => [x, x * 2]) //Después de ejecutar el mapa, es [[2, 4], [3, 6], [4, 8]] //Luego ejecuta el método flat() para obtener el siguiente resultado // [2, 4, 3, 6, 4, 8] // flatMap() solo puede expandir un nivel de matriz. // Equivalente a .plano() [1, 2, 3, 4].mapaplano(x => [ [x*2] ]) //Después de ejecutar el mapa, es [[[2]], [[4]], [[6]], [[8]]] // Luego ejecute el método flat() para obtener los siguientes resultados // [[2], [4], [6], [8]] Copiar código
8. El copywithin() de la instancia de la matriz
copiará el miembro en la posición especificada dentro de la matriz actual. Copie a otras posiciones y luego regrese a la matriz actual, lo que cambiará la matriz original
para recibir tres parámetros:
1. destino (obligatorio) comience a reemplazar datos desde esta posición
2. inicio (opcional) comience a leer datos desde esta posición, el valor predeterminado es 0. Si es un número negativo, significa
detener la lectura de datos antes de llegar al número 3 y finalizar (opcional). Si es un número negativo, significa que
los tres parámetros deben ser números. De lo contrario, se convertirán automáticamente a valores numéricos
[1,2,3,4,5].copywithin(0,3); /[4,5,3,4,5] significa que los miembros desde el subíndice 3 hasta el final (4,5) se copian a la posición que comienza desde el subíndice 0, y se reemplazan los 1 y 2 originales.