Js常用数组处理

数组的遍历 forEach()

js 复制代码
const fruits = ["苹果", "香蕉", "橙子"];

// item 代表当前遍历到的那个元素,index 是索引(可选)
fruits.forEach((item, index) => {
  console.log(`第 ${index} 个元素是:${item}`);
});
/*
第 0 个元素是:苹果
第 1 个元素是:香蕉
第 2 个元素是:橙子
*/
  • 替代 for 循环,代码更简洁。

数组静态方法 Array.isArray ()

核心作用判断一个数据到底是不是数组 。返回 truefalse

为什么需要它? 因为 typeof 运算符判断数组会返回 object,分不清数组和对象,所以必须用 Array.isArray()

js 复制代码
const arr = [1, 2, 3];
const obj = { name: "Jack" };
const num = 123;

console.log(Array.isArray(arr));  // true
console.log(Array.isArray(obj));  // false
console.log(Array.isArray(num));  // false

追加 push ()

核心作用:向数组的末尾添加一个或多个元素。

  • 修改原数组
  • 返回值是新数组的长度。
js 复制代码
const animals = ["猫", "狗"];

// 返回值是新长度 3
const newLength = animals.push("猪"); 

console.log(animals);   // ["猫", "狗", "猪"]
console.log(newLength); // 3

头出 shift ()

核心作用:删除数组的第一个元素。

  • 修改原数组
  • 返回值是被删除的那个元素
  • 如果数组为空,返回 undefined
js 复制代码
const languages = ["JS", "Java", "Go"];

// 返回被删掉的元素 "JS"
const delItem = languages.shift();

console.log(languages);   // ["Java", "Go"]
console.log(delItem);     // "JS"

批量头出 unshift ()

核心作用:向数组的开头添加一个或多个元素。

  • 修改原数组
  • 返回值是新数组的长度。
js 复制代码
const nums = [2, 3];

// 返回新长度 3
const newLength = nums.unshift(1);

console.log(nums);  // [1, 2, 3]

转化字符串 join ()

核心作用:把数组里的所有元素拼接成一个字符串。

  • 不修改原数组,
  • 返回拼接后的字符串。
js 复制代码
const chars = ["小", "程", "序"];

// 不传参默认用逗号连接;传参用指定的字符串连接
console.log(chars.join());    // "小,程,序"
console.log(chars.join(""));  // "小程序"
console.log(chars.join("-")); // "小-程-序"

颠倒数组 reverse ()

核心作用:颠倒数组中元素的顺序。

  • 直接修改原数组,
  • 返回值是颠倒后的数组。
js 复制代码
const arr = [1, 2, 3, 4];

// 返回颠倒后的数组 [4, 3, 2, 1]
const res = arr.reverse();

console.log(arr);   // [4, 3, 2, 1] (原数组已被改变)
console.log(res);   // [4, 3, 2, 1]

寻值 indexOf ()

核心作用:查找某个元素在数组中第一次出现的位置。

  • 返回索引,找不到返回 -1
  • 严格匹配===),类型不同也找不到(比如 1"1" 算不同)。
js 复制代码
const colors = ["红", "黄", "蓝", "黄"];

console.log(colors.indexOf("黄"));  // 1 (只返回第一个匹配的索引)
console.log(colors.indexOf("绿"));  // -1 (找不到)
相关推荐
benbenAItalk4 小时前
数字人口播视频的批量生产实践:素材规范、任务编排与质量验收
java·前端·音视频
2601_962885724 小时前
如何用 Python 扫描 A 股跳空缺口并统计缺口回补概率?
java·前端·python
西瓜太郎12344 小时前
Claude Code、Codex CLI、Gemini CLI 能否共用一枚 Key?先看协议选择矩阵
前端·api 网关·claude code·gemini cli·codex cli
多加点辣也没关系5 小时前
JavaScript|第31章:表单与控件
开发语言·javascript·ecmascript
怕浪猫5 小时前
长会话不崩盘:DeepSeek Harness 的上下文压缩与目标管理策略
面试·github·agent
ocean21035 小时前
2025-2026年Python面试高频知识点洞察
开发语言·python·面试·python八股文
陈随易6 小时前
在Finch用了62亿词元,我认为这是新一代Agent工具之神
前端·人工智能·后端
letisgo57 小时前
JAVA 高级进阶07篇《@Transactional失效的8个场景:代理机制到传播行为》
java·面试·transactional·spring事务·aop动态代理
水域安全老周7 小时前
水趣钓鱼救生衣专利拆解:两级锁紧如何解决落水人衣分离
java·前端·网络
计算机魔术师7 小时前
Anthropic CEO突然喊踩刹车,OpenAI罕见力挺:AI这辆车不能只踩油门了
前端