Heim > Web-Frontend > js-Tutorial > JS-Array-Lernen: Erstellung und Zugriff auf eindimensionale und zweidimensionale Arrays

JS-Array-Lernen: Erstellung und Zugriff auf eindimensionale und zweidimensionale Arrays

青灯夜游
Freigeben: 2021-08-17 12:15:59
Original
2790 Leute haben es durchsucht

在之前的文章《JS数组学习之清空全部元素的4种方法(代码详解)》中,我们删除全部数组元素--即清空数组的4种方法。下面继续JavaScript数组的学习,我们来聊聊一维数组、二维数组的创建和访问,并扩充一下简单聊聊多维数组。

首先我们来看看一维数组是怎么创建和访问的。

一维数组的创建和访问

一维数组有两种创建方法:“数组直接量”和“Array()函数”。

1、数组直接量 “[]

1)我们可以直接使用“[]”来给一个变量赋值,“[]”中可以是空的,那么就是定义空数组:

var a = [];  //空数组
Nach dem Login kopieren

使用数组的length属性来获取数组长度,返回值会为0。

console.log(a.length);
Nach dem Login kopieren

JS-Array-Lernen: Erstellung und Zugriff auf eindimensionale und zweidimensionale Arrays

此时我们可以使用 数组名[下标]=值 的形式给空数组赋值

a[0]=1;
a[1]="hello";
Nach dem Login kopieren

JS-Array-Lernen: Erstellung und Zugriff auf eindimensionale und zweidimensionale Arrays

数组下标不仅仅可以是数字,也可以为文本字符串,那么此时数组就是一个关联数组

a["姓名"]="张三";
a["年龄"]=23;
Nach dem Login kopieren

JS-Array-Lernen: Erstellung und Zugriff auf eindimensionale und zweidimensionale Arrays

如果数组的下标值超出范围,如负数、浮点数、布尔值、对象或其他值,JavaScript 会自动把它转换为一个字符串,并定义为关联数组。

2)也可以直接定义数组并初始化

直接在“[]”中包含多个值列表,值之间用逗号分隔即可。

var a = [1, 2, 3];  //包含具体元素的数组
Nach dem Login kopieren

使用数组的length属性来获取数组长度,返回值就是具体定义的数组元素数目。

JS-Array-Lernen: Erstellung und Zugriff auf eindimensionale und zweidimensionale Arrays

2、使用new Array()构造数组

1)如果直接调用 Array() 函数,不传递参数,可以创建一个空数组。

var a = new Array();  //空数组
Nach dem Login kopieren

使用数组的length属性来获取数组长度,返回值会为0。

JS-Array-Lernen: Erstellung und Zugriff auf eindimensionale und zweidimensionale Arrays

2)如果调用Array() 函数时,传递多个值(值之间用逗号分隔),可以创建一个实数组。

var a = new Array(1,2,3);
Nach dem Login kopieren

3)如果调用Array() 函数时,只传递一个数值参数,那么就表示只定义了数组的长度,即包含元素的个数;数组元素为空,每个元素的值默认值为 undefined。(数组中元素值没有定义,在语法上两个逗号之间没有任何值的元素,被称为空位元素)

var a = new Array(3);
Nach dem Login kopieren

JS-Array-Lernen: Erstellung und Zugriff auf eindimensionale und zweidimensionale Arrays

像这种包含一个或多个空位元素的数组,也被称为空位数组。

var a = [1, , 2];
Nach dem Login kopieren
var a = [1, 2, 3];
delete a[1];
Nach dem Login kopieren

也可产生空位元素,形成空位数组。

3、访问数组

访问数组就是访问数组元素。我们可以使用 数组名[下标表达式] 的形式来进行访问,读写数组。

注:下标表达式是值为非负整数的表达式。

例如上文中的

delete a[1]
Nach dem Login kopieren

就是使用delete关键字删除a数组中下标为1的元素(即删除第二个元素)。

还有:

var a = [];  //空数组
a[0]=1;
a[2]="hello";
Nach dem Login kopieren

就是分别为a数组中下标为0和2的元素赋值,下标为1的元素的值没有赋值则为undefined。我们想要输出指定数组元素时,也可使用这种形式

console.log(a[0]);  //读取第一个元素,返回值为1
console.log(a[1]);  //读取第二个元素,返回值为undefined
console.log(a[2]);  //读取第三个元素,返回值为hello
Nach dem Login kopieren

JS-Array-Lernen: Erstellung und Zugriff auf eindimensionale und zweidimensionale Arrays

二维数组的创建和访问

JavaScript 并没有直接支持二维数组,但是可以设置数组元素的值等于数组,这样就能模拟二维数组的结构。

1、定义二维数组

定义二维数组的方法1:

var a = [];
a[0,0] = 1;
a[0,1] = 2;
a[1,0] = 3;
a[1,1] = 4;
Nach dem Login kopieren

定义二维数组的方法2:

var a = [  //定义二维数组
    [1.1, 1.2],
    [2.1, 2.2]
];
Nach dem Login kopieren

JS-Array-Lernen: Erstellung und Zugriff auf eindimensionale und zweidimensionale Arrays

定义二维数组的方法3:

var a = new Array(
[1.1, 1.2],
[2.1, 2.2]);  //定义二维数组
Nach dem Login kopieren

JS-Array-Lernen: Erstellung und Zugriff auf eindimensionale und zweidimensionale Arrays

按照这种思想,如果二维数组中每个元素的值也为数组,则可以模拟三维数组,以此类推,通过数组嵌套的形式可以定义多维数组。

2、访问二维数组

访问二维数组甚至三维数组、多维数组的方法,和访问一维数组的方法一样,都是使用中括号进行访问:

数组名[下标表达式1] [下标表达式2]

数组名[下标表达式1] [下标表达式2] [下标表达式3]

...

数组名[下标表达式1] [下标表达式2] [下标表达式3]...[下标表达式N]
Nach dem Login kopieren

更高维度的数组以此类推。

好了,就说到这里了,有需要的可以看:javascript高级教程

Das obige ist der detaillierte Inhalt vonJS-Array-Lernen: Erstellung und Zugriff auf eindimensionale und zweidimensionale Arrays. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage