当前位置:首页 > JavaScript

js数组实现

2026-03-13 22:12:44JavaScript

数组的基本操作

在JavaScript中,数组是一种用于存储多个值的有序集合。可以通过以下方式创建数组:

let fruits = ['apple', 'banana', 'orange'];
let numbers = new Array(1, 2, 3);

访问数组元素使用索引,索引从0开始:

console.log(fruits[0]); // 输出 'apple'

修改数组元素

直接通过索引赋值可以修改数组元素:

fruits[1] = 'pear';
console.log(fruits); // ['apple', 'pear', 'orange']

常用数组方法

添加/删除元素

// 末尾添加
fruits.push('grape'); 

// 开头添加
fruits.unshift('melon');

// 末尾删除
fruits.pop();

// 开头删除
fruits.shift();

数组拼接

let moreFruits = ['kiwi', 'mango'];
let allFruits = fruits.concat(moreFruits);

查找元素

js数组实现

let index = fruits.indexOf('orange'); // 返回索引
let exists = fruits.includes('apple'); // 返回布尔值

数组遍历

使用循环或高阶函数遍历数组:

// for循环
for(let i = 0; i < fruits.length; i++) {
    console.log(fruits[i]);
}

// forEach
fruits.forEach(function(item) {
    console.log(item);
});

// map
let lengths = fruits.map(fruit => fruit.length);

多维数组

JavaScript支持多维数组(数组的数组):

let matrix = [
    [1, 2, 3],
    [4, 5, 6],
    [7, 8, 9]
];
console.log(matrix[1][2]); // 6

数组解构

ES6引入的解构赋值可以方便地从数组提取值:

js数组实现

let [first, second] = fruits;
console.log(first); // 'apple'
console.log(second); // 'pear'

数组扩展运算符

扩展运算符...可以用于合并数组或传递参数:

let newFruits = [...fruits, 'pineapple'];
console.log(newFruits); 

function sum(a, b, c) {
    return a + b + c;
}
let nums = [1, 2, 3];
console.log(sum(...nums)); // 6

数组排序

使用sort()方法对数组进行排序:

let numbers = [3, 1, 4, 2];
numbers.sort(); // [1, 2, 3, 4]

// 自定义排序
numbers.sort((a, b) => b - a); // 降序 [4, 3, 2, 1]

数组过滤

filter()方法创建满足条件的新数组:

let bigNumbers = numbers.filter(n => n > 2);
console.log(bigNumbers); // [3, 4]

数组reduce

reduce()方法将数组元素计算为单个值:

let sum = numbers.reduce((total, num) => total + num, 0);
console.log(sum); // 10

标签: 数组js
分享给朋友:

相关文章

js实现轮播

js实现轮播

实现轮播图的基本思路 轮播图的核心逻辑是通过定时切换展示的图片或内容,通常结合左右滑动按钮和指示器(小圆点)增强交互性。以下是基于原生JavaScript的实现方法。 HTML结构 构建轮播图的HT…

js实现继承

js实现继承

原型链继承 通过将子类的原型指向父类的实例实现继承。子类实例可以访问父类原型上的属性和方法。 function Parent() { this.name = 'parent'; } Parent…

js如何实现继承

js如何实现继承

原型链继承 通过将子类的原型指向父类的实例实现继承。子类实例能够访问父类原型上的属性和方法。 function Parent() { this.name = 'parent'; } Parent…

js实现瀑布流

js实现瀑布流

实现瀑布流布局 瀑布流布局是一种常见的网页布局方式,常用于图片展示、商品列表等场景。以下是使用 JavaScript 实现瀑布流布局的几种方法。 纯 JavaScript 实现 通过计算元素的位置和…

js jquery

js jquery

jQuery 简介 jQuery 是一个快速、简洁的 JavaScript 库,简化了 HTML 文档遍历、事件处理、动画设计和 Ajax 交互。它兼容多种浏览器,提供易于使用的 API,使开发者能够…

js实现图

js实现图

JavaScript 实现图的常用方法 在 JavaScript 中,图(Graph)可以通过多种方式实现,常见的包括邻接表(Adjacency List)和邻接矩阵(Adjacency Matrix…