Javascript数组

时间 2021-08-13

标签 javascript html java 数组 dom ide 函数网站 url 栏目 JavaScript 繁體版

原文原文链接

JavaScript容许咱们使用一个数组（Array）来存储和访问相关的数据。一个数组有点像一行单元格（元素），每一个单元格包含一个独立的数据项。一个数组能够存储JavaScript支持的任何数据类型。所以，举例来讲，你能够使用一个数组来处理用户用来选择的项目列表，或者一批图象坐标，或者一组图像的引用。

Array对象，相似String 和Date对象，须要使用new关键字和构造函数来建立。咱们能够在建立它的时候初始化一个数组对象：

var preInitArray = new Array( "First item", "Second item",➥

"Third Item" );

或者设置它来保存必定数目的数据像：

var preDeterminedSizeArray = new Array( 3 );

或者只建立一个空数组：

var anArray = new Array();

你能够经过为这些元素赋值的方式来为数组添加新的数据项：

anArray[0] = "anItem"

anArray[1] = "anotherItem"

anArray[2] = "andAnother"

n 提示：你能够不使用array()构造函数；并且使用简写符号是颇有效的：

var myArray = [1, 2, 3];

var yourArray = ["red", "blue", "green"]

只要你构造了一个数组，咱们就能够使用中括号，经过索引和位置（它也是基于0开始的）来访问它的元素：

<html>

<body>

var preInitArray = new Array( "First Item",➥

"Second Item", "Third Item" );

document.write( preInitArray[0] + "<br>" );

document.write( preInitArray[1] + "<br>" );

document.write( preInitArray[2] + "<br>" );

</script>

</body>

</html>

若是你想循环遍历整个数组，使用索引数来存储数据项是很是有用的，咱们下面会看一下循环。

你能够不使用数字索引而使用关键字来访问数据元素，像这样：

<html>

<body>

// Creating an array object and setting index

// position 0 to equal the string Fruit

var anArray = new Array( );

anArray[0] = "Fruit";

// Setting the index using the keyword

// 'CostOfApple' as the index.

anArray["CostOfApple"] = 0.75;

document.write( anArray[0] + "<br>" );

document.write( anArray["CostOfApple"] );

</script>

</body>

</html>

关键字在下面的一些状况下是很是有效的，在你能够给数据分配有用地标签，或者你存储一些只有在上下文中才有效的实体的地方，如一个图像坐标列表。但是，若是它们已经使用关键字被设置了，那么你不能使用索引数来访问实体（在一些其余的语言中是能够的，如PHP）。咱们也能够使用变量做为索引。咱们使用变量（一个保存一个字符串，另外一个保存一个数字）代替文本值，改写一下前面的例子：

<html>

<body>

var anArray = new Array( );

var itemIndex = 0;

var itemKeyword = "CostOfApple";

anArray[itemIndex] = "Fruit";

anArray[itemKeyword] = 0.75;

document.write( anArray[itemIndex] + "<br>" );

document.write( anArray[itemKeyword] );

</script>

</body>

</html>

让咱们把已讨论过的数组和Math对象的知识应用到一个例子中。咱们会写一个简单的脚本，它随机的选取一个广告横幅显示到网页的顶部。

咱们会使用一个数组对象来保存一些图像的源文件名，以下：

var bannerImages = new Array();

bannerImages[0] = "Banner1.jpg";

bannerImages[1] = "Banner2.jpg";

bannerImages[2] = "Banner3.jpg";

bannerImages[3] = "Banner4.jpg";

bannerImages[4] = "Banner5.jpg";

bannerImages[5] = "Banner6.jpg";

bannerImages[6] = "Banner7.jpg";

接着咱们须要六个对应名字的图片，放在和HTML网页相同的文件夹里。你能够使用你本身的图片或者从网站[url]http://www.beginningjavascript.com[/url]上下载我本身的。

接下来咱们会初始化一个新的变量，randomImageIndex，使用它来产生一个随机数。在这里咱们会使用与前面曾经用过的产生一个随机掷骰子相同的方法，可是不用在结果上加1，由于咱们须要产生一个0到6之间的随机数：

var randomImageIndex = Math.round( Math.random( ) * 6 );

而后咱们会使用document.write()把随机选择的图片写到网页中。下面是它的完整的代码：

<html>

<body>

var bannerImages = new Array( );

bannerImages[0] = "Banner1.jpg";

bannerImages[1] = "Banner2.jpg";

bannerImages[2] = "Banner3.jpg";

bannerImages[3] = "Banner4.jpg";

bannerImages[4] = "Banner5.jpg";

bannerImages[5] = "Banner6.jpg";

bannerImages[6] = "Banner7.jpg";

var randomImageIndex = Math.round( Math.random( ) * 6 );

document.write( "<img alt=\"\" src=\"" + ➥

bannerImages[randomImageIndex] + "\">" );

</script>

</body>

</html>

上面就是与之相关的全部东西了。使广告横幅不断的变化比每次访问网页的时候都显示一样的横幅广告更加容易引发访问者的注意，固然，它还会给访问者一个印象，这个站点在常常地被更新。