Reconstruire un tableau-js tutoriel-php.cn

Reconstruire un tableau

Un tableau est une liste ordonnée de valeurs, généralement créée pour parcourir des valeurs indexées numériquement, en commençant à l'index zéro. Ce que vous devez savoir, c'est qu'un tableau est une collection par ordre numérique, et non un objet avec des noms de propriétés associés à des valeurs qui ne sont pas par ordre numérique. Essentiellement, les tableaux utilisent des nombres comme clés de recherche, tandis que les objets ont des noms de propriétés définis par l'utilisateur. JavaScript ne dispose pas d'un véritable tableau associatif, mais vous pouvez utiliser des objets pour implémenter les fonctionnalités d'un tableau associatif.

Dans l'exemple ci-dessous, je compare et contraste quatre chaînes stockées dans myArray 中，我可以使用数字索引访问它们。我将 myArray avec des littéraux d'objet qui imitent des tableaux associatifs.

Exemple : sample133.html

<!DOCTYPE html><html lang="en"><body><script>

	var myArray = ['blue', 'green', 'orange', 'red'];

	console.log(myArray[0]); // Logs blue using the 0 index to access the string in myArray.

	// Versus

	var myObject = { // aka an associative array/hash, known as an object in JavaScript.
		'blue': 'blue',
		'green': 'green',
		'orange': 'orange',
		'red': 'red'
	};

	console.log(myObject['blue']); // Logs blue.

</script></body></html>

Copier après la connexion

Les tableaux peuvent contenir des valeurs de n'importe quel type, et ces valeurs peuvent être mises à jour ou supprimées à tout moment.

Si vous avez besoin de hachages (également appelés tableaux associatifs), les objets sont la solution la plus proche.

Array() 只是 Object() 的一种特殊类型。也就是说， Array() 实例基本上是 Object() 实例，带有几个额外的函数（.length et index numérique intégré).

Les valeurs contenues dans un tableau sont généralement appelées éléments.

`Array()` Paramètres

Vous pouvez transmettre la valeur d'une instance de tableau au constructeur sous forme d'arguments séparés par des virgules (new Array('foo', 'bar');). new Array('foo', 'bar');)。 Array() Un constructeur peut prendre jusqu'à 4 294 967 295 paramètres.

Cependant, si un seul argument est envoyé au constructeur Array() 构造函数，并且该值为整数（'1'、'123' 或 '1.0'），则它将用于设置 数组的length et que cette valeur est un entier (« 1 », « 123 » ou « 1.0 »), alors il sera utilisé pour définir la longueur du tableau, et Will ne doit pas être utilisée comme valeur contenue dans le tableau.

Exemple : sample134.html

<!DOCTYPE html><html lang="en"><body><script>

	var foo = new Array(1, 2, 3);
	var bar = new Array(100);

	console.log(foo[0], foo[2]); // Logs '1 3'.
	console.log(bar[0], bar.length); // Logs 'undefined 100'.

</script></body></html>

Copier après la connexion

`Array()` Propriétés et méthodes

Array() L'objet possède les propriétés suivantes (hors propriétés et méthodes héritées) :

Propriétés (Array.prototype):

原型

Propriétés et méthodes d'instance d'objet Array

Les instances d'objet Array ont les propriétés et méthodes suivantes (à l'exclusion des propriétés et méthodes héritées) :

Propriétés de l'instance (var myArray = ['foo', 'bar']; myArray.length;) :

构造函数
长度

Méthodes d'instance (var myArray = ['foo']; myArray.pop();) :

pop()
push()
反向()
shift()
sort()
splice()
unshift()
concat()
join()
slice()

Créer un tableau

Comme la plupart des objets en JavaScript, les objets tableau peuvent être créés à l'aide de l'opérateur new en combinaison avec les constructeurs new 运算符结合 Array() ou en utilisant une syntaxe littérale.

Dans l'exemple suivant, j'utilise le constructeur Array() 构造函数创建具有预定义值的 myArray1 数组，然后使用文字表示法创建 myArray2 pour créer un tableau de myArray1 avec des valeurs prédéfinies, puis j'utilise la notation littérale pour créer myArray2.

Exemple : sample135.html

<!DOCTYPE html><html lang="en"><body><script>

	// Array() constructor.
	var myArray1 = new Array('blue', 'green', 'orange', 'red');

	console.log(myArray1); // Logs ["blue", "green", "orange", "red"]

	// Array literal notation.
	var myArray2 = ['blue', 'green', 'orange', 'red'];

	console.log(myArray2); // logs ["blue", "green", "orange", "red"]

</script></body></html>

Copier après la connexion

Il est plus courant de définir des tableaux en utilisant une syntaxe littérale, mais il convient de noter que ce raccourci cache simplement l'utilisation du constructeur Array().

En fait, un tableau littéral est généralement tout ce dont vous avez besoin.

Peu importe la façon dont le tableau est défini, si vous ne fournissez aucune valeur prédéfinie au tableau, il sera quand même créé, mais il ne contiendra aucune valeur.

Ajouter et mettre à jour des valeurs dans des tableaux

Des valeurs peuvent être ajoutées au tableau à tout moment et à n'importe quel index. Dans l'exemple suivant, nous ajoutons une valeur à l'index numérique 50 d'un tableau vide. Qu’en est-il de tous les indices avant 50 ? Eh bien, comme je l'ai dit, vous pouvez ajouter une valeur à un tableau à tout moment et à n'importe quel index. Cependant, si vous ajoutez une valeur à l'index numérique 50 d'un tableau vide, JavaScript remplira tous les indices nécessaires avant lui avec des valeurs undefined.

Exemple : sample136.html

<!DOCTYPE html><html lang="en"><body><script>

	var myArray = [];
	myArray[50] = 'blue';
	console.log(myArray.length); /* Logs 51 (0 is counted) because JS created values 0 to 50 before "blue".*/

</script></body></html>

Copier après la connexion

De plus, étant donné la nature dynamique de JavaScript et le fait que JavaScript n'est pas fortement typé, les valeurs du tableau peuvent être mises à jour à tout moment et les valeurs contenues dans l'index peuvent être n'importe quelle valeur légale. Dans l'exemple ci-dessous, je change la valeur à l'index numérique 50 en un objet.

Exemple : sample137.html

<!DOCTYPE html><html lang="en"><body><script>

	var myArray = [];
	myArray[50] = 'blue';
	myArray[50] = { 'color': 'blue' }; // Change object type from string to Object() object.
	console.log(myArray[50]); // Logs 'Object {color="blue"}'.

	// Using brackets to access the index in the array, then the property blue.
	console.log(myArray[50]['color']); // Logs 'blue'.

	// Using dot notation.
	console.log(myArray[50].color); // Logs 'blue'.

</script></body></html>

Copier après la connexion

Longueur et index

Tableaux valeurs d'index à partir de zéro. Cela signifie que le premier emplacement numérique du tableau qui contient la valeur ressemble à myArray[0]. Cela peut être un peu déroutant si je crée un tableau contenant une seule valeur, l'index de la valeur est 0 et la longueur du tableau est 1. Assurez-vous de comprendre que la longueur d'un tableau représente le nombre de valeurs contenues dans le tableau et que l'indexation numérique des tableaux commence à zéro.

Dans l'exemple suivant, la valeur de chaîne blue 包含在 myArray est à l'indice numérique 0 dans le tableau, mais comme le tableau contient une valeur, la longueur du tableau est 1.

Exemple : sample138.html

<!DOCTYPE html><html lang="en"><body><script>

	var myArray = ['blue'] // The index 0 contains the string value 'blue'.
	console.log(myArray[0]); // Logs 'blue'.
	console.log(myArray.length); // Logs 1.

</script></body></html>

Copier après la connexion

使用预定义的 `length` 定义数组

正如我之前提到的，通过将单个整数参数传递给 Array() 构造函数，可以预定义数组长度或其将包含的值的数量。在这种情况下，构造函数会抛出一个异常，并假设您要设置数组的长度，而不是用值预先填充数组。

在下一个示例中，我们设置了预定义长度为 3 的 myArray 数组。同样，我们配置数组的长度，而不是向其传递要存储在 0 索引处的值。

示例：sample139.html

<!DOCTYPE html><html lang="en"><body><script>

	var myArray = new Array(3);
	console.log(myArray.length); // Logs 3 because we are passing one numeric parameter.
	console.log(myArray[0]); // Logs undefined.

</script></body></html>

Copier après la connexion

提供预定义的 length 将为每个数字索引（最多指定的长度）提供 undefined 的关联值。

您可能想知道是否可以创建一个仅包含一个数值的预定义数组。是的，它是通过使用文字形式 var myArray = [4].

设置数组长度可以添加或删除值

数组对象的 length 属性可用于获取或设置数组的长度。如前所示，设置长度大于数组中包含的实际值数会将 undefined 值添加到数组中。您可能没想到的是，您实际上可以通过将长度值设置为小于数组中包含的值的数量来从数组中删除值。

示例：sample140.html

<!DOCTYPE html><html lang="en"><body><script>

	var myArray = ['blue', 'green', 'orange', 'red'];
	console.log(myArray.length); // Logs 4.
	myArray.length = 99;
	console.log(myArray.length); // Logs 99, remember we set the length, not an index.
	myArray.length = 1; // Removed all but one value, so index [1] is gone!
	console.log(myArray[1]); // Logs undefined.

	console.log(myArray); // Logs '["blue"]'.

</script></body></html>

Copier après la connexion

包含其他数组的数组（又名多维数组）

由于数组可以保存任何有效的 JavaScript 值，因此数组可以包含其他数组。完成此操作后，包含封装数组的数组将被视为多维数组。访问封装的数组是通过括号链接完成的。在下面的示例中，我们创建一个包含一个数组的数组文字，在其中创建另一个数组文字，在其中创建另一个数组文字，其中包含索引 0 处的字符串值。

示例：sample141.html

<!DOCTYPE html><html lang="en"><body><script>

	var myArray = [[[['4th dimension']]]];
	console.log(myArray[0][0][0][0]); // Logs '4th dimension'.

</script></body></html>

Copier après la connexion

这个代码示例相当愚蠢，但您会明白数组可以包含其他数组，并且您可以无限期地访问封装的数组。

前后循环数组

循环数组的最简单且可以说是最快的方法是使用 while 循环。

在下面的代码中，我们从索引的开头循环到结尾。

示例：sample142.html

<!DOCTYPE html><html lang="en"><body><script>

	var myArray = ['blue', 'green', 'orange', 'red'];

	var myArrayLength = myArray.length; // Cache array length to avoid unnecessary lookup.
	var counter = 0; // Set up counter.

	while (counter < myArrayLength) { // Run if counter is less than array length.
		console.log(myArray[counter]); // Logs 'blue', 'green', 'orange', 'red'.
		counter++; // Add 1 to the counter.
	}

</script></body></html>

Copier après la connexion

现在我们从索引末尾循环到开头。

示例：sample143.html

<!DOCTYPE html><html lang="en"><body><script>

	var myArray = ['blue', 'green', 'orange', 'red'];

	var myArrayLength = myArray.length;
	while (myArrayLength--) {                // If length is not zero, loop and subtract 1.
		console.log(myArray[myArrayLength]);  // Logs 'red', 'orange', 'green', 'blue'.
	}

</script></body></html>

Copier après la connexion