当前位置:首页 > JavaScript

js数组实现

2026-02-01 00:05:24JavaScript

数组的基本创建与初始化

在JavaScript中,数组可以通过字面量或构造函数创建:

// 字面量方式  
const arr1 = [1, 2, 3];  

// 构造函数方式  
const arr2 = new Array(3); // 创建长度为3的空数组  
const arr3 = new Array(1, 2, 3); // 包含元素的数组  

数组的常见操作

添加/删除元素

// 末尾添加  
arr1.push(4); // [1, 2, 3, 4]  

// 开头添加  
arr1.unshift(0); // [0, 1, 2, 3, 4]  

// 末尾删除  
arr1.pop(); // [0, 1, 2, 3]  

// 开头删除  
arr1.shift(); // [1, 2, 3]  

截取与拼接

js数组实现

// 截取子数组(不改变原数组)  
const subArr = arr1.slice(1, 3); // [2, 3]  

// 拼接数组  
const newArr = arr1.concat([4, 5]); // [1, 2, 3, 4, 5]  

数组的遍历与转换

遍历方法

// forEach  
arr1.forEach(item => console.log(item));  

// map(返回新数组)  
const doubled = arr1.map(item => item * 2); // [2, 4, 6]  

过滤与查找

js数组实现

// filter  
const evens = arr1.filter(item => item % 2 === 0); // [2]  

// find  
const firstEven = arr1.find(item => item % 2 === 0); // 2  

多维数组与特殊操作

多维数组示例

const matrix = [[1, 2], [3, 4]];  
console.log(matrix[1][0]); // 3  

展开运算符与解构

// 合并数组  
const combined = [...arr1, ...newArr]; // [1, 2, 3, 4, 5]  

// 解构赋值  
const [first, second] = arr1; // first=1, second=2  

性能优化与注意事项

  • 避免频繁使用delete删除元素(会留下空位)。
  • 大规模数据操作时,优先选择for循环而非高阶函数(如forEach)。
  • 使用Array.from或扩展运算符转换类数组对象(如arguments)。

以上方法覆盖了JavaScript数组的常见使用场景,可根据需求灵活组合。

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

相关文章

js实现vue

js实现vue

Vue.js 的基本实现方法 在 JavaScript 中实现 Vue.js 的功能,可以通过直接引入 Vue 库或使用现代构建工具(如 Vite 或 Webpack)。以下是几种常见的实现方式:…

vue实现数组

vue实现数组

Vue 实现数组操作的方法 在 Vue 中,数组的操作需要特别注意响应式的问题。Vue 提供了一些方法来确保数组的变动能够触发视图更新。 响应式数组方法 Vue 对以下数组方法进行了封装,确保它们…

js 实现vue模板

js 实现vue模板

实现 Vue 模板的 JavaScript 方法 通过原生 JavaScript 可以实现类似 Vue 的模板渲染功能,主要包括数据绑定、指令处理和模板解析。以下是核心实现思路: 数据绑定与响应式…

js实现轮播

js实现轮播

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

js实现复制

js实现复制

使用document.execCommand方法 在较旧的浏览器中,可以使用document.execCommand('copy')实现复制功能。创建一个临时的textarea或input元素,将需要…

js实现计算器

js实现计算器

实现基础计算器功能 使用JavaScript创建一个基础计算器需要处理数字输入、运算符逻辑和结果显示。以下是一个简单的实现示例: let currentInput = '0'; let previ…