Что такое массив JavaScript

Массив JavaScript: массивы используются для хранения группы значений одного типа данных в одной переменной. Массивы могут хранить strings , numbers , objects , functions , и даже другие массивы (многомерные массивы), тем самым делая возможным создавать более сложные структуры данных, такие как массив объектов или массив массивов.

Массивы JavaScript можно использовать, когда есть пул данных одного и того же типа, который имеет общую ссылку. Например: Имя учеников класса. Все ученики принадлежат к одному классу, поэтому мы можем создать массив, предположим Class_5 , и сохранить в нем имена всех учеников класса 5. Это идеальный способ организовать вместе данные одного типа.

Есть два способа создавать массивы в JavaScript:

Используя литерал массива JavaScript.
Используя new ключевое слово.

Мы разберемся с каждым методом на соответствующих примерах, но сначала рассмотрим базовый синтаксис создания массива:

Синтаксис

var myArray = [element0, element1, ..., elementN];
ИЛИ
var myArray = новый массив (element0, element1, ..., elementN);

Литерал массива JavaScript

Литерал массива - это метод создания массива путем определения простого списка значений, разделенных запятыми (,) и заключенных в квадратные скобки ([]). Использование литерала массива - самый простой способ создать массив JavaScript.

Вы можете записать в массив столько значений, сколько необходимо. Каждое значение будет храниться в непрерывной ячейке памяти. Доступ к этим значениям можно получить с помощью порядковых номеров, начинающихся с нуля. К первому значению можно получить доступ по индексу 0, ко второму - по индексу 1 и так далее.

Синтаксис литерала массива

var имя_массива = [элемент1, элемент2, элемент3];

Пример

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title> JavaScript Array </title> 
</head> 
<body> 

<script>  
 var Smartphones=["Samsung","OnePlus","Google"];  
  for (i=0;i<Smartphones.length;i++){  
 document.write(Smartphones[i] + "<br/>");  
  }  
</script>  

</body>
</html>

Выход

JavaScript Array Examples Samsung
OnePlus
Google

Примечание: всегда помните, что индексирование массива начинается с нуля.

Новое ключевое слово в массиве JavaScript

В JavaScript есть конструктор, array() который создает массивы. Чтобы получить доступ к этому конструктору, мы должны сначала создать объект. Итак, new ключевое слово, за которым следует имя конструктора, создает объект, который мы можем использовать для ввода значений массива.

Синтаксис использования нового ключевого слова

var имя_массива = новый массив (элемент1, элемент2, элемент3);

Пример

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title> JavaScript Array New Keyword </title> 
</head> 
<body> 

<script>  
 var i;  
 var Smartphones = new Array();  
 Smartphones[0] = "Samsung";  
 Smartphones[1] = "OnePlus";  
 Smartphones[2] = "Google";  
  
for (i=0;i<Smartphones.length;i++){  
 document.write(Smartphones[i] + "<br>");  
}  
</script>  

</body>
</html>

Выход

JavaScript Array New Keyword Examples Samsung
OnePlus
Google

Совет: избегайте использования new Array (). Вместо этого используйте метод литерала массива.

Добавление новых элементов в массив

Чтобы добавить новый элемент в конец массива, используйте push() метод.

Пример

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title> JavaScript Array Push New Element </title> 
</head> 
<body> 
  <script>
   var Smartphone = ["OnePlus ", " Samsung ", " Google Pixel "]; 
   Smartphone.push("Sony");
     
   document.write(Smartphone + "<br>"); // Prints: OnePlus, Samsung, Google Pixel, Sony
   document.write("String Length : " + Smartphone.length);
  </script>
</body>
</html>

Выход

JavaScript Array Push New Element Examples OnePlus, Samsung, Google Pixel, Sony
Длина строки: 4

Добавление новых элементов с помощью unshift ()

Чтобы добавить новый элемент в начало массива, мы можем использовать unshift() метод.

Пример

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title> JavaScript Array Unshift Element </title> 
</head> 
<body> 
 <script>
  var Smartphone = [" OnePlus ", " Google Pixel ", " Sony "]; 
  Smartphone.unshift("Samsung ");
     
  document.write(Smartphone + "<br>"); // Prints: Samsung,OnePlus,Google Pixel,Sony
  document.write("String Length : " + Smartphone.length); // Prints: 4
 </script>
</body>
</html>

Выход

JavaScript Array Unshift Element Samsung, OnePlus, Google Pixel, Sony
Длина строки: 4

Удаление элементов из массива

Чтобы удалить последний элемент из массива, вы можете использовать pop() метод. Этот метод возвращает значение, которое выскочило.

Пример

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title> JavaScript Array POP Method Remove Element </title> 
</head> 
<body> 
    <script>
    var Smartphone = ["OnePlus", "Samsung", "Google Pixel"];
    var last = Smartphone.pop();
     
    document.write(last + "<br>"); // Prints: Google Pixel
    document.write("String Length : " + Smartphone.length); // Prints: 2
    </script>
</body>
</html>

Выход

JavaScript Array POP Method Remove Element
Длина строки Google Pixel : 2

Удаление элементов с помощью shift ()

Чтобы удалить первый элемент из массива, вы можете использовать shift() метод.

Пример

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title> JavaScript Array Shift Remove Element </title> 
</head> 
<body> 
    <script>
    var Smartphone = ["OnePlus", "Google Pixel", "Samsung"];
    var first = Smartphone.shift();
     
    document.write(first + "<br>"); // Prints: OnePlus
    document.write("String Length : " + Smartphone.length); // Prints: 2
    </script>
</body>
</html>

Выход

JavaScript Array Shift Remove Element
Длина строки OnePlus : 2

Совет: методы push () и pop () работают быстрее, чем shift () и unshift (). Поскольку методы push () и pop () просто добавляют и удаляют элементы в конце массива, поэтому элементы не перемещаются, тогда как shift () и unshift () добавляют и удаляют элементы в начале массива, требующие повторной индексации. всего массива.

Объединение двух или более массивов

concat() Метод используется для объединения двух или более массивов.

Пример

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title> JavaScript Array Concat Method </title> 
</head> 
<body> 
 <script>
  var Smartphones = [" OnePlus ", " Google Pixel ", " Samsung "];
  var Laptops = [" Dell ", " HP ", " Microsoft Surface "];
     
  // Creating new array by combining Smartphones and Laptops arrays
  var Gedgets = Smartphones.concat(Laptops); 
  document.write(Gedgets); // Prints: OnePlus , Google Pixel , Samsung , Dell , HP , Microsoft Surface
</script>
</body>
</html>

Выход

JavaScript Array Concat Method Examples OnePlus, Google Pixel, Samsung, Dell, HP, Microsoft Surface

Совет: метод concat () может принимать любое количество аргументов массива, поэтому вы можете добавлять любое количество массивов.

Поиск по массиву

Если вы хотите найти в массиве определенное значение, вы можете просто использовать indexOf() и lastIndexOf() . Если значение найдено, оба метода возвращают значение индекса, представляющее элемент массива. Если значение не найдено, возвращается -1. В indexOf() метод возвращает первый из найденных, в то время как lastIndexOf() возвращает последний найдено.

Пример

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title> JavaScript Array Search Method </title> 
</head> 
<body> 
 <script>
  var Smartphone = ["Google Pixel", "OnePlus", "Motorola", "Xiaomi", "Asus"];
 
  document.write(Smartphone.indexOf("Google Pixel") + "<br>"); // Prints: 0
  document.write(Smartphone.indexOf("OnePlus") + "<br>"); // Prints: 1
  document.write(Smartphone.indexOf("Apple")); // Prints: -1
</script>
</body>
</html>

Выход

JavaScript Array Search Method Examples 0
1
-1

JavaScript

Что такое массив JavaScript

Литерал массива JavaScript

Выход

Новое ключевое слово в массиве JavaScript

Выход

Добавление новых элементов в массив

Выход

Добавление новых элементов с помощью unshift ()

Выход

Удаление элементов из массива

Выход

Удаление элементов с помощью shift ()

Выход

Объединение двух или более массивов

Выход

Поиск по массиву

Выход

Подпишитесь на нашу email рассылку 👇