当前位置:首页 > JavaScript

js数组 实现

2026-03-02 08:38:04JavaScript

js数组 实现

数组的创建与初始化

在JavaScript中,数组可以通过多种方式创建:

js数组 实现

  • 字面量方式:直接使用方括号 [] 定义数组。
    const arr1 = [1, 2, 3]; // 包含数字的数组
    const arr2 = ['a', 'b', 'c']; // 包含字符串的数组
  • 构造函数方式:通过 new Array() 创建。
    const arr3 = new Array(1, 2, 3); // 等价于 [1, 2, 3]
    const arr4 = new Array(3); // 创建长度为3的空数组(元素为empty)

数组的常用方法

JavaScript数组提供丰富的内置方法,以下是一些核心操作:

添加/删除元素

  • push():向数组末尾添加元素,返回新长度。
    const arr = [1, 2];
    arr.push(3); // arr变为 [1, 2, 3]
  • pop():删除并返回数组的最后一个元素。
    const last = arr.pop(); // last = 3,arr变为 [1, 2]
  • unshift():向数组开头添加元素。
    arr.unshift(0); // arr变为 [0, 1, 2]
  • shift():删除并返回数组的第一个元素。
    const first = arr.shift(); // first = 0,arr变为 [1, 2]

遍历与转换

  • forEach():遍历数组元素。
    [1, 2, 3].forEach(item => console.log(item * 2)); // 输出 2, 4, 6
  • map():返回新数组,每个元素经过函数处理。
    const doubled = [1, 2, 3].map(x => x * 2); // doubled = [2, 4, 6]
  • filter():返回满足条件的新数组。
    const evens = [1, 2, 3].filter(x => x % 2 === 0); // evens = [2]

查找与判断

  • includes():检查数组是否包含某值。
    [1, 2, 3].includes(2); // true
  • find():返回第一个满足条件的元素。
    const found = [1, 2, 3].find(x => x > 1); // found = 2
  • some()/every():检查是否有任意/所有元素满足条件。
    [1, 2, 3].some(x => x > 2); // true
    [1, 2, 3].every(x => x > 0); // true

数组的高级操作

合并与拆分

  • concat():合并数组,返回新数组。
    const merged = [1, 2].concat([3, 4]); // merged = [1, 2, 3, 4]
  • join():将数组元素拼接为字符串。
    [1, 2, 3].join('-'); // 返回 "1-2-3"

排序与反转

  • sort():按默认或自定义规则排序(原地修改)。
    [3, 1, 2].sort(); // [1, 2, 3]
    [3, 1, 2].sort((a, b) => b - a); // 降序 [3, 2, 1]
  • reverse():反转数组顺序。
    [1, 2, 3].reverse(); // [3, 2, 1]

其他实用方法

  • reduce():累计计算数组元素。
    const sum = [1, 2, 3].reduce((acc, val) => acc + val, 0); // sum = 6
  • Array.from():将类数组对象转为数组。
    Array.from('abc'); // ['a', 'b', 'c']

注意事项

  • 空位处理:使用 new Array(3) 创建的数组包含空位(empty),部分方法如 map() 会跳过空位。
  • 浅拷贝slice() 或展开运算符 [...arr] 可实现浅拷贝。
    const copy = [...[1, 2, 3]]; // copy = [1, 2, 3]

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

相关文章

js 实现vue

js 实现vue

实现 Vue 的核心功能 在 JavaScript 中实现 Vue 的核心功能需要模拟数据绑定、虚拟 DOM 和响应式系统。以下是一个简化版的实现思路: 响应式系统 通过 Object.define…

vue实现数组

vue实现数组

vue实现数组操作 在Vue中操作数组需要使用Vue提供的响应式方法,直接修改数组元素不会触发视图更新。以下是常见的数组操作方法: 添加元素 使用push、unshift或splice方法添加元素:…

js实现复制到剪贴板

js实现复制到剪贴板

使用document.execCommand方法(传统方式,已废弃但部分浏览器仍支持) 该方法适用于旧版浏览器,但已被标记为废弃。执行前需确保文本已被选中: function copyToClipb…

js实现预览

js实现预览

文件上传预览实现 使用JavaScript实现文件上传预览功能,可以通过FileReader对象读取文件内容并显示预览。以下代码支持图片、文本和PDF文件的预览: // HTML部分需要包含…

js实现自举

js实现自举

实现 JavaScript 自举的方法 JavaScript 自举(Bootstrap)通常指通过 JavaScript 动态加载自身或依赖的脚本,实现运行时环境的初始化或扩展。以下是几种常见实现方式…

js 实现递归

js 实现递归

递归的基本概念 递归是指函数直接或间接调用自身的过程。在JavaScript中,递归通常用于解决可以分解为相似子问题的问题,如阶乘、斐波那契数列、树形结构遍历等。 递归的实现要点 基线条件(Base…