搜索
首页web前端js教程关于JavaScript数组,你所不知道的3件事

在编程语言当中,数组(Array)是一个非常常用的功能;它是一种特殊的变量,可以用来同时储存多个数值。然而,在JavaScript方面,数组的功能还有很多其他值得探索的地方。

在这篇文字中,我们将会讨论JavaScript数组的三个并不那么常见的功能。

1. 给数组添加自定义属性

在网上搜寻有关JavaScript数组的定义时,你会发现几乎所有人对于数组的定义都一样:一种对象。

事实上,我们用JavaScript处理的所有东西,都可以视为是一种对象。JavaScript中有两种数据类型,基本类型数对象类型,但是基本类型基本都是包括在对象类型之中的。

数组、函数、Date在JavaScript中都是预定义的对象,它们内部都包含了方法、属性和各自的标准化句法。

JavaScript数组有以下三种不同的属性:

1 数组的索引也是其属性

2 内置属性

3 你可以自己添加自定义属性

前两种属性是大家比较熟知的,你可能每天都在使用,但是我还是想在这里简单的多说两句,然后再来谈谈如何给数组添加自定义属性。

将索引作为属性

JavaScript数组可以使用方括号句法,例如var ary = [“orange”,"apple","lychee"];。

数组元素的索引基本上也是一种属性,而其属性的名称永远都是非负整数。

数组的索引元素对类似一个对象的关键值对。索引是数组对象的独特特性,与其他内置属性不同,它们可以单独通过方括号进行配置,例如 ary[3] = “peach”;。

内置属性

数组拥有内置属性,例如array.length。这个长度属性包含了一个整数值,用来表示数组的长度。

一般情况下,内置属性经常可以在数组等预先定义的JavaScript对象中找到。内置属性与内置方法联合在一起,它们可以对普通对象进行自定义,让对象满足不同的需求。

在访问内置属性的时候,你可以使用两种句法:object.key或是object[“key”]。也就是说,在获取数组长度的时候,你可以写成ary[“length"]。

为数组对象创建自定义属性

现在我们来谈一谈如何为数组添加自定义属性。数组是一种预定义对象,它在不同的索引中储存了不同的种类的值。

通常情况下,我们没有给数组添加自定义属性的需要;也是出于这个原因,我们在刚刚学习JavaScript的时候,没有人告诉我们可以给数组添加属性。事实上,如果你想要向对待一般对象那样,给数组添加关键值对,你也可以使用一般的对象来达到目的。但是,这并不是说完全没有特殊情况,在某些情况下,你可以利用数组也是一种对象的事实,给它添加一个或多个自定义属性。

例如,你可以给数组添加一个可以识别元素“类型(kind)”或是“类(class)”的自定义属性。具体请参见下方实例:

 var ary = ["orange","apple","lychee"];

ary.itemClass = "fruits";

console.log(ary + " are " + ary.itemClass);

请注意,你给数组所添加的自定义属性都是可数的,也就是说,它可以被for……in等循环所拣选。

2. 在数组元素中进行循环

你可能会说:“这个我早就知道了。”没错,你已经知道如何对数组元素进行索引了。但是“在数组元素中进行循环”这样的说法你可能会觉得有些抽象,因为我们真正循环的,是数组的索引。

由于数组索引都是又非负整数所构成的,因此通常情况下,我们都会从0开始,直到数组的全部长度,来对整数值进行迭代,然后使用那个迭代后的值来根据特定的索引来获取数组元素。

然而,自从ECMAScript6出现之后,我们可以不再管索引,直接在数组值中进行循环,而且这个操作可以使用for……of循环来完成。

在数组中,for……of循环可以根据索引的顺序对数组元素进行循环,换句话说,它可以掌管索引的迭代,根据给予的索引获取一个已经存在的数组值。如果你只是想要在所有数组元素中进行循环,并且使用它们,这个循环非常实用。

 var ary = ["orange","apple","lychee"];

for (let item of ary){

  console.log(item);

}

For comparison, with the regular for loop, we get the indices instead of the values as output.

 

var ary = ["orange","apple","lychee"];

for (var item = 0; item < ary.length; item++){

  console.log(item);

}

3. 元素的数量不等同于其长度

一般情况下,当我们在谈到数组长度的时候,我们会认为其长度要么是数组值的数量,要么是我们手动给数组设定的长度。但是事实上,数组的长度取决于其内部最大的已经存在的索引。

长度是一个非常灵活的属性。无论你是否曾实现调整了数组的长度,只要你不断的给数组添加新的值,它的长度也会随之增长。

 var ary = [];

ary.length = 3;

console.log(ary.length);

ary[5] = "abcd";

console.log(ary.length);

在上面的例子中,你可以看到我给数组的索引5只指定了一个值,之后长度变成了6。现在,如果你觉得给index 5添加一个值,数组就会自动创建索引0-4,那么你的推测就出现了错误。数组中并没有应经存在的索引0-4。你可以使用in operator来查看。

 var ary = [];

ary.length = 3;

console.log(ary.length);

ary[5] = "abcd";

console.log(ary.length);

console.log(0 in ary);

上面的ary数组被我们成为稀疏数组(sparse array),这个数组的索引不会持续的被创建,而且索引之间有空气。sparse数组的对立面为密集数组(dense array)。密集数组的索引会被持续的创建,其元素的数量等于其长度。

数组的长度属性也可以用来缩短数字,确保数组中索引的最大数量永远小于数组本身,因为在默认情况下,长度的数值永远会大于索引数量的最高值。

在下面的例子中,你可以看到,我利用减少ary数组长度的方式,社区了索引5中的元素。

var ary = [];

ary.length = 3;

console.log(ary.length);

ary[5] = "abcd";

console.log(ary.length);

ary.length = 2;

console.log(ary.length);

console.log(ary[5]);

 以上就是关于JavaScript数组,你所不知道的3件事的内容,更多相关内容请关注PHP中文网(www.php.cn)! 



声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
Python vs. JavaScript:开发人员的比较分析Python vs. JavaScript:开发人员的比较分析May 09, 2025 am 12:22 AM

Python和JavaScript的主要区别在于类型系统和应用场景。1.Python使用动态类型,适合科学计算和数据分析。2.JavaScript采用弱类型,广泛用于前端和全栈开发。两者在异步编程和性能优化上各有优势,选择时应根据项目需求决定。

Python vs. JavaScript:选择合适的工具Python vs. JavaScript:选择合适的工具May 08, 2025 am 12:10 AM

选择Python还是JavaScript取决于项目类型:1)数据科学和自动化任务选择Python;2)前端和全栈开发选择JavaScript。Python因其在数据处理和自动化方面的强大库而备受青睐,而JavaScript则因其在网页交互和全栈开发中的优势而不可或缺。

Python和JavaScript:了解每个的优势Python和JavaScript:了解每个的优势May 06, 2025 am 12:15 AM

Python和JavaScript各有优势,选择取决于项目需求和个人偏好。1.Python易学,语法简洁,适用于数据科学和后端开发,但执行速度较慢。2.JavaScript在前端开发中无处不在,异步编程能力强,Node.js使其适用于全栈开发,但语法可能复杂且易出错。

JavaScript的核心:它是在C还是C上构建的?JavaScript的核心:它是在C还是C上构建的?May 05, 2025 am 12:07 AM

javascriptisnotbuiltoncorc; saninterpretedlanguagethatrunsonenginesoftenwritteninc.1)javascriptwasdesignedAsalightweight,解释edganguageforwebbrowsers.2)Enginesevolvedfromsimpleterterterpretpreterterterpretertestojitcompilerers,典型地提示。

JavaScript应用程序:从前端到后端JavaScript应用程序:从前端到后端May 04, 2025 am 12:12 AM

JavaScript可用于前端和后端开发。前端通过DOM操作增强用户体验,后端通过Node.js处理服务器任务。1.前端示例:改变网页文本内容。2.后端示例:创建Node.js服务器。

Python vs. JavaScript:您应该学到哪种语言?Python vs. JavaScript:您应该学到哪种语言?May 03, 2025 am 12:10 AM

选择Python还是JavaScript应基于职业发展、学习曲线和生态系统:1)职业发展:Python适合数据科学和后端开发,JavaScript适合前端和全栈开发。2)学习曲线:Python语法简洁,适合初学者;JavaScript语法灵活。3)生态系统:Python有丰富的科学计算库,JavaScript有强大的前端框架。

JavaScript框架:为现代网络开发提供动力JavaScript框架:为现代网络开发提供动力May 02, 2025 am 12:04 AM

JavaScript框架的强大之处在于简化开发、提升用户体验和应用性能。选择框架时应考虑:1.项目规模和复杂度,2.团队经验,3.生态系统和社区支持。

JavaScript,C和浏览器之间的关系JavaScript,C和浏览器之间的关系May 01, 2025 am 12:06 AM

引言我知道你可能会觉得奇怪,JavaScript、C 和浏览器之间到底有什么关系?它们之间看似毫无关联,但实际上,它们在现代网络开发中扮演着非常重要的角色。今天我们就来深入探讨一下这三者之间的紧密联系。通过这篇文章,你将了解到JavaScript如何在浏览器中运行,C 在浏览器引擎中的作用,以及它们如何共同推动网页的渲染和交互。JavaScript与浏览器的关系我们都知道,JavaScript是前端开发的核心语言,它直接在浏览器中运行,让网页变得生动有趣。你是否曾经想过,为什么JavaScr

See all articles

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热门文章

热工具

VSCode Windows 64位 下载

VSCode Windows 64位 下载

微软推出的免费、功能强大的一款IDE编辑器

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

WebStorm Mac版

WebStorm Mac版

好用的JavaScript开发工具

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

适用于 Eclipse 的 SAP NetWeaver 服务器适配器

适用于 Eclipse 的 SAP NetWeaver 服务器适配器

将Eclipse与SAP NetWeaver应用服务器集成。