js数组Array的元素增删操作

简介: js数组Array的元素增删操作

数组Array 的函数定义

Array<T>
属性:
数组长度 length: number;
常用方法:
尾部插入 push(...items: T[]): number;
尾部弹出 pop(): T | undefined;
头部弹出 shift(): T | undefined;
头部插入 unshift(...items: T[]): number;
删除元素 splice(start: number, deleteCount?: number): T[];
插入元素 splice(start: number, deleteCount: number, ...items: T[]): T[];
合并数组 concat(...items: ConcatArray<T>[]): T[];
数组切片 slice(start?: number, end?: number): T[];
转字符串 toString(): string;
分隔符拼接 join(separator?: string): string;
反转数组 reverse(): T[];
元素排序 sort(compareFn?: (a: T, b: T) => number): this;

代码示例

// 便于演示,简写
function log(obj){
    console.log(obj);
}
// 初始数组,所有操作均以上一步操作为基础
var list = [];
// 尾部插入
let ret1 = list.push(0, 1, 2, 3);
log(ret1); // 4
log(list); // [ 0, 1, 2, 3 ]
// 尾部弹出
let ret2 = list.pop();
log(ret2); // 3
log(list); // [ 0, 1, 2 ]
// 头部弹出
let ret3 = list.shift();
log(ret3); // 0
log(list); // [ 1, 2 ]
// 头部插入
let ret4 = list.unshift(5, 6, 7);
log(ret4); // 5
log(list); // [ 5, 6, 7, 1, 2 ]
// 删除元素
let newList1 = list.splice(1, 2);
log(newList1);  // [ 6, 7 ]
log(list);     //  [ 5, 1, 2 ]
// 插入元素
let newList2 = list.splice(1, 0, 8, 9);
log(newList2);  // []
log(list);     //  [ 5, 8, 9, 1, 2 ]
// 合并两个数组
let newList3 = list.concat([8, 9, 10]);
log(newList3);  // [ 5, 8, 9, 1, 2, 8, 9, 10 ]
log(list);     //  [ 5, 8, 9, 1, 2 ]
// 数组切片[start, end)
let newList4 = list.slice(1, 3);
log(newList4);  // [ 8, 9 ]
log(list);      // [ 5, 8, 9, 1, 2 ]
// 转字符串
[1, 2, 3].toString()  // 1,2,3
// 分隔符拼接
[1, 2, 3].join('|')  // 1|2|3
// 反转数组
let list = [2, 1, 3]
list.reverse()
log(list)
// [ 3, 2, 1 ]
// 元素排序
list.sort()
log(list)
// [ 1, 2, 3 ]

数组排序,指定排序规则

let list = [
    {
        name: "Tom",
        age: 20
    },
    {
        name: "Jack",
        age: 18
    },
    {
        name: "Steve",
        age: 25
    }
]
// 元素排序, 按照年龄age 从小到大排序
list.sort((a, b) => {
    return a.age - b.age;
})
console.log(list);
/**
[ { name: 'Jack', age: 18 },
  { name: 'Tom', age: 20 },
  { name: 'Steve', age: 25 } ]
 */


相关文章
|
3天前
|
数据采集 人工智能 安全
|
13天前
|
云安全 监控 安全
|
4天前
|
自然语言处理 API
万相 Wan2.6 全新升级发布!人人都能当导演的时代来了
通义万相2.6全新升级,支持文生图、图生视频、文生视频,打造电影级创作体验。智能分镜、角色扮演、音画同步,让创意一键成片,大众也能轻松制作高质量短视频。
1085 152
|
18天前
|
机器学习/深度学习 人工智能 自然语言处理
Z-Image:冲击体验上限的下一代图像生成模型
通义实验室推出全新文生图模型Z-Image,以6B参数实现“快、稳、轻、准”突破。Turbo版本仅需8步亚秒级生成,支持16GB显存设备,中英双语理解与文字渲染尤为出色,真实感和美学表现媲美国际顶尖模型,被誉为“最值得关注的开源生图模型之一”。
1751 9
|
9天前
|
人工智能 自然语言处理 API
一句话生成拓扑图!AI+Draw.io 封神开源组合,工具让你的效率爆炸
一句话生成拓扑图!next-ai-draw-io 结合 AI 与 Draw.io,通过自然语言秒出架构图,支持私有部署、免费大模型接口,彻底解放生产力,绘图效率直接爆炸。
694 152
|
11天前
|
人工智能 安全 前端开发
AgentScope Java v1.0 发布,让 Java 开发者轻松构建企业级 Agentic 应用
AgentScope 重磅发布 Java 版本,拥抱企业开发主流技术栈。
660 14
|
6天前
|
SQL 自然语言处理 调度
Agent Skills 的一次工程实践
**本文采用 Agent Skills 实现整体智能体**,开发框架采用 AgentScope,模型使用 **qwen3-max**。Agent Skills 是 Anthropic 新推出的一种有别于mcp server的一种开发方式,用于为 AI **引入可共享的专业技能**。经验封装到**可发现、可复用的能力单元**中,每个技能以文件夹形式存在,包含特定任务的指导性说明(SKILL.md 文件)、脚本代码和资源等 。大模型可以根据需要动态加载这些技能,从而扩展自身的功能。目前不少国内外的一些框架也开始支持此种的开发方式,详细介绍如下。
438 5