JavaScript中的Array（数组）对象

目录

一、Array数组对象

1、介绍

2、创建数组对象并赋值

3、访问数组元素

二、Array对象属性

1、constructor属性

2、length属性

3、prototype属性

三、Array对象的常用方法

1、isArray()

2、concat()

3、pop()

4、shift()

5、push()

6、unshift()

7、reverse()

8、sort()

9、some()

10、every()

11、filter()

12、find()

13、findIndex()

14、slice()

15、splice()

16、includes

17、indexOf()

18、join()

19、toString()

20、fill()

21、forEach()

22、map()

一、Array数组对象

1、介绍

  • JavaScript中的数组对象（简称：数组），使用单独变量名存储一组值；
  • 数组是引用类型数据；
  • 数组的索引值从0开始，第一个元素在索引为0处；
  • JavaScript中频繁使用；

2、创建数组对象并赋值

// 1、使用Array()构造函数 创建数组对象 然后赋值
let arr1 = new Array();
arr1[0] = "元素1";
arr1[1] = "元素2";
arr1[2] = "元素3";
console.log("创建的第1个数组arr1：", arr1);// 2、使用Array()构造函数 创建数组对象的同时赋值
let arr2 = new Array("A", "B", "C", "D");
console.log("创建的第2个数组arr2：", arr2);// 3、使用数组字面量 创建数组对象并赋值
let arr3 = [1, 2, 3, 4, 5];
console.log("创建的第3个数组arr3：", arr3);

3、访问数组元素

通过指定数组名和索引值，来访问数组中的元素；

let arr = [1, 2, 3, 4, 5];
console.log("获取数组中的第1个元素：", arr[0]);
console.log("修改前的第4个元素：", arr[3]);
console.log("修改数组中的第4个元素：", arr[3] = 8);
console.log("修改后的第4个元素：", arr[3]);

二、Array对象属性

序号属性描述
1constructor返回创建数组对象的原型函数；
2length设置或返回数组元素的个数（数组长度）；
3prototype允许你向数组对象添加属性或方法；

1、constructor属性

let newArr = [1, 2, 3, 4, 5];
console.log("constructor属性：", newArr.constructor);

2、length属性

let newArr = [1, 2, 3, 4, 5];
console.log("length属性：", newArr.length);

3、prototype属性

Array.prototype.user = "zyl";
Array.prototype.getLastItem = ()=>{return newArr[newArr.length - 1];
}let newArr = [1, 2, 3, 4, 5];
console.log("使用prototype定义的属性user：", newArr.user);
console.log("使用prototype定义的方法getLastItem()：", newArr.getLastItem());

三、Array对象的常用方法

序号方法描述返回值是否影响原数组
1isArray()判断对象是否为数组；Boolean值；否
2concat()拼接多个数组，并返回结果；拼接后的新数组；否
3pop()移除数组中的最后一个元素；被移除的元素；是
4shift()移除数组中的第一个元素；被移除的元素；是
5push()向数组末尾多个插入元素；数组长度；是
6unshift()向数组起始位置插入元素；数组长度；是
7reverse()反转数组；反转后的原数组；是
8sort()对数组进行排序；排序后的原数组；是
9some()判断数组中是否包含指定条件的元素；Boolean值；否
10every()判断数组中的每个元素是否均符合指定条件；Boolean值；否
11filter()筛选出所有符合条件的元素组成的数组；新数组；否
12find()筛选出第一个符合条件的数组元素；数组元素；否
13findIndex()查找第一个符合条件元素的索引值；数组元素索引值；否
14slice()用于截取数组；截取后的新数组；否
15splice()给数组中添加或删除元素；被删除元素组成的新数组；是
16includes()判断数组中是否包含指定元素；Boolean值；否
17indexOf()查找数组中指定元素的索引值；索引值；否
18join()用于将数组元素连接成一个字符串；字符串；否
19toString()用于将数组元素连接成一个字符串；字符串；否
20fill()使用固定值填充数组；数组；是
21forEach()使数组中的每个元素都执行一次回调函数；无；否
22map()通过指定方法，处理数组中的每个元素；处理后元素依次组成的新数组；否

1、isArray()

Array.isArray(obj)
  • 该方法用来判断传入的对象是否为数组；
  • obj，为必填参数，表示要判断的对象；
  • 如果是数组，返回true；否则返回false；
  • 不影响原数组；
let obj = {name:"zyl"};
let arr = [1, 2, 3, 4, 5];
console.log("判断是否为数组：", Array.isArray(obj));
console.log("判断是否为数组：", Array.isArray(arr));

2、concat()

array1.concat(array2, array3,..., arrayX)
  • 该方法用来连接多个数组；
  • array2, array3,..., arrayX 为必须参数（1-x个），表示要拼接的数组；
  • 返回连接后的新数组；
  • 原数组不变；
// 2、concat()方法
let arr1 = [1, 2, 3, 4, 5];
let arr2 = ["A", "B", "C", "D"]
console.log("拼接后的arr1和arr2：", arr1.concat(arr2, arr2));

 

3、pop()

array.pop();
  • 该方法用来删除数组的最后一个元素；
  • 无参数；
  • 返回被删除的元素；
  • 改变原数组；
let arr = [1, 2, 3, 4, 5];
console.log("返回值：", arr.pop());
console.log("原数组：", arr);

4、shift()

array.shift()
  • 该方法用来删除数组中的第一个元素；
  • 无参数；
  • 返回被删除的第一个数组元素；
  • 改变原数组；
let arr = [1, 2, 3, 4, 5];
console.log("返回值：", arr.shift());
console.log("原数组：", arr);

5、push()

array.push(item1, item2, ..., itemX)
  • 该方法用来在数组末尾插入元素；
  • item1, item2, ..., itemX为要插入的元素；
  • 返回插入元素后的数组长度；
  • 改变原数组；
let arr = [1, 2, 3, 4, 5];
console.log("返回值：", arr.push(6, 7, 8));
console.log("原数组：", arr);

6、unshift()

array.unshift(item1, item2, ..., itemX)
  • 该方法用来在数组起始位置插入元素；
  • item1, item2, ..., itemX为要插入的元素；
  • 返回插入元素后的数组长度；
  • 改变原数组；
let arr = [1, 2, 3, 4, 5];
console.log("返回值：", arr.unshift(6, 7, 8));
console.log("原数组：", arr);

7、reverse()

array.reverse()
  • 该方法用来反转数组元素；
  • 无参数；
  • 返回反转后的原数组；
  • 改变原数组；
let arr = [1, 2, 3, 4, 5];
console.log("返回值：", arr.reverse());
console.log("原数组：", arr);

8、sort()

array.sort(sortfunction)
  • 该方法用来对数组元素进行排序；
  • sortfunction为可选参数，规定排序顺序，必须是函数；
  • 返回排序后的原数组；
  • 改变原数组；
  • 注意：默认升序，需要倒序的话，可以传入排序函数，也可以结合reverse()方法实现；
let arr = [6, 2, 9, 4, 5];
console.log("返回值：", arr.sort());
console.log("原数组：", arr);

9、some()

array.some(function(currentValue,index,arr), thisValue)
  • 该方法用于检测数组中，是否包含有符合指定条件的元素；
  • 只要有一个符合条件的元素则返回true，都不满足则返回false；
  • 不影响原数组；
  • 不会对空数组进行检测，直接返回false；
let arr = [1, 2, 3, 4, 5];
console.log("返回值：", arr.some((item)=>{return item > 2 ;
}));
console.log("原数组：", arr);console.log("空数组：", [].some((item)=>{return item > 2 ;
}));

10、every()

array.every(function(currentValue,index,arr), thisValue)
  • 该方法用于检测数组中的每个元素是否都符合指定条件；
  • 每个元素都符合条件则返回true，否则返回false；
  • 不影响原数组；
  • 不会对空数组进行检测，直接返回true；
let arr = [1, 2, 3, 4, 5];
console.log("返回值：", arr.every((item)=>{return item > 2 ;
}));
console.log("原数组：", arr);console.log("空数组：", [].every((item)=>{return item > 2 ;
}));

11、filter()

array.filter(function(currentValue,index,arr), thisValue)
  • 该方法用于筛选数组中所有符合条件的元素；
  • 返回筛选出来的元素组成的新数组；
  • 不影响原数组；
  • 对于空数组，不会进行操作，直接返回[]；
let arr = [1, 2, 3, 4, 5];
console.log("返回值：", arr.filter((item)=>{return item > 2 ;
}));
console.log("原数组：", arr);console.log("空数组：", [].filter((item)=>{return item > 2 ;
}));

12、find()

array.find(function(currentValue, index, arr), thisValue)
  • 该方法用于筛选数组中第一个符合条件的元素；
  • 返回筛选出来的数组元素；
  • 不影响原数组；
  • 对于空数组，不会执行回调函数，直接返回undefined；
let arr = [1, 2, 3, 4, 5];
console.log("返回值：", arr.find((item)=>{return item > 2 ;
}));
console.log("原数组：", arr);console.log("空数组：", [].find((item)=>{return item > 2 ;
}));

13、findIndex()

array.findIndex(function(currentValue, index, arr), thisValue)
  • 该方法用于筛选数组中第一个符合条件元素的索引值（数组元素的索引值从0开始）；
  • 返回筛选出来的数组元素的索引值， 如果没有符合条件的元素返回 -1；
  • 不影响原数组；
  • 对于空数组，不会执行回调函数，返回-1；
let arr = [1, 2, 3, 4, 5];
console.log("返回值：", arr.findIndex((item)=>{return item > 2 ;
}));
console.log("原数组：", arr);console.log("空数组：", [].findIndex((item)=>{return item > 2 ;
}));

14、slice()

array.slice(start, end)
  • 该方法用来截取数组，并返回截取后的新数组；
  • start为可选参数，为开始截取的位置（截取的时候包含）；可以为负数，表示在数组中从后往前的位置；
  • end为可选参数，为截取的结束位置（截取的时候不包含）；可以为负数，表示数组中从后往前的位置；end必须大于start；
  • 不影响原数组；
let arr = [1, 2, 3, 4, 5];
console.log("返回值：", arr.slice(1, 4));
console.log("返回值：", arr.slice(-2));
console.log("返回值：", arr.slice());
console.log("原数组：", arr);

15、splice()

array.splice(index,howmany,item1,.....,itemX)
  • 该方法用于给数组中添加元素或删除元素；
  • index 为必选参数，表示进行添加或删除的起始位置（操作时包含该位置）；
  • howmany 为可选参数，必须是数字，表示要删除的元素个数，可以为0；若未传入，则默认为所有元素；
  • item1,.....,itemX 为可选参数，表示要添加到数组的新元素；
  • 改变原数组；
let arr1 = [1, 2, 3, 4, 5];
console.log("arr1的返回值：", arr1.splice(1, 4));
console.log("arr1的原数组：", arr1);let arr2 = [1, 2, 3, 4, 5];
console.log("arr1的返回值：", arr2.splice(2));
console.log("arr1的原数组：", arr2);let arr3 = [1, 2, 3, 4, 5];
console.log("arr1的返回值：", arr3.splice(0, 2 , 7, 8));
console.log("arr1的原数组：", arr3);

16、includes

array.includes(searchElement, fromIndex)
  • 该方法用于查找数组中是否包含指定元素；
  • searchElement 为必选参数，表示要查找的元素；
  • fromIndex 为可选参数，表示查找的起始索引值（查找时包含该位置）；若该值大于数组长度，直接返回false；
  • 若包含，则返回true，否则返回false；
  • 不影响原数组；
let arr = [1, 2, 3, 4, 5];
console.log("arr的返回值：", arr.includes(4));
console.log("arr的返回值：", arr.includes(3, 2));
console.log("arr的返回值：", arr.includes(2, 3));
console.log("arr的原数组：", arr);

17、indexOf()

array.indexOf(item,start)
  • 该方法用来查找数组中指定元素的索引值；
  • item 为必选参数，表示要查找的指定元素；
  • start 为可选参数，表示查找的起始位置；
  • 若查到该元素，则返回元素索引值，否则，返回-1；
  • 不影响原数组； 
let arr = [1, 2, 3, 4, 5];
console.log("arr的返回值：", arr.indexOf(4));
console.log("arr的返回值：", arr.indexOf(3,4));
console.log("arr的原数组：", arr);

18、join()

array.join(separator)
  • 该方法用来将数组中的所有元素连接成一个字符串；
  • separator 为可选参数，表示连接使用的分隔符，默认为逗号【，】；
  • 返回连接后的字符串；
  • 不影响原数组；
let arr = [1, 2, 3, 4, 5];
console.log("arr的返回值：", arr.join());
console.log("arr的返回值：", arr.join('--'));
console.log("arr的原数组：", arr);

19、toString()

array.toString()
  • 该方法用来将数组中的所有元素连接成一个字符串，使用逗号【，】分隔；
  • 无参数；
  • 返回连接后的字符串；
  • 不影响原数组；
let arr = [1, 2, 3, 4, 5];
console.log("arr的返回值：", arr.toString());
console.log("arr的原数组：", arr);

20、fill()

array.fill(value, start, end)
  • 该方法使用固定值替换数组元素；
  • value 为必选参数，表示要替换成的值；
  • start 为可选参数，表示开始填充的位置（填充时包括该位置）； 
  • end 为可选参数，表示填充的结束位置（填充时不包括该位置），默认到数组结束；
  • 返回替换后的数组；
  • 改变原数组；
let arr1 = [1, 2, 3, 4, 5];
console.log("arr1的返回值：", arr1.fill(8));
console.log("arr1的原数组：", arr1);let arr2 = [1, 2, 3, 4, 5];
console.log("arr2的返回值：", arr2.fill(8, 2, 4));
console.log("arr2的原数组：", arr2);

21、forEach()

array.forEach(callbackFn(currentValue, index, arr), thisValue)
  • 该方法使数组中的每个元素，均调用一次回调函数；
  • 无返回值；
  • 不影响原数组；
  • 空数组不会执行回调函数；
let arr = [1, 2, 3, 4, 5];
arr.forEach((item, index, arr)=>{item++ console.log(`${arr}中的第${index+1}个元素为${item}`);
})
console.log("原数组：", arr);

 

22、map()

array.map(function(currentValue,index,arr), thisValue)
  • 该方法通过指定函数，处理数组中的每一个元素；
  • 返回经过处理的元素依次组成的新数组；
  • 不影响原数组；
let arr = [1, 2, 3, 4, 5];
console.log("返回值：", arr.map((item)=>{return 'map' + item;
}));
console.log("原数组：", arr);

=======================================================================

每天进步一点点~！

数组的操作也太常用了吧，多看看多看看！！！

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/bicheng/39250.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

高性价比宠物空气净化器分享，希喂、霍尼韦尔、有哈PK

高性价比宠物空气净化器分享，希喂、霍尼韦尔、有哈PK

近期，家中的小猫咪仿佛化身为行走的“蒲公英”，掉毛现象愈发严重，家中每个角落乃至空气中都弥漫着难以忽视的猫毛，衣物更是无一幸免，披上了毛茸茸的“外衣”。更令人啼笑皆非的是，就连不经意间清理的眼屎中…
阅读更多...
VQA视觉问答系统

VQA视觉问答系统

这是一个典型的多模态问题，融合了CV与NLP的技术，计算机需要同时学会理解图像和文字。 Joint embedding 首先，图像和问题分别由CNN和RNN进行第一次编码得到各自的特征，随后共同输入到另一个编码器中得到joint embedding，最后通过解码器输出答案。 值得注意的是，有的工作…
阅读更多...
小红书运营教程02

小红书运营教程02

小红书大致会分享10篇左右。微博、抖音、以及视频剪辑等自媒体运营相关技能以及运营教程相关会陆续的进行分享。 上次分享涉及到的对比，母婴系列，或者可以说是服装类型，不需要自己过多的投入，对比知识类博主来说，自己将知识讲述出来，然后要以此账号进行变现就比较麻烦，…
阅读更多...
如果这时你还不清理C盘，那只能眼睁睁看着电脑越来越卡 直到系统崩溃

如果这时你还不清理C盘，那只能眼睁睁看着电脑越来越卡 直到系统崩溃

如果这时候你还不清理C盘，那只能眼睁睁看着电脑越来越卡 直到系统崩溃。很多人就是想偷懒，当然这是人的天性，明明知道自己的C盘空间就那么大，一天天看着C盘空间越来越小，还不去清理C盘。 这样的人有两种，一…
阅读更多...
软件开发案例参考

软件开发案例参考

前言：基于平台现有需求进行新功能模块开发与实现，以下内容为部分源码解析，仅提供一些思路参考，不予以客观指导，毕竟条条大路通罗马嘛； 语言：C# 工具：visual studio 2017/visual st…
阅读更多...
C++基础（二）：C++入门（一）

C++基础（二）：C++入门（一）

C是在C的基础之上，容纳进去了面向对象编程思想，并增加了许多有用的库，以及编程范式 等。熟悉C语言之后，对C学习有一定的帮助，本篇博客主要目标： 1. 补充C语言语法的不足，以及C是如何对C语言设计…
阅读更多...
【RabbitMQ实战】邮件发送（直连交换机、手动ack）

【RabbitMQ实战】邮件发送（直连交换机、手动ack）

一、实现思路 二、异常情况测试现象及解决 说明:本文涵盖了关于RabbitMQ很多方面的知识点, 如: 消息发送确认机制 、消费确认机制 、消息的重新投递 、消费幂等性, 二、实现思路 1.简略介绍163邮箱授权码的获取 2.编写发送邮件工具类 3.编写RabbitMQ配置文件 4.生产者发起调用…
阅读更多...
高考失利咨询复读，银河补习班客服开挂回复

高考失利咨询复读，银河补习班客服开挂回复

补习班的客服在高考成绩出来后，需要用专业的知识和足够的耐心来回复各种咨询，聊天宝快捷回复软件，帮助客服开挂回复。 ​ 前言 高考成绩出来，几家欢喜几家愁，对于高考失利的学生和家长，找一个靠谱的复读补…
阅读更多...
全面了解机器学习

全面了解机器学习

目录 一、基本认识 1. 介绍 2. 机器学习位置 二、机器学习的类型 1. 监督学习 2. 无监督学习 3. 强化学习 三、机器学习术语 1. 训练样本 2. 训练 3. 特征 4. 目标 5. 损失函数 四、机器学习流程 五、机器学习算法 1. 分类算法 2. 聚类算法 3. 关联分析 4. …
阅读更多...
Qt入门教程（一）：Qt使用的基本知识

Qt入门教程（一）：Qt使用的基本知识

目录 Qt简介 新建项目 构建目录和工作目录 构建目录 工作目录 项目结构 项目配置文件 .pro 用户文件 .user 主文件 main.cpp 头文件 dialog.h 源文件 dialog.cpp 帮助文档 三种查询文档的方式： 文档的重点位置：​编辑 调试信息 Qt简介 Qt…
阅读更多...
java 代码块

java 代码块

Java中的代码块主要有三种类型：普通代码块、静态代码块、构造代码块。它们的用途和执行时机各不相同。 普通代码块：在方法内部定义，使用一对大括号{}包围的代码片段。它的作用域限定在大括号内，每当程序执行到该代码块时就会执行其…
阅读更多...
全平台7合一自定义小程序源码系统功能强大 前后端分离 带完整的安装代码包以及搭建教程

全平台7合一自定义小程序源码系统功能强大 前后端分离 带完整的安装代码包以及搭建教程

系统概述 这款全平台 7 合一自定义小程序源码系统是专为满足各种业务需求而设计的。它整合了多种功能，能够在不同平台上运行，为用户提供了全方位的体验。无论你是企业主、开发者还是创业者，这款系统都能为你提供强大的支持。 代码示例 系统…
阅读更多...
crewAI实践（包含memory的启用）--AiRusumeGenerator

crewAI实践（包含memory的启用）--AiRusumeGenerator

crewAI实践--AiRusumeGenerator 什么是crewAIAiRusumeGenerator功能效果展示开发背景开发步骤1. 首先得学习下这款框架原理大概用法能够用来做什么？ 2. 安装crewAI以及使用概述3. 写代码Agents.pyTasks.pymian.py关于task中引入的自定义工具这里不再赘述 什么是crew…
阅读更多...
V Rising夜族崛起的管理员指令大全

V Rising夜族崛起的管理员指令大全

使用方法： 如果没有启用控制台需要先启用控制台 打开游戏点击选项（如果在游戏内点击ESC即可），在通用页面找到启用控制台，勾选右边的方框启用 在游戏内点击键盘ESC下方的波浪键（~）使用控制台 指…
阅读更多...
构建LangChain应用程序的示例代码：49、如何使用 OpenAI 的 GPT-4 和 LangChain 库实现多模态问答系统

构建LangChain应用程序的示例代码：49、如何使用 OpenAI 的 GPT-4 和 LangChain 库实现多模态问答系统

! pip install "openai>1" "langchain>0.0.331rc2" matplotlib pillow加载图像 我们将图像编码为 base64 字符串，如 OpenAI GPT-4V 文档中所述。 import base64 import io import osimport numpy as np from IPython.display import HT…
阅读更多...
PDF一键转PPT文件！这2个AI工具值得推荐，办公必备！

PDF一键转PPT文件！这2个AI工具值得推荐，办公必备！

PDF转换为PPT文件，是职场上非常常见的需求，过去想要把PDF文件转换为PPT，得借助各种文件转换工具，但在如今AI技术主导的大背景下，我们在选用工具时有了更多的选择，最明显的就是基于AI技术打造的AI格式转换工…
阅读更多...
《昇思25天学习打卡营第21天 | 昇思MindSporePix2Pix实现图像转换》

《昇思25天学习打卡营第21天 | 昇思MindSporePix2Pix实现图像转换》

21天 本节学习了通过Pix2Pix实现图像转换。 Pix2Pix是基于条件生成对抗网络（cGAN）实现的一种深度学习图像转换模型。可以实现语义/标签到真实图片、灰度图到彩色图、航空图到地图、白天到黑夜、线稿图到实物图的转换。Pix2Pix是将cGAN应用于有监督的图…
阅读更多...
gin框架 gin.Context中的Abort方法使用注意事项 - gin框架中立刻中断当前请求的方法

gin框架 gin.Context中的Abort方法使用注意事项 - gin框架中立刻中断当前请求的方法

gin框架上下文中的Abort序列方法（Abort，AbortWithStatus， AbortWithStatusJSON，AbortWithError）他们都不会立刻终止当前的请求，在中间件中调用Abort方法后中间件中的后续的代码会被继续执行，但是…
阅读更多...
【Unity 人性动画的复用性】

【Unity 人性动画的复用性】

Unity的动画系统，通常称为Mecanim，提供了强大的动画复用功能，特别是针对人型动画的重定向技术。这种技术允许开发者将一组动画应用到不同的角色模型上，而不需要为每个模型单独制作动画。这通过在模型的骨骼结构之间建立对应关系来…
阅读更多...
系统安全与应用

系统安全与应用

目录 1. 系统账户清理 2. 密码安全性控制 2.1 密码复杂性 2.2 密码时限 3 命令历史查看限制 4. 终端自动注销 5. su权限以及sudo提权 5.1 su权限 5.2 sudo提权 6. 限制更改GRUB引导 7. 网络端口扫描 那天不知道为什么，心血来潮看了一下passwd配置文件&am…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023