Un objeto Array representa una colección de elementos. Ayuda a mantener un gran conjunto de datos para evitar la confusión de múltiples variables, clasificándolas así. Si el usuario desea aplicar cualquier método y propiedad adicional al objeto Array, no necesita aplicar esa nueva propiedad/método uno por uno a cada elemento. En cambio, se puede hacer de manera efectiva mediante el uso de JavaScript Array ' prototipo ” constructor. Este constructor ayuda a aplicar los nuevos métodos y propiedades al objeto Array deseado.
Esta guía explica el uso del constructor de 'prototipo' Array en JavaScript.
¿Cómo usar el constructor de 'prototipo' de matriz en JavaScript?
La Matriz” prototipo El constructor se usa para agregar nuevos métodos y propiedades a un objeto Array con la ayuda de la función JavaScript. Aplica la propiedad construida para todos los valores de matriz, como su nombre y valor por defecto.
Sintaxis
Array.prototype.name = valor
En la sintaxis anterior, “ nombre ” especifica la propiedad recién agregada con su “ valor ” que se aplica a todo el objeto Array.
Usemos la propiedad definida anteriormente prácticamente con la ayuda de su sintaxis.
código HTML
Primero, eche un vistazo al código HTML indicado:
< pag > El 'prototipo' el constructor ayuda en la incorporación de los nuevos métodos / propiedades a la matriz dada ( ) objeto. pag >< botón al hacer clic = 'jsFunc ()' > Obtener cada longitud de cadena botón >
< pag identificación = 'muestra' > pag >
< pag identificación = 'para' > pag >
En las líneas de código anteriores:
- El ' La etiqueta ” especifica la declaración del párrafo.
- El '
” incrusta un botón con un evento “onclick” para invocar la función especificada “jsFunc()” al hacer clic en el botón. - Los últimos dos ' Las etiquetas ” agregan párrafos vacíos con sus identificadores asignados “muestra” y “para”, respectivamente.
Nota: Este código HTML se sigue en todos los ejemplos dados en esta guía.
Ejemplo 1: Aplicar el constructor 'prototipo' para contar la longitud del objeto de matriz mediante la adición de un nuevo método
Este ejemplo utiliza el constructor 'prototipo' para contar la longitud de cada cadena dentro de un objeto Array con la ayuda de un método recién agregado.
Código JavaScript
Siga el código JavaScript dado:
< guion >Array.prototype.stringLength = función ( ) {
para ( donde t = 0 ; t < esta.longitud; t++ ) {
este [ t ] = esto [ t ] .longitud;
}
} ;
función jsFunc ( ) {
cadena var = [ 'HTML' , 'CSS' , 'JavaScript' ] ;
documento.getElementById ( 'muestra' ) .innerHTML = cadena;
str.stringLength ( ) ;
documento.getElementById ( 'para' ) .innerHTML = cadena;
}
guion >
En las líneas de código anteriores:
- Aplicar la sintaxis básica del Array “ prototipo ” constructor que agrega un nuevo método “ longitud de la cuerda ” definiendo una función.
- A continuación, en la definición de la función, el “ para El bucle ” se itera sobre todos los índices de un objeto Array para encontrar su longitud usando la propiedad “longitud”.
- Después de eso, el “ jsFunc() ” define un objeto Array almacenado en la variable “str”.
- Entonces el ' documento.getElementById () ” accede al primer párrafo vacío a través de su id “sample” para mostrar el objeto Array “str”.
- Por último, asocie el objeto Array 'str' con el ' longitud de la cuerda() ” para contar la longitud de la cadena de cada índice de matriz y luego agregarlo al siguiente párrafo vacío cuya identificación es “para”.
Producción
Aquí, la salida muestra la longitud de cada cadena del objeto Array de destino con la ayuda del método 'stringLength()' recién agregado a través del constructor 'prototipo' de Array.
Ejemplo 2: aplicar el constructor 'prototipo' para crear un nuevo método 'myUcase' y aplicarlo a un objeto de matriz
Este ejemplo utiliza el constructor 'prototipo' para crear un nuevo método 'myUcase' y lo aplica al objeto Array de destino.
Código JavaScript
Repasemos el código JavaScript que se indica a continuación:
< guion >Array.prototype.myUcase = función ( ) {
para ( dejar t = 0 ; t < esta.longitud; t++ ) {
este [ t ] = esto [ t ] .toMayúsculas ( ) ;
}
} ;
función jsFunc ( ) {
const arrObj = [ 'html' , 'css' , 'JavaScript' , 'Reaccionar' ] ;
arrObj.myUcase ( ) ;
documento.getElementById ( 'muestra' ) .innerHTML = arrObj;
}
guion >
Aquí, el constructor 'prototipo' crea un nuevo método llamado ' micaso ” que utiliza el “ Mayúsculas ” en la definición de la función para convertir cada cadena del objeto Array en “Mayúsculas”. En la última función, el método personalizado también se invoca en el Array.
Producción
Como se ve, cada cadena de un objeto Array se capitaliza al hacer clic en un botón debido al método 'myUcase()' aplicado.
Conclusión
Para usar la Matriz “ prototipo ” constructor en JavaScript, asocie el nuevo método/propiedad con él. Especifica una función que define las funcionalidades para otra función de manera personalizada según los requisitos. Esta guía explica brevemente el uso del constructor 'prototipo' Array en JavaScript.