prefacio
En el resultado del resumen de aprendizaje continuo, lo que comparto hoy es el front-end web, 4 usos de matrices basadas en JS, verificar, modificar, agregar, eliminar
1. ¿Qué es una matriz?
Array (Array) es un tipo de datos que puede almacenar datos en orden
Pensando: ¿
Qué sucede si quiero guardar los nombres de 5 personas en el departamento de I + D de la empresa?
Si hay varios datos, se pueden guardar en una matriz.
2. Uso básico de matrices.
1. Sintaxis de declaración
<script>
// let 数组名 = ['数据1', '数据1', '...','数据n']
let names = ['小星', '小黄', '小伟','小霞','小亮']
</script>
- La matriz se guarda en orden, por lo que cada dato tiene su propio número.
- Los números en la computadora comienzan desde 0, por lo que el número de Xiaoxing es 0, el número de Xiaohuang es 1, y así sucesivamente.
- En una matriz, la cantidad de datos también se llama índice o subíndice.
- Las matrices pueden almacenar datos de cualquier tipo.
2. Sintaxis de valor
<script>
// let 数组名 [下标]
let names = ['小星', '小黄', '小伟','小霞','小亮']
names[0] //小星
names[1] //小黄
</script>
- Obtener datos por subíndice
- Qué tipo se saca, se accede según las características de este tipo
3. Alguna terminología
Elemento: cada dato almacenado en la matriz se denomina elemento de la matriz.
Subíndice: el número de datos en la matriz.
Longitud: el número de datos en la matriz, obtenido a través de la propiedad de longitud de la matriz.
<script>
let names = ['小星', '小黄', '小伟','小霞','小亮']
console.log(names[0]) //小星
console.log(names[1]) //小黄
console.log(names.length) //5
</script>
4. Recorre la matriz
Use un bucle para acceder a cada elemento de la matriz, generalmente use un bucle for para atravesar
<script>
// 数组求和案例
let arr = [20, 60, 10, 87, 44]
for (let i = 0; i < arr.length; i++) {
document.write (arr[i])
}
</script>
3. Matriz de operaciones
La esencia de una matriz es una colección de datos, y manipular datos no es más que agregar, eliminar, modificar y verificar la sintaxis .
1. Consultar matriz de datos de matriz
[subíndice]
o lo llamamos acceder a datos de matriz
<script>
let arr = ['小星', '小黄', '小伟']
// 访问 / 查询
console.log(arr[0])
</script>
2. Reasignar
matriz[subíndice] = nuevo valor
<script>
let arr = ['小星', '小黄', '小伟']
// 访问 / 查询
console.log(arr[0])
// 2. 改
arr[0] = '小星星'
// arr = '干嘛'
console.log(arr)
</script>
3. Agregue nuevos datos a la matriz
arr.push (nuevo contenido) arr.unshift (nuevo contenido)
3.1 El método array.push() agrega uno o más elementos al final de la matriz y devuelve la nueva longitud de la matriz
<script>
// arr.push('元素1', '...', '元素n')
let arr = ['小星', '小黄']
// 把 小伟 放到 arr 的后面
// arr.push('小伟')
// 返回值是新的数组长度：
// 不但把数组放入数组，而且还告诉我们，看看有3个值啦
// console.log(arr.push('小伟'))
arr.push('小伟', '小霞')
console.log(arr)
</script>
3. 2 El método arr.unshift (nuevo contenido) agrega uno o más elementos al comienzo de la matriz y devuelve la nueva longitud de la matriz
<script>
// arr.unshift('元素1', '...', '元素n')
let arr = ['小星', '小黄']
// arr.unshift('小伟', '小霞')
console.log(arr.unshift('小伟', '小霞'))
console.log(arr)
</script>
4. Elimine los datos en la matriz
arr.pop()
arr.shift()
arr.splice (el subíndice de la operación, el número de eliminaciones)
4.1 Matriz. El método pop() elimina el último elemento de la matriz y devuelve el valor del elemento.
<script>
let arr = ['小星', '小黄', '小伟']
// 删除最后一个元素
arr.pop()
</script>
4.2 Matriz. El método shift() elimina el primer elemento de la matriz y devuelve el valor de ese elemento.
<script>
let arr = ['小星', '小黄', '小伟']
console.log(arr.pop())
// 看我删了一个， 删的是 第一个 小星
</script>
4.3 Matriz. El método splice() elimina el elemento especificado.
<script>
// console.log(arr.shift())
// shift是删除 unshift比shift 加了一个 un 表示加
// console.log(arr)
// 重点删除 arr.splice(从哪里开始删， 删几个)
let arr = ['小星', '小黄', '小伟']
// 我就想把小黄 删掉
// 第一个1 是从索引号是1的位置开始删
// 第二1 是删除几个
// arr.splice(start, deleteCount)
// arr.splice(1, 1)
// arr.splice(1)
console.log(arr)
</script>
explicar:
posición inicial:
especifica la posición inicial de la modificación (contando desde 0)
deleteCount:
indica el número de elementos de la matriz que se eliminarán
Opcional. Si se omite, se eliminará desde la posición inicial especificada hasta el final de forma predeterminada.
resumen
1. ¿Qué método desea utilizar para agregar elementos de datos al final de la matriz?
arr.push()
puede agregar uno o más elementos de la matriz
y devuelve la longitud de la matriz
2. ¿Qué método desea utilizar para agregar elementos de datos al comienzo de la matriz?
arr.unshift()
puede agregar uno o más elementos de la matriz
y devuelve la longitud de la matriz
3. ¿Recuerdas ese?
arr.push()
4. ¿Qué método se utiliza para eliminar un elemento de datos al final del array?¿Con parámetros?
arr.pop()
sin parámetros,
el valor de retorno es el elemento eliminado
5. ¿Qué método se utiliza para eliminar un elemento de datos al principio del array?¿Con parámetros?
arr.shift()
sin parámetros,
el valor de retorno es el elemento eliminado
6. ¿Cuál desea especificar para eliminar elementos de la matriz? ¿Se usa comúnmente en el desarrollo? ¿Existen escenarios de uso?
arr.splice (posición inicial, número de eliminaciones)
es muy común en el desarrollo, como la lotería aleatoria, como como eliminar productos específicos, etc.
4. Caso
Suma de matriz
Requisito: Encuentre la suma y el promedio de todos los elementos en la matriz [66,86,78,75, 94]
Análisis:
1. Declare una suma variable.
2. Recorra la matriz y agregue cada elemento de la matriz a la suma.
3. Divida la variable de suma por la longitud de la matriz para obtener el valor promedio de la matriz.
<script>
// 数组求和案例
let arr = [66,86,78,75, 94]
// 求和变量
let sum = 0
// 求平均值变量
let average = 0
// 遍历数组
for (let i = 0; i < arr.length; i++) {
// console.log(arr[i])
// sum = sum + arr[i]
// arr[i] 就是数组里面的每个值 比如 66,86
sum += arr[i]
}
average = sum / arr.length
document.write(`这个同学的总分是: ${
sum}, 平均分是:${
average}`)
</script>
resultado de la operación:
Requisitos de detección de matriz
: Seleccione los elementos mayores o iguales a 10 en la matriz [2, 0, 6, 1, 77, 0, 52, 0, 25, 7] y colóquelos en una nueva matriz Análisis: 1. Declare un nueva
matriz
con Para almacenar nuevos datos newArr
2. Recorra la matriz antigua original para encontrar elementos mayores o iguales a 10
3. Agregue a la nueva matriz newArr a su vez
<script>
let arr = [2, 0, 6, 1, 77, 0, 52, 0, 25, 7]
// 需要一个新的空数组 数组字面量 []
let newArr = []
// 遍历旧数组
for (let i = 0; i < arr.length; i++) {
if (arr[i] >= 10) {
// console.log(arr[i])
// 满足条件的，依次追加给新的数组
// 把 arr[i] 追加给 newArr
// newArr = arr[i] 不可以
newArr.push(arr[i])
}
}
console.log(newArr)
</script>
resultado de la operación:
5. Resumen
Finalmente comparte una frase:
Cuando el mundo sea difícil de cambiar, la filosofía te dará la fuerza para afrontar la vida. Es como una estrella, iluminando el camino nocturno que caminas solo; es un suave consuelo, suficiente para curar tu dolor; es sabiduría, que resuelve tu confusión sobre la vida "El Consuelo de la Filosofía
"
¡Eso es todo por este compartir! ! !
¡Bienvenido a dejar un mensaje para discutir en el área de comentarios! !