تستخدم صفائف جافا سكريبت لتخزين قيم متعددة في متغير واحد.
عرض صفائف
في هذا البرنامج التعليمي سوف نستخدم البرنامج النصي لعرض صفائف داخل <p> عنصر مع id="demo" :
مثال
<p id="demo"></p>
<script>
var cars = ["Saab", "Volvo", "BMW"];
document.getElementById("demo").innerHTML = cars;
</script>
السطر الأول (في النص) بإنشاء مجموعة يدعى السيارات.
السطر الثاني "يجد" عنصر مع id="demo" ، و "displays" مجموعة في "innerHTML" منه؛
انها محاولة لنفسك
إنشاء مجموعة، وتعيين قيم على أنه:
المسافات وفواصل السطور ليست مهمة. إعلان يمكن أن تمتد لعدة أسطر:
لم يضع فاصلة بعد العنصر الأخير (مثل "BMW" ،).
لا يتسق تأثير عبر المتصفحات.
ما هو صفيف؟
المصفوفة هي متغير خاص، والتي يمكن أن تعقد أكثر من قيمة واحدة في وقت واحد.
إذا كان لديك قائمة من العناصر (قائمة بأسماء السيارات، على سبيل المثال)، وتخزين السيارات في المتغيرات واحدة يمكن أن تبدو مثل هذا:
var car1 = "Saab";
var car2 = "Volvo";
var car3 = "BMW";
ومع ذلك، ما إذا كنت ترغب في حلقة من خلال السيارات والعثور على وظيفة معينة؟ وماذا لو كان لديك لا 3 سيارات، ولكن 300؟
الحل هو صفيف!
مجموعة يمكن أن تعقد العديد من القيم تحت اسم واحد، ويمكنك الوصول إلى القيم من خلال الإشارة إلى رقم فهرس.
إنشاء صفيف
باستخدام مجموعة الحرفي هو أسهل طريقة لإنشاء صفيف جافا سكريبت.
بناء الجملة:
var array-name = [ item1 , item2 , ...];
مثال:
var cars = ["Saab", "Volvo", "BMW"];
باستخدام الجديدة جافا سكريبت كلمة
المثال التالي أيضا بإنشاء صفيف، ويعين القيم إلى ما يلي:
المثالين أعلاه تفعل بالضبط نفس الشيء. ليست هناك حاجة لاستخدام new Array() .
لالبساطة، والقراءة وسرعة التنفيذ، استخدم واحد الأول (مجموعة الأسلوب الحرفي).
الوصول إلى عناصر من صفيف
عليك الرجوع إلى عنصر صفيف بالإشارة إلىرقم الفهرس.
هذا البيان يصل قيمة العنصر الأول في السيارات:
var
name = cars[0];
هذا البيان بتعديل العنصر الأول في السيارات:
cars[0] = "Opel";
[0] هو العنصر الأول في صفيف. [1] هي ثاني. أدلة المصفوفة تبدأ 0.
هل يمكن أن يكون كائنات مختلفة في صفيف واحد
يمكن المتغيرات جافا سكريبت تكون الكائنات. المصفوفات هي أنواع خاصة من الكائنات.
وبسبب هذا، هل يمكن أن يكون المتغيرات من أنواع مختلفة في نفس صفيف.
هل يمكن أن يكون الكائنات في صفيف. هل يمكن أن يكون وظائف في صفيف. هل يمكن أن يكون صفائف في صفيف:
myArray[0] = Date.now;
myArray[1] = myFunction;
myArray[2] = myCars;
المصفوفات هي كائنات
المصفوفات هي نوع خاص من الأشياء. و typeof المشغل في جافا سكريبت يعود "object" للصفائف.
ولكن، وأفضل وصف صفائف جافا سكريبت كما المصفوفات.
صفائف استخدام numbers للوصول بها "elements" . في هذا المثال، person[0] يعود John :
كائنات استخدام أسماء للوصول لها "أعضاء". في هذا المثال، person.firstName يعود John :
خصائص مجموعة وطرق
القوة الحقيقية للصفائف جافا سكريبت هي مدمجة في خصائص مجموعة والطرق:
أمثلة
var x = cars.length;
// The length property returns the number of elements in cars
var y = cars.sort();
// The sort() method sort cars in alphabetical order
وتغطي وسائل مصفوفة في الفصل القادم.
طول الملكية
على length ممتلكات مجموعة ترجع طول مجموعة (عدد عناصر مجموعة).
مثال
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.length; // the length of fruits is 4
انها محاولة لنفسك » الخاصية طول هي دائما واحدة أكثر من أعلى مؤشر مجموعة.
إضافة عناصر صفيف
أسهل طريقة لإضافة عنصر جديد إلى مجموعة يستخدم طريقة الدفع:
مثال
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Lemon"); // adds a new element (Lemon) to fruits
انها محاولة لنفسك » يمكن أيضا إضافة عنصر جديد إلى مجموعة باستخدام length الملكية:
مثال
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[fruits.length] = "Lemon"; // adds a new element (Lemon) to fruits
انها محاولة لنفسك » تحذير !
إضافة عناصر مع مؤشرات عالية يمكن أن تخلق غير محددة "holes" في صفيف:
مثال
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[10] = "Lemon"; // adds a new element (Lemon) to fruits
انها محاولة لنفسك » حلقات عناصر صفيف
أفضل طريقة لحلقة من خلال مجموعة، يستخدم "for" حلقة:
مثال
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>";
}
انها محاولة لنفسك » صفائف النقابي
العديد من لغات البرمجة تدعم المصفوفات مع الفهارس اسمه.
وتسمى المصفوفات مع الفهارس اسمه المصفوفات الترابطية (أو التجزئة).
جافا سكريبت لا يدعم المصفوفات مع الفهارس اسمه.
في جافا سكريبت، صفائف دائما استخدام مؤشرات مرقمة.
مثال
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"
انها محاولة لنفسك » تحذير !!
إذا كنت تستخدم مؤشر اسمه، وجافا سكريبت إعادة تعريف مجموعة إلى كائن القياسية.
بعد ذلك، فإن جميع الطرق مجموعة وخصائص تعطي نتائج غير صحيحة.
مثال:
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
انها محاولة لنفسك » الفرق بين المصفوفات والأجسام
في جافا سكريبت، صفائف استخدام مؤشرات مرقمة.
في جافا سكريبت، واستخدام الكائنات المسماة الفهارس.
المصفوفات هي نوع خاص من الأشياء، مع فهارس المرقمة.
عند استخدام المصفوفات. متى تستخدم كائنات.
- جافا سكريبت لا يدعم صفائف النقابي.
- يجب عليك استخدام الكائنات عندما تريد أسماء العناصر لتكون السلاسل (نص).
- يجب عليك استخدام المصفوفات عندما تريد أسماء العناصر أن تكون الأرقام.
تجنب new Array()
ليست هناك حاجة لاستخدام المدمج في مجموعة منشئ جافا سكريبت new Array() .
استخدام [] بدلا من ذلك.
هذه بيانين مختلفة على حد سواء إنشاء مجموعة فارغة جديدة باسم نقاط:
var points = new Array();
// Bad
var points = [];
// Good
هذه بيانين مختلفة على حد سواء تخلق مجموعة جديدة تحتوي على 6 أرقام:
var points = new Array(40, 100, 1, 5, 25, 10) // Bad
var points = [40, 100, 1, 5, 25, 10];
// Good
انها محاولة لنفسك » في new الكلمة يعقد فقط رمز. كما يمكن أن تنتج بعض نتائج غير متوقعة:
var points = new Array(40, 100); // Creates an array with two elements (40 and 100)
ماذا لو كان يمكنني إزالة أحد العناصر؟
var points = new Array(40); // Creates an array with 40 undefined elements !!!!!
انها محاولة لنفسك » كيفية التعرف على صفيف
سؤال شيوعا هو: كيف أعرف إذا كان المتغير هو مصفوفة؟
والمشكلة هي أن المشغل جافا سكريبت typeof بإرجاع "وجوه":
var fruits = ["Banana", "Orange", "Apple", "Mango"];
typeof fruits; // returns object
انها محاولة لنفسك » كائن عوائد مشغل تشير typeof لمجموعة جافا سكريبت هو كائن.
الحل 1:
لحل هذه المشكلة ECMAScript 5 يحدد طريقة جديدة Array.isArray() :
Array.isArray(fruits); // returns true
انها محاولة لنفسك » المشكلة مع هذا الحل هو أن ECMAScript 5 غير معتمد في المتصفحات القديمة.
الحل 2:
لحل هذه المشكلة، يمكنك إنشاء الخاصة بك isArray() وظيفة:
function isArray(x) {
return
x.constructor.toString().indexOf("Array") > -1;
}
انها محاولة لنفسك » وظيفة فوق دائما ترجع الحقيقية إذا كانت الوسيطة عبارة عن صفيف.
أو بتعبير أدق: فإنها ترجع صحيح إذا كان النموذج كائن يحتوي على كلمة "صفيف".
حل 3:
و instanceof يعود تشغيل صحيح إذا تم إنشاء كائن منشئ معينة:
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits instanceof Array // returns true
انها محاولة لنفسك » اختبر نفسك مع تمارين!
التمرين 1 » التمرين 2» التمرين 3 » التمرين 4» التمرين 5 »