0

0

Javascript数组什么意思

青灯夜游

青灯夜游

发布时间:2021-07-21 19:06:52

|

2920人浏览过

|

来源于php中文网

原创

在Javascript中,数组是指有序数据的集合,数组中的每个成员被称为元素,每个元素的名称(键)被称为数组下标(Index);数组的长度是弹性的、可读写的。

Javascript数组什么意思

本教程操作环境:windows7系统、javascript1.8.5版、Dell G3电脑。

JavaScript 数组(Array)是有序数据的集合,数组中的每个成员被称为元素(Element),每个元素的名称(键)被称为数组下标(Index)。数组的长度是弹性的、可读写的。

Array 数组对象是 JS 的内置对象,它可以用一个变量来存储一系列相同或不同类型的值,其中存储的每个值称为数组元素。

JS数组的创建

立即学习Java免费学习笔记(深入)”;

使用 Array 对象存储数据之前必须先创建 Array 对象。创建 Array 对象有多种方式,下面列出两种常用方式。

  • 方式一:var 数组对象名 = [元素1,元素2,…,元素n];

  • 方式二:var 数组对象名 = new Array(元素1,元素2,…,元素n);

方式一是一种较简洁的数组创建方法,而方式二则是一种较正式的数组创建方法。这两种创建方式都返回新创建并被初始化了的数组对象,它们都使用参数指定的值初始化数组,元素个数(也叫数组长度)为参数的个数。这两种方式效果在一般情况下是一样的,但由于方式一更简洁,因此在实际应用中最常用。

数组创建示例:

var hobbies1 = ["旅游","运动","音乐"];
var hobbies2 = new Array("旅游","运动","音乐");

上面示例代码创建了两个包含 3 个元素的数组对象,它们是完全等效的,但第一行代码更简洁。

需要注意的是:上述两种创建数组的方式,一般情况下是完全等效的,除了只有一个数值类型参数的情况。因为此时,使用第一种创建方式时,表示创建的是一个只包含一个元素的数组,该元素的值等于数值参数;使用第二种创建方式,则表示创建了一个长度等于数值类型参数的数组,例如:

var arr = [3]; //创建了一个只有一个元素的数组,元素值为3
var arr = new Array(3);//创建了一个有3个元素的数组,3个元素值均为undefined

JS数组元素的引用

数组中存储的每个元素都有一个位置索引(也叫下标),数组下标从 0  开始,到数组长度 -1 结束,即第一个元素的下标为 0,最后一个元素的下标为数组长度 -1。

引用数组元素时可以通过数组名和下标来实现,引用格式如下:

数组名[元素下标]

例如:一个包含 3 个元素的名为 arr 的数组的 3 个元素,可分别通过:arr[0]、arr[1] 和 arr[2] 来引用。

JS数组的访问

访问数组有两种方式:

  • 一是直接访问数组名,此时将返回数组中存储的所有元素值。例如,alert(hobbies1),该语句执行后将在警告对话框中输出上面创建的 hobbies1 数组中存储的所有元素值:旅游,运动,音乐;

  • 二是使用数组加下标访问,此时将返回数组下标对应的数组元素值。例如:alert(hobbies1[1]),该语句执行后将在警告对话框中输出“运动”。

JS遍历数组(for in和forEach循环)

JS 遍历数组(循环数组)的方式有多种,可以使用传统的 for 循环,也可以使用升级版的 for in 循环,还可以使用 Array 类型的 forEach() 方法;如果希望遍历对象的键名,还可以使用 keys() 方法。

1、使用 for 和 for in遍历数组

for 和 for/in 语句都可以迭代数组。for 语句需要配合 length 属性和数组下标来实现,执行效率没有 for/in 语句高。另外,for/in 语句会跳过空元素。

对于超长数组来说,建议使用 for/in 语句进行迭代。 

天织在线购物网站
天织在线购物网站

本网站是一套基于Web2.0思想设计、采用asp.net2.0开发的社区门户产品。它同时也是一套Web2.0全面解决方案,包含:个人注册,物品购买,订单管理等功能,可以根据客户需求任意组合、无缝集成。它采用了业内领先的技术体系架构、隐私保护功能、用户评价体系、优异的缓存技术、全文检索技术。可以承载千万级的数据,具备优异的扩展性并提供丰富的API,方便客户进行产品定制或者二次开发。 记得上次我发的天

下载

示例1

下面示例使用 for 语句迭代数组,过滤出所有数字元素。

var a = [1, 2, ,,,,,,true,,,,,,, "a",,,,,,,,,,,,,,,4,,,,,56,,,,,,"b"];  //定义数组
var b = [], num = 0;
for (var i = 0; i < a.length; i ++) {  //遍历数组
    if (typeof a[i] == "number")  //如果为数字,则返回该元素的值
        b.push(a[i]);
    num ++;  //计数器
}
console.log(num);  //返回42,说明循环了42次
console.log(b);  //返回[1,2,4,56]

示例2

下面代码使用 for/in 语句迭代示例 1 中的数组 a。在 for/in 循环结构中,变量 i 表示数组的下标,而 a[i] 为可以读取指定下标的元素值。

var b = [], num = 0;
for (var i in a) {  //遍历数组
    if(typeof a[i] == "number")  //如果为数字,则返回该元素的值
        b.push(a[i]);
    num ++;  //计数器
}
console.log(num);   //返回7,说明循环了7次
console.log(b);  //返回[1,2,4,56]

通过计时器可以看到,for/in 语句迭代数组,仅循环了 7 次,而 for 语句循环了 42 次。

2、使用 forEach 遍历数组

Array 类型为每个数组定义了 forEach() 原型方法,使用该方法可以为数组执行迭代操作。具体说明如下:

array.forEach(callbackfn[, thisArg]);

参数说明如下:

  • array:一个数组对象。

  • callbackfn:必需参数,最多可以接收三个参数的函数。forEach 将为数组中的每个元素调用 callbackfn 函数一次。

  • thisArg:可选参数,callbackfn 函数中的 this 可引用的对象。如果省略 thisArg,则 this 的值为 undefined。

对于数组中出现的每个元素,forEach 方法都会调用 callbackfn 函数一次,采用升序索引顺序,但不会为数组中空元素调用回调函数。

除了数组对象之外,forEach 方法还可以用于有 length 属性且具有已按数字编制索引的属性名的任何对象,如关联数组对象、Arguments 等。

回调函数语法如下:

funtion callbackfn(value, index, array);

最多可以使用三个参数来声明回调函数。回调函数的参数说明如下。

  • value:数组元素的值。

  • index:数组元素的数字索引。

  • array:包含该元素的数组对象。

forEach 方法不直接修改原始数组,但回调函数可能会修改它。

示例

下面示例使用 forEach 迭代数组 a,然后把每个元素的值和下标索引输出显示,代码如下:

function f(value,index,array) {
    console.log("a[" + index + "] = " + value);
}
var a = ['a', 'b', 'c'];
a.forEach(f);

演示结果如下:

1.gif

【推荐学习:javascript高级教程

相关文章

java速学教程(入门到精通)
java速学教程(入门到精通)

java怎么学习?java怎么入门?java在哪学?java怎么学才快?不用担心,这里为大家提供了java速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!

下载

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
php中foreach用法
php中foreach用法

本专题整合了php中foreach用法的相关介绍,阅读专题下面的文章了解更多详细教程。

74

2025.12.04

length函数用法
length函数用法

length函数用于返回指定字符串的字符数或字节数。可以用于计算字符串的长度,以便在查询和处理字符串数据时进行操作和判断。 需要注意的是length函数计算的是字符串的字符数,而不是字节数。对于多字节字符集,一个字符可能由多个字节组成。因此,length函数在计算字符串长度时会将多字节字符作为一个字符来计算。更多关于length函数的用法,大家可以阅读本专题下面的文章。

925

2023.09.19

js正则表达式
js正则表达式

php中文网为大家提供各种js正则表达式语法大全以及各种js正则表达式使用的方法,还有更多js正则表达式的相关文章、相关下载、相关课程,供大家免费下载体验。

514

2023.06.20

js获取当前时间
js获取当前时间

JS全称JavaScript,是一种具有函数优先的轻量级,解释型或即时编译型的编程语言;它是一种属于网络的高级脚本语言,主要用于Web,常用来为网页添加各式各样的动态功能。js怎么获取当前时间呢?php中文网给大家带来了相关的教程以及文章,欢迎大家前来学习阅读。

244

2023.07.28

js 字符串转数组
js 字符串转数组

js字符串转数组的方法:1、使用“split()”方法;2、使用“Array.from()”方法;3、使用for循环遍历;4、使用“Array.split()”方法。本专题为大家提供js字符串转数组的相关的文章、下载、课程内容,供大家免费下载体验。

298

2023.08.03

js是什么意思
js是什么意思

JS是JavaScript的缩写,它是一种广泛应用于网页开发的脚本语言。JavaScript是一种解释性的、基于对象和事件驱动的编程语言,通常用于为网页增加交互性和动态性。它可以在网页上实现复杂的功能和效果,如表单验证、页面元素操作、动画效果、数据交互等。

5306

2023.08.17

js删除节点的方法
js删除节点的方法

js删除节点的方法有:1、removeChild()方法,用于从父节点中移除指定的子节点,它需要两个参数,第一个参数是要删除的子节点,第二个参数是父节点;2、parentNode.removeChild()方法,可以直接通过父节点调用来删除子节点;3、remove()方法,可以直接删除节点,而无需指定父节点;4、innerHTML属性,用于删除节点的内容。

481

2023.09.01

js截取字符串的方法
js截取字符串的方法

js截取字符串的方法有substring()方法、substr()方法、slice()方法、split()方法和slice()方法。本专题为大家提供字符串相关的文章、下载、课程内容,供大家免费下载体验。

212

2023.09.04

俄罗斯Yandex引擎入口
俄罗斯Yandex引擎入口

2026年俄罗斯Yandex搜索引擎最新入口汇总,涵盖免登录、多语言支持、无广告视频播放及本地化服务等核心功能。阅读专题下面的文章了解更多详细内容。

158

2026.01.28

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
React 教程
React 教程

共58课时 | 4.2万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 2.5万人学习

Bootstrap 5教程
Bootstrap 5教程

共46课时 | 3万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号