٪۴۰ تخفیف تابستانه شروع شد! بزرگترین حراج سال ما

به ما بپیوندید

آموزش آرایه های جاوا اسکریپت

آرایه های JavaScript برای ذخیره مقادیر متعدد در یک متغیر استفاده می شود. مثال const cars = ["Saab", "Volvo", "BMW"]; آرایه چیست؟ آرایه یک متغیر خاص است که می تواند بیش از یک مقدار را در یک زمان نگه دارد.…

محمد یوسفی

18 جولای 2021

آرایه های JavaScript برای ذخیره مقادیر متعدد در یک متغیر استفاده می شود.

مثال

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

آرایه چیست؟

آرایه یک متغیر خاص است که می تواند بیش از یک مقدار را در یک زمان نگه دارد.

اگر لیستی از موارد دارید (به عنوان مثال لیستی از نام اتومبیل ها) ، ذخیره سازی اتومبیل ها در متغیرهای منفرد می تواند به این صورت باشد:

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

با این حال ، اگر بخواهید در اتومبیل ها بگردید و یک ماشین خاص پیدا کنید ، چه می کنید؟ و اگر شما 3 اتومبیل نداشته باشید ، اما 300 اتومبیل داشته باشید؟

راه حل یک آرایه است!

یک آرایه می تواند مقادیر زیادی را تحت یک نام واحد نگه دارد و با مراجعه به یک شماره شاخص می توانید به مقادیر دسترسی پیدا کنید.


ایجاد یک آرایه

استفاده از آرایه به معنای واقعی ساده ترین راه برای ایجاد آرایه جاوا اسکریپت است.

نحو

:const array_name = [item1item2, …];

مثال

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

فاصله و خط شکاف مهم نیست. یک اعلامیه می تواند چندین خط را در بر بگیرد:

مثال

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

همچنین می توانید یک آرایه ایجاد کنید و سپس عناصر را ارائه دهید:

مثال

const cars = [];
cars[0]= "Saab";
cars[1]= "Volvo";
cars[2]= "BMW";

با استفاده از کلید واژه جاوا اسکریپت جدید

مثال زیر نیز یک Array ایجاد می کند و مقادیری را به آن اختصاص می دهد:

مثال

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

دو مثال فوق دقیقاً همان کار را انجام می دهند.

نیازی به استفاده نیست new Array().
برای سادگی ، خوانایی و سرعت اجرا ، از روش اول (روش آرایه ای) استفاده کنید.



دسترسی به عناصر آرایه

با مراجعه به شماره فهرست به یک عنصر آرایه دسترسی پیدا می کنید :

const cars = ["Saab", "Volvo", "BMW"];
let x = cars[0];    // x = "Saab"

توجه: شاخص های آرایه با 0 شروع می شوند.

[0] اولین عنصر است. [1] عنصر دوم است.


تغییر یک عنصر آرایه

این عبارت مقدار اولین عنصر را تغییر می دهد در cars:

cars[0] = "Opel";

مثال

const cars = ["Saab", "Volvo", "BMW"];
cars[0] = "Opel";

به آرایه کامل دسترسی پیدا کنید

با جاوا اسکریپت ، با مراجعه به نام آرایه می توان به آرایه کامل دسترسی داشت:

مثال

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

آرایه ها اشیا هستند

آرایه ها نوع خاصی از اشیا هستند. typeofاپراتور در جاوا اسکریپت “شی” برای آرایه را برمی گرداند.

اما ، آرایه های جاوا اسکریپت بهتر است به عنوان آرایه توصیف شوند.

آرایه ها برای دسترسی به “عناصر” خود از اعداد استفاده می کنند. در این مثال ، person[0] John را برمی گرداند:

آرایه:

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

اشیا برای دسترسی به “اعضا” از نام استفاده می کنند. در این مثال ، person.firstName John را برمی گرداند:

هدف – شی:

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

عناصر آرایه می توانند اشیا باشند

متغیرهای جاوا اسکریپت می توانند شی باشند. آرایه ها انواع خاصی از اشیا هستند.

به همین دلیل ، می توانید متغیرهایی از انواع مختلف را در همان آرایه داشته باشید.

می توانید در یک آرایه اشیا داشته باشید. می توانید در یک آرایه توابع داشته باشید. می توانید در یک آرایه آرایه داشته باشید:

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

خواص و روشهای آرایه

قدرت واقعی آرایه های جاوا اسکریپت ویژگی ها و روش های آرایه داخلی است:

cars.length   // Returns the number of elements
cars.sort()   // Sorts the array

روش های آرایه در فصل های بعدی آورده شده است.


طول املاک

lengthاموال از یک آرایه به طول یک آرایه (تعداد عناصر آرایه) را برمی گرداند.

مثال

const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.length;   // Returns 4

این lengthویژگی همیشه یکی بیشتر از بالاترین شاخص آرایه است.


دسترسی به عنصر آرایه اول

مثال

const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[0];    // Returns "Banana"

دسترسی به آخرین عنصر آرایه

مثال

const fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[fruits.length - 1];  // Returns "Mango"

حلقه حلقه عناصر

امن ترین راه برای حلقه آرایه استفاده از forحلقه است:

مثال

const fruits = ["Banana", "Orange", "Apple", "Mango"];
let fLen = fruits.length;

text = "<ul>";
for (let i = 0; i < fLen; i++) {
  text += "<li>" + fruits[i] + "</li>";
}
text += "</ul>";

همچنین می توانید از این Array.forEach()تابع استفاده کنید :

مثال

const fruits = ["Banana", "Orange", "Apple", "Mango"];

let text = "<ul>";
fruits.forEach(myFunction);
text += "</ul>";

function myFunction(value) {
  text += "<li>" + value + "</li>";
}

افزودن عناصر آرایه

ساده ترین راه برای افزودن یک عنصر جدید به یک آرایه استفاده از push()روش زیر است:

مثال

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

با استفاده از lengthویژگی می توان عنصر جدیدی را به آرایه اضافه کرد :

مثال

const fruits = ["Banana", "Orange", "Apple"];
fruits[fruits.length] = "Lemon";  // Adds "Lemon" to fruits

هشدار!

افزودن عناصر با شاخص های بالا می تواند “سوراخ” های تعریف نشده ای در یک آرایه ایجاد کند:

مثال

const fruits = ["Banana", "Orange", "Apple"];
fruits[6] = "Lemon";  // Creates undefined "holes" in fruits

آرایه های انجمنی

بسیاری از زبان های برنامه نویسی از آرایه هایی با فهرست های مشخص شده پشتیبانی می کنند.

به آرایه هایی با اندیس های مشخص شده آرایه های انجمنی (یا هش) گفته می شود.

جاوا اسکریپت از آرایه هایی با فهرست های مشخص شده پشتیبانی نمی کند .

در جاوا اسکریپت ، آرایه ها همیشه از نمایه های شماره گذاری شده استفاده می کنند .

مثال

const person = [];
person[0] = "John";
person[1] = "Doe";
person[2] = 46;
person.length;    // Will return 3
person[0];        // Will return "John"

هشدار !!
اگر از نمایه های نامگذاری شده استفاده کنید ، جاوا اسکریپت آرایه را برای یک شی دوباره تعریف می کند.

پس از آن ، برخی از روش ها و خصوصیات آرایه نتایج نادرستی را ایجاد می کنند .

 مثال:

const person = [];
person["firstName"] = "John";
person["lastName"] = "Doe";
person["age"] = 46;
person.length;     // Will return 0
person[0];         // Will return undefined


تفاوت بین آرایه ها و اشیا

در جاوا اسکریپت ، آرایه ها از نمایه های شماره گذاری شده استفاده می کنند .

در جاوا اسکریپت ، اشیا از نمایه های نامگذاری شده استفاده می کنند .

آرایه ها نوع خاصی از اشیا هستند ، با شاخص های شماره گذاری شده.


چه زمانی از آرایه ها استفاده کنید. زمان استفاده از اشیا.

  • JavaScript از آرایه های انجمنی پشتیبانی نمی کند.
  • وقتی می خواهید نام عناصر به صورت رشته ای باشد ، باید از اشیا objects استفاده کنید .
  • وقتی می خواهید نام عناصر اعداد باشند باید از آرایه ها استفاده کنید .

از آرایه جدید اجتناب کنید ()

دیگر نیازی به استفاده از سازنده newآرایه داخلی جاوا اسکریپت Array () نیست.

[]بجای آن استفاده کنید.

این دو عبارت متفاوت ، هر دو آرایه خالی جدیدی به نام نقاط ایجاد می کنند:

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

این دو عبارت مختلف ، هر دو آرایه جدیدی را شامل 6 عدد می كنند:

const points = new Array(40, 100, 1, 5, 25, 10);
const points = [40, 100, 1, 5, 25, 10];

newکلمه کلیدی تنها پیچیده کد. همچنین می تواند نتایج غیر منتظره ای ایجاد کند:

// This creates an array with two elements (40 and 100):
const points = new Array(40, 100);

اگر یکی از عناصر را حذف کنم چطور؟

// This creates an array with 40 undefined elements !!
const points = new Array(40);

چگونه یک آرایه را تشخیص دهیم

یک سوال متداول این است: از کجا می توان فهمید که یک متغیر آرایه است؟

مشکل این است که عملگر JavaScript typeof“” را برمی گرداند object:

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

عملگر typeof شی object را برمی گرداند زیرا یک آرایه JavaScript یک شی است.

راه حل 1:

برای حل این مشکل ECMAScript 5 روش جدیدی را تعریف می کند Array.isArray():

Array.isArray(fruits);   // returns true

راه حل 2:

instanceofاپراتور درست میشود اگر یک جسم توسط یک سازنده داده ایجاد شده:

const fruits = ["Banana", "Orange", "Apple"];

fruits instanceof Array;   // returns true

منبع

 

مطالب مرتبط

0 0 رای ها
امتیازدهی به مقاله
اشتراک در
اطلاع از
guest
0 نظرات
بازخورد (Feedback) های اینلاین
مشاهده همه دیدگاه ها