Javascript Arrays

11 min read

Агуулга

JavaScript arrays are used to store multiple values in a single variable.

JavaScript багцыг нэг хувьсагч дотор олон утгыг хадгалахад ашигладаг.

Example Жишээ #

var cars = ["Saab", "Volvo", "BMW"];

What is an Array? Багц гэж юу вэ? #

An array is a special variable, which can hold more than one value at a time.

Багц нь тусгай хувьсагч бөгөөд нэг удаад нэгээс илүү утга агуулж чаддаг.

If you have a list of items (a list of car names, for example), storing the cars in single variables could look like this:

Хэрэв танд зүйлсийн жагсаалт байгаа бол (жишээлбэл, автомашины нэрсийн жагсаалт), машиныг ганц хувьсагч дотор хадгалах нь дараах байдалтай байж болох юм.

var car1 = “Saab”;
var car2 = “Volvo”;
var car3 = “BMW”;

However, what if you want to loop through the cars and find a specific one? And what if you had not 3 cars, but 300?

Гэсэн хэдий ч, хэрэв та машинуудыг тойрон гарч, тодорхой нэгийг нь олохыг хүсвэл яах вэ? Хэрэв танд 3 машин биш, 300 машин байсан бол яах уу?

The solution is an array!

Үүний шийдэл нь багц юм!

An array can hold many values under a single name, and you can access the values by referring to an index number.

Багц нь олон утгыг нэг нэрээр агуулах боломжтой бөгөөд та индексийн дугаараас иш татан утгад хандах боломжтой.

Creating an Array #

Багц үүсгэх #

Using an array literal is the easiest way to create a JavaScript Array.

Багцын шууд утгаар ашиглах нь JavaScript массив үүсгэх хамгийн хялбар арга юм.

Syntax:

var array_name = [item1, item2, …];      

Example Жишээ #

var cars = ["Saab", "Volvo", "BMW"];

Spaces and line breaks are not important. A declaration can span multiple lines:

Орон зай, мөр таслах нь чухал биш юм. Тунхаглал нь олон мөрийг хамарч болно:

Example Жишээ #

var cars = [ "Saab", "Volvo", "BMW" ];

Using the JavaScript Keyword new #

JavaScript шинэ түлхүүр үгийг ашиглах #

The following example also creates an Array, and assigns values to it:

Дараах жишээ нь багц үүсгэж, түүнд утга өгнө:

Example Жишээ #

var cars = new Array("Saab", "Volvo", "BMW");

The two examples above do exactly the same. There is no need to use new Array().

Дээрх хоёр жишээг яг адилхан хийдэг. new Array() ашиглах шаардлагагүй.

For simplicity, readability and execution speed, use the first one (the array literal method).

Хялбар байдал, унших чадвар, гүйцэтгэлийн хурдыг хамгийн түрүүнд ашиглана уу (багцын шууд арга).

Access the Elements of an Array #

Багцын элементүүдэд хандах #

You access an array element by referring to the index number.

Индексийн дугаараас иш татан багцын элементэд хандах боломжтой.

This statement accesses the value of the first element in cars:

Энэхүү мэдэгдэл нь cars эхний элементийн утгыг олж авна.

var name = cars[0];

Example Жишээ #

var cars = ["Saab", "Volvo", "BMW"]; document.getElementById("demo").innerHTML = cars[0];

Note: Array indexes start with 0.

Тэмдэглэл: Багцын индексүүд 0-ээс эхэлнэ.

[0] is the first element. [1] is the second element.

[0] бол эхний элемент юм. [1] бол хоёр дахь элемент юм.

Changing an Array Element #

Багцын элементийг өөрчлөх #

This statement changes the value of the first element in cars:

Энэхүү мэдэгдэл нь cars эхний элементийн утгыг өөрчилдөг.

cars[0] = "Opel";

Example Жишээ #

var cars = ["Saab", "Volvo", "BMW"]; cars[0] = "Opel"; document.getElementById("demo").innerHTML = cars[0];

Access the Full Array #

Бүрэн багцад нэвтрэх #

With JavaScript, the full array can be accessed by referring to the array name:

JavaScript-ээр багцын нэрийг дурьдахад багцыг бүрэн ашиглаж болно.

Example Жишээ #

var cars = ["Saab", "Volvo", "BMW"]; document.getElementById("demo").innerHTML = cars;

Arrays are Objects #

Багцууд нь объектууд юм #

Arrays are a special type of objects. The typeof operator in JavaScript returns “object” for arrays.

Багц нь объектын онцгой төрөл юм. JavaScript дээрх typeof оператор нь багцын “объект” -ыг буцаадаг.

But, JavaScript arrays are best described as arrays.

Гэхдээ JavaScript багц гэж хамгийн сайн тодорхойлсон байдаг.

Arrays use numbers to access its “elements”. In this example, person[0] returns John:

Багц нь түүний “элементүүд” -д нэвтрэхийн тулд тоонуудыг ашигладаг. Энэ жишээнд [0] хүн Жоныг буцаана:

Array: #

Багц: #

var person = ["John", "Doe", 46];

Objects use names to access its “members”. In this example, person.firstName returns John:

Объектууд нь “гишүүдэд” хандахын тулд нэрийг ашигладаг. Энэ жишээнд person.firstName Жоныг буцаана:

Object: #

var person = {firstName:"John", lastName:"Doe", age:46};

Array Elements Can Be Objects #

Багцын элементүүд нь объект байж болно #

JavaScript variables can be objects. Arrays are special kinds of objects.

JavaScript хувьсагч нь объект байж болно. Багц нь тусгай төрлийн объект юм.

Because of this, you can have variables of different types in the same Array.

Үүнээс болоод та ижил багцад өөр өөр төрлийн хувьсагчтай байж болно.

You can have objects in an Array. You can have functions in an Array. You can have arrays in an Array:

Та багц дотор объекттой байж болно. Та багцд функцтэй байж болно. Та багцдотроо багцтай байж болно:

myArray[0] = Date.now;
myArray[1] = myFunction;
myArray[2] = myCars;

Array Properties and Methods #

Багцын шинж чанар ба арга #

The real strength of JavaScript arrays are the built-in array properties and methods:

JavaScript багцын жинхэнэ хүч нь угсарсан багцын шинж чанар ба аргууд юм.

Examples #

Жишээнүүд #

var x = cars.length; // The length property returns the number of elements var y = cars.sort(); // The sort() method sorts arrays

Array methods are covered in the next chapters.

багцын аргуудыг дараагийн бүлгүүдэд авч үзнэ.

The length Property #

Урт өмч #

The length property of an array returns the length of an array (the number of array elements).

Багцын length шинж чанар нь багцын уртыг (багцын элементийн тоог) буцаадаг.

Example Жишээ #

var fruits = ["Banana", "Orange", "Apple", "Mango"]; fruits.length; // the length of fruits is 4

The length property is always one more than the highest array index.

Length шинж чанар нь багцын хамгийн өндөр индексээс үргэлж нэгээр илүү байдаг.

Accessing the First Array Element #

Эхний багцын элементэд нэвтрэх #

Example Жишээ #

fruits = ["Banana", "Orange", "Apple", "Mango"]; var first = fruits[0];

Accessing the Last Array Element #

Сүүлийн багцын элементэд нэвтрэх #

Example Жишээ #

fruits = ["Banana", "Orange", "Apple", "Mango"]; var last = fruits[fruits.length - 1];

Looping Array Elements #

Багцын элементүүдийг давтах #

The safest way to loop through an array, is using a for loop:

Массиваар дамжин өнгөрөх хамгийн найдвартай арга бол for циклийг ашиглах явдал юм.

Example Жишээ #

var fruits, text, fLen, i; fruits = ["Banana", "Orange", "Apple", "Mango"]; fLen = fruits.length; text = "<ul>"; for (i = 0; i < fLen; i++) { text += "<li>" + fruits[i] + "</li>"; } text += "</ul>";

You can also use the Array.forEach() function:

ТаArray.forEach() функцийг ашиглаж болно:

Example Жишээ #

var fruits, text; fruits = ["Banana", "Orange", "Apple", "Mango"]; text = "<ul>"; fruits.forEach(myFunction); text += "</ul>"; function myFunction(value) { text += "<li>" + value + "</li>"; }

Adding Array Elements #

Багцын элементүүдийг нэмэх #

The easiest way to add a new element to an array is using the push() method:

Багцад шинэ элемент нэмэх хамгийн хялбар арга бол push() аргыг ашиглах явдал юм.

Example Жишээ #

var fruits = ["Banana", "Orange", "Apple", "Mango"]; fruits.push("Lemon"); // adds a new element (Lemon) to fruits

New element can also be added to an array using the length property:

length элементийг ашиглан багц дээр шинэ элемент нэмж болно:

Example Жишээ #

var fruits = ["Banana", "Orange", "Apple", "Mango"]; fruits[fruits.length] = "Lemon"; // adds a new element (Lemon) to fruits

WARNING ! 

Анхааруулга!

Adding elements with high indexes can create undefined “holes” in an array:

Өндөр индекс бүхий элементүүдийг нэмснээр багц дотор тодорхойгүй “нүх” үүсгэж болно.

Example Жишээ #

var fruits = ["Banana", "Orange", "Apple", "Mango"]; fruits[6] = "Lemon"; // adds a new element (Lemon) to fruits

Associative Arrays #

Many programming languages support arrays with named indexes.

Олон програмчлалын хэл нь нэртэй индекс бүхий багцыг дэмждэг.

Arrays with named indexes are called associative arrays (or hashes).

Нэрлэсэн индекстэй багцыг ассоциатив багц (эсвэл хэш) гэж нэрлэдэг.

JavaScript does not support arrays with named indexes.

JavaScript нь нэртэй индекс бүхий багцыг дэмждэггүй.

In JavaScript, arrays always use numbered indexes. 

JavaScript дээр массивууд үргэлж дугаарлагдсан индексүүдийг ашигладаг.

Example Жишээ #

var person = []; person[0] = "John"; person[1] = "Doe"; person[2] = 46; var x = person.length; // person.length will return 3 var y = person[0]; // person[0] will return "John"

WARNING !!

Анхааруулга!!

If you use named indexes, JavaScript will redefine the array to a standard object.

Хэрэв та нэртэй индексүүдийг ашигладаг бол JavaScript нь багцыг стандарт объект болгон дахин тодорхойлох болно.

After that, some array methods and properties will produce incorrect results.

Үүний дараа массивын зарим арга, шинж чанарууд буруу үр дүн гаргах болно.

Example: #

Жишээ: #

var person = []; person["firstName"] = "John"; person["lastName"] = "Doe"; person["age"] = 46; var x = person.length; // person.length will return 0 var y = person[0]; // person[0] will return undefined

The Difference Between Arrays and Objects #

Багц ба объектын ялгаа #

In JavaScript, arrays use numbered indexes.  

JavaScript дээр багцуудыг дугаарлагдсан индексүүдийг ашигладаг.

In JavaScript, objects use named indexes.

JavaScript дээр объектууд нэрлэсэн индексүүдийг ашигладаг.

Arrays are a special kind of objects, with numbered indexes.

Багц нь дугаарлагдсан индекс бүхий объектын онцгой төрөл юм.

When to Use Arrays. When to use Objects. #

Багцыг хэзээ ашиглах вэ. Объектуудыг хэзээ ашиглах вэ.

  • JavaScript does not support associative arrays.

    JavaScript нь ассоциатив багцыг дэмждэггүй.

  • You should use objects when you want the element names to be strings (text).

    Элементийн нэрийг үг (текст) болгохыг хүссэн үедээ объект ашиглах хэрэгтэй.

  • You should use arrays when you want the element names to be numbers.

    Элементийн нэрийг тоо болгохыг хүсч байхдаа багцыг ашиглах хэрэгтэй.

Avoid new Array() #

There is no need to use the JavaScript’s built-in array constructor new Array().

JavaScript-ийн new Array() байгуулагчийг ашиглах шаардлагагүй болно.

Use [] instead.

These two different statements both create a new empty array named points:

Эдгээр хоёр өөр мэдэгдэл хоёулаа цэгүүд нэртэй шинэ хоосон багц үүсгэдэг.

var points = new Array(); // Bad var points = []; // Good

These two different statements both create a new array containing 6 numbers:

Эдгээр хоёр өөр мэдэгдэл хоёулаа 6 тоог агуулсан шинэ багц үүсгэдэг:

var points = new Array(40, 100, 1, 5, 25, 10); // Bad var points = [40, 100, 1, 5, 25, 10]; // Good

The new keyword only complicates the code. It can also produce some unexpected results:

new түлхүүр үг нь зөвхөн кодыг улам хүндрүүлдэг. Энэ нь зарим гэнэтийн үр дүнг бий болгож болзошгүй юм.

var points = new Array(40, 100); // Creates an array with two elements (40 and 100)

What if I remove one of the elements?

Хэрэв би аль нэг элементийг хасвал яах вэ?

var points = new Array(40); // Creates an array with 40 undefined elements !!!!!

How to Recognize an Array #

Багцыг хэрхэн таних вэ #

A common question is: How do I know if a variable is an array?

Нийтлэг асуулт бол хувьсагч нь багц мөн эсэхийг би яаж мэдэх вэ?

The problem is that the JavaScript operator typeof returns “object“:

Асуудал нь JavaScript оператор typeof нь “object” -ийг буцааж өгөх явдал юм.

var fruits = ["Banana", "Orange", "Apple", "Mango"]; typeof fruits; // returns object

The typeof operator returns object because a JavaScript array is an object.

JavaScript багц нь объект тул typeof оператор объект буцаадаг.

Solution 1: #

Шийдэл 1: #

To solve this problem ECMAScript 5 defines a new method Array.isArray():

Энэ асуудлыг шийдэхийн тулд ECMAScript 5 ньArray.isArray() гэсэн шинэ аргыг тодорхойлдог.

Array.isArray(fruits); // returns true

The problem with this solution is that ECMAScript 5 is not supported in older browsers.

Энэхүү шийдлийн асуудал нь хуучин хөтөч дээр ECMAScript 5-ийг дэмждэггүй явдал юм.

Solution 2: #

Шийдэл 2: #

To solve this problem you can create your own isArray() function:

Энэ асуудлыг шийдэхийн тулд та өөрийнisArray() функцийг үүсгэж болно:

function isArray(x) { return x.constructor.toString().indexOf("Array") > -1; }

The function above always returns true if the argument is an array.

Хэрэв аргумент нь багц бол дээрх функц нь үргэлж үнэнийг буцаадаг.

Or more precisely: it returns true if the object prototype contains the word “Array”.

Эсвэл илүү нарийвчлалтайгаар: объектын загвар нь “Array” гэсэн үг агуулсан байвал үнэн болно.

Solution 3: #

Шийдэл 3: #

The instanceof operator returns true if an object is created by a given constructor:

Хэрэв тухайн байгууламжийг тухайн байгуулагч бүтээсэн бол instanceof оператор нь үнэнийг буцаана.

var fruits = ["Banana", "Orange", "Apple", "Mango"]; fruits instanceof Array; // returns true
What are your Feelings

Powered by BetterDocs

Leave a Reply