logo

Масиви TypeScript

Масив — це однорідна сукупність елементів подібного типу, які мають безперервне розташування в пам’яті.

Масив — це визначений користувачем тип даних.

Масив — це тип структури даних, де ми зберігаємо елементи подібного типу даних. У масиві ми можемо зберігати лише фіксований набір елементів. Ми також можемо використовувати його як об’єкт.

Масив є сховищем на основі індексу, де перший елемент зберігається з індексом 0. Наведена нижче структура допомагає зрозуміти структуру масиву.

Масиви TypeScript

Характеристики масиву

  1. Масив зберігає елементи, які мають однаковий тип даних.
  2. Елементи масиву, що зберігаються в безперервних місцях пам’яті.
  3. Зберігання елементів двовимірного масиву розташовується рядком у безперервному місці пам’яті.
  4. Ім'я масиву представляє адресу початкового елемента.
  5. Розмір масиву має бути ініціалізований під час оголошення.
  6. Розмір масиву має бути постійним виразом, а не змінною.
  7. Ми можемо отримати елементи масиву, вказавши відповідне значення індексу елемента.

Перевага

Оптимізація коду: Масив допомагає оптимізувати код, що підвищує швидкість і продуктивність програми. Це дозволяє нам ефективніше отримувати або сортувати дані масиву.

Довільний доступ: Він забезпечує можливість доступу до будь-яких даних масиву в постійному часі (незалежно від його положення та розміру). Таким чином, ми можемо безпосередньо отримати будь-які дані масиву, розташовані в будь-якій позиції індексу.

Недолік

Обмеження розміру: Масив дозволяє нам зберігати лише фіксовану кількість елементів. Після оголошення масиву ми не можемо змінити його розмір. Отже, якщо ми хочемо вставити більше елемента, ніж заявлено, це неможливо.

Оголошення масиву

Як і JavaScript, TypeScript також підтримує масиви. Є два способи оголосити масив:

1. Використання квадратних дужок.

 let array_name[:datatype] = [val1,val2,valn..] 

приклад:

 let fruits: string[] = ['Apple', 'Orange', 'Banana']; 

2. Використання загального типу масиву.

вирівнювання зображень в css
 let array_name: Array = [val1,val2,valn..] 

приклад:

 let fruits: Array = ['Apple', 'Orange', 'Banana']; 

Типи масиву в TypeScript

Існує два типи масиву:

  1. Одновимірний масив
  2. Багатовимірний масив
Масиви TypeScript

Одновимірний масив

Одновимірний масив - це тип лінійного масиву, який містить лише один рядок для зберігання даних. Він має один набір квадратних дужок ('[]'). Ми можемо отримати доступ до його елементів за допомогою індексу рядка або стовпця.

Синтаксис

 let array_name[:datatype]; 

Ініціалізація

 array_name = [val1,val2,valn..] 

приклад

 let arr:number[]; arr = [1, 2, 3, 4] console.log('Array[0]: ' +arr[0]); console.log('Array[1]: ' +arr[1]); 

Вихід:

 Array[0]: 1 Array[1]: 2 

Багатовимірний масив

Багатовимірний масив - це масив, який містить один або більше масивів. У багатовимірному масиві дані зберігаються в індексі на основі рядків і стовпців (також відомому як матрична форма). Двовимірний масив (2-D масив) є найпростішою формою багатовимірного масиву.

Масиви TypeScript

Синтаксис

 let arr_name:datatype[][] = [ [a1,a2,a3], [b1,b2,b3] ]; 

Ініціалізація

 let arr_name:datatype[initial_array_index][referenced_array_index] = [ [val1,val2,val 3], [v1,v2,v3]]; 

приклад

 var mArray:number[][] = [[1,2,3],[5,6,7]] ; console.log(mArray[0][0]); console.log(mArray[0][1]); console.log(mArray[0][2]); console.log(); console.log(mArray[1][0]); console.log(mArray[1][1]); console.log(mArray[1][2]); 

Вихід:

 1 2 3 5 6 7 

Об'єкт масиву

Об’єкти-масиви дозволяють нам зберігати кілька значень в одній змінній. Ми можемо створити масив за допомогою об’єкта Array. Конструктор масиву використовується для передачі наступних аргументів для створення масиву.

  • Числове значення, яке представляє розмір масиву або
  • Список значень, розділених комами.

Синтаксис

 let arr_name:datatype[] = new Array(values); 

приклад

 //array by using the Array object. let arr:string[] = new Array(&apos;JavaTpoint&apos;,&apos;2200&apos;,&apos;Java&apos;,&apos;Abhishek&apos;); for(var i = 0;i <arr.length;i++) { console.log(arr[i]); } < pre> <p> <strong>Output:</strong> </p> <pre> JavaTpoint 2200 Java Abhishek </pre> <h3>Array Traversal by using a for...in loop</h3> <p> <strong>Example</strong> </p> <pre> let i:any; let arr:string[] = [&apos;JavaTpoint&apos;, &apos;2300&apos;, &apos;Java&apos;, &apos;Abhishek&apos;]; for(i in arr) { console.log(arr[i]) } </pre> <p> <strong>Output:</strong> </p> <pre> JavaTpoint 2300 Java Abhishek </pre> <h3>Passing Arrays to Functions</h3> <p>We can pass arrays to functions by specifying the array name without an index.</p> <p> <strong>Example</strong> </p> <pre> let arr:string[] = new Array(&apos;JavaTpoint&apos;, &apos;2300&apos;, &apos;Java&apos;, &apos;Abhishek&apos;); //Passing arrays in function function display(arr_values:string[]) { for(let i = 0;i <arr_values.length;i++) { console.log(arr[i]); } calling arrays in function display(arr); < pre> <p> <strong>Output:</strong> </p> <pre> JavaTpoint 2300 Java Abhishek </pre> <hr> <h2>TypeScript Spread operator</h2> <p>The spread operator is used to initialize arrays and objects from another array or object. We can also use it for object de-structuring. It is a part of the ES 6 version.</p> <p> <strong>Example</strong> </p> <pre> let arr1 = [ 1, 2, 3]; let arr2 = [ 4, 5, 6]; //Create new array from existing array let copyArray = [...arr1]; console.log(&apos;CopiedArray: &apos; +copyArray); //Create new array from existing array with more elements let newArray = [...arr1, 7, 8]; console.log(&apos;NewArray: &apos; +newArray); //Create array by merging two arrays let mergedArray = [...arr1, ...arr2]; console.log(&apos;MergedArray: &apos; +mergedArray); </pre> <p> <strong>Output:</strong> </p> <pre> CopiedArray: 1,2,3 NewArray: 1,2,3,7,8 MergedArray: 1,2,3,4,5,6 </pre> <hr> <h2>Array Methods</h2> <p>The list of array methods with their description is given below.</p> <table class="table"> <tr> <th>SN</th> <th>Method</th> <th>Description</th> </tr> <tr> <td>1.</td> <td>concat()</td> <td>It is used to joins two arrays and returns the combined result.</td> </tr> <tr> <td>2.</td> <td>copyWithin()</td> <td>It copies a sequence of an element within the array.</td> </tr> <tr> <td>3.</td> <td>every()</td> <td>It returns true if every element in the array satisfies the provided testing function.</td> </tr> <tr> <td>4.</td> <td>fill()</td> <td>It fills an array with a static value from the specified start to end index.</td> </tr> <tr> <td>5.</td> <td>indexOf()</td> <td>It returns the index of the matching element in the array, otherwise -1.</td> </tr> <tr> <td>6.</td> <td>includes()</td> <td>It is used to check whether the array contains a certain element or not.</td> </tr> <tr> <td>7.</td> <td>Join()</td> <td>It is used to joins all elements of an array into a string.</td> </tr> <tr> <td>8.</td> <td>lastIndexOf()</td> <td>It returns the last index of an element in the array.</td> </tr> <tr> <td>9.</td> <td>Pop()</td> <td>It is used to removes the last elements of the array.</td> </tr> <tr> <td>10.</td> <td>Push()</td> <td>It is used to add new elements to the array.</td> </tr> <tr> <td>11.</td> <td>reverse()</td> <td>It is used to reverse the order of an element in the array.</td> </tr> <tr> <td>12.</td> <td>Shift()</td> <td>It is used to removes and returns the first element of an array.</td> </tr> <tr> <td>13.</td> <td>slice()</td> <td>It returns the section fo an array in the new array.</td> </tr> <tr> <td>14.</td> <td>sort()</td> <td>It is used to sort the elements of an array.</td> </tr> <tr> <td>15.</td> <td>splice()</td> <td>It is used to add or remove the elements from an array.</td> </tr> <tr> <td>16.</td> <td>toString()</td> <td>It returns the string representation of an array.</td> </tr> <tr> <td>17.</td> <td>unshift()</td> <td>It is used to add one or more elements to the beginning of an array.</td> </tr> </table></arr_values.length;i++)></pre></arr.length;i++)>

Обхід масиву за допомогою циклу for...in

приклад

 let i:any; let arr:string[] = [&apos;JavaTpoint&apos;, &apos;2300&apos;, &apos;Java&apos;, &apos;Abhishek&apos;]; for(i in arr) { console.log(arr[i]) } 

Вихід:

 JavaTpoint 2300 Java Abhishek 

Передача масивів у функції

Ми можемо передати масиви функціям, вказавши ім’я масиву без індексу.

приклад

кат тимпф вага
 let arr:string[] = new Array(&apos;JavaTpoint&apos;, &apos;2300&apos;, &apos;Java&apos;, &apos;Abhishek&apos;); //Passing arrays in function function display(arr_values:string[]) { for(let i = 0;i <arr_values.length;i++) { console.log(arr[i]); } calling arrays in function display(arr); < pre> <p> <strong>Output:</strong> </p> <pre> JavaTpoint 2300 Java Abhishek </pre> <hr> <h2>TypeScript Spread operator</h2> <p>The spread operator is used to initialize arrays and objects from another array or object. We can also use it for object de-structuring. It is a part of the ES 6 version.</p> <p> <strong>Example</strong> </p> <pre> let arr1 = [ 1, 2, 3]; let arr2 = [ 4, 5, 6]; //Create new array from existing array let copyArray = [...arr1]; console.log(&apos;CopiedArray: &apos; +copyArray); //Create new array from existing array with more elements let newArray = [...arr1, 7, 8]; console.log(&apos;NewArray: &apos; +newArray); //Create array by merging two arrays let mergedArray = [...arr1, ...arr2]; console.log(&apos;MergedArray: &apos; +mergedArray); </pre> <p> <strong>Output:</strong> </p> <pre> CopiedArray: 1,2,3 NewArray: 1,2,3,7,8 MergedArray: 1,2,3,4,5,6 </pre> <hr> <h2>Array Methods</h2> <p>The list of array methods with their description is given below.</p> <table class="table"> <tr> <th>SN</th> <th>Method</th> <th>Description</th> </tr> <tr> <td>1.</td> <td>concat()</td> <td>It is used to joins two arrays and returns the combined result.</td> </tr> <tr> <td>2.</td> <td>copyWithin()</td> <td>It copies a sequence of an element within the array.</td> </tr> <tr> <td>3.</td> <td>every()</td> <td>It returns true if every element in the array satisfies the provided testing function.</td> </tr> <tr> <td>4.</td> <td>fill()</td> <td>It fills an array with a static value from the specified start to end index.</td> </tr> <tr> <td>5.</td> <td>indexOf()</td> <td>It returns the index of the matching element in the array, otherwise -1.</td> </tr> <tr> <td>6.</td> <td>includes()</td> <td>It is used to check whether the array contains a certain element or not.</td> </tr> <tr> <td>7.</td> <td>Join()</td> <td>It is used to joins all elements of an array into a string.</td> </tr> <tr> <td>8.</td> <td>lastIndexOf()</td> <td>It returns the last index of an element in the array.</td> </tr> <tr> <td>9.</td> <td>Pop()</td> <td>It is used to removes the last elements of the array.</td> </tr> <tr> <td>10.</td> <td>Push()</td> <td>It is used to add new elements to the array.</td> </tr> <tr> <td>11.</td> <td>reverse()</td> <td>It is used to reverse the order of an element in the array.</td> </tr> <tr> <td>12.</td> <td>Shift()</td> <td>It is used to removes and returns the first element of an array.</td> </tr> <tr> <td>13.</td> <td>slice()</td> <td>It returns the section fo an array in the new array.</td> </tr> <tr> <td>14.</td> <td>sort()</td> <td>It is used to sort the elements of an array.</td> </tr> <tr> <td>15.</td> <td>splice()</td> <td>It is used to add or remove the elements from an array.</td> </tr> <tr> <td>16.</td> <td>toString()</td> <td>It returns the string representation of an array.</td> </tr> <tr> <td>17.</td> <td>unshift()</td> <td>It is used to add one or more elements to the beginning of an array.</td> </tr> </table></arr_values.length;i++)>

Оператор TypeScript Spread

Оператор поширення використовується для ініціалізації масивів і об’єктів з іншого масиву або об’єкта. Ми також можемо використовувати його для деструктуризації об’єктів. Це частина версії ES 6.

приклад

 let arr1 = [ 1, 2, 3]; let arr2 = [ 4, 5, 6]; //Create new array from existing array let copyArray = [...arr1]; console.log(&apos;CopiedArray: &apos; +copyArray); //Create new array from existing array with more elements let newArray = [...arr1, 7, 8]; console.log(&apos;NewArray: &apos; +newArray); //Create array by merging two arrays let mergedArray = [...arr1, ...arr2]; console.log(&apos;MergedArray: &apos; +mergedArray); 

Вихід:

 CopiedArray: 1,2,3 NewArray: 1,2,3,7,8 MergedArray: 1,2,3,4,5,6 

Методи масиву

Список методів масиву з їх описом наведено нижче.

SN метод опис
1. concat() Він використовується для об’єднання двох масивів і повернення об’єднаного результату.
2. copyWithin() Він копіює послідовність елемента в масиві.
3. кожен() Він повертає істину, якщо кожен елемент у масиві задовольняє надану функцію тестування.
4. fill() Він заповнює масив статичним значенням від указаного початкового до кінцевого індексу.
5. indexOf() Він повертає індекс відповідного елемента в масиві, інакше -1.
6. включає() Він використовується для перевірки того, чи містить масив певний елемент чи ні.
7. Приєднатися() Він використовується для об’єднання всіх елементів масиву в рядок.
8. lastIndexOf() Він повертає останній індекс елемента в масиві.
9. Поп() Використовується для видалення останніх елементів масиву.
10. Push() Використовується для додавання нових елементів до масиву.
одинадцять. зворотний() Він використовується для зміни порядку елементів у масиві.
12. Shift() Він використовується для видалення та повернення першого елемента масиву.
13. шматочок() Він повертає розділ для масиву в новому масиві.
14. sort() Використовується для сортування елементів масиву.
п'ятнадцять. зрощення() Він використовується для додавання або видалення елементів з масиву.
16. toString() Він повертає рядкове представлення масиву.
17. unshift() Використовується для додавання одного або кількох елементів на початок масиву.