المصفوفات في جافاسكريبت JavaScript Arrays
JavaScript Arrays
هي هياكل بيانات تسمح لك بتخزين مجموعة من القيم في متغير واحد. يمكن أن تحتوي مصفوفة JavaScript على أي نوع من البيانات، بما في ذلك الأرقام والسلاسل والكائنات وحتى مصفوفات أخرى. تعتبر مصفوفات من الأدوات الأساسية في برمجة JavaScript وتستخدم بشكل واسع في كتابة تطبيقات الويب.
يمكنك إنشاء مصفوفة في JavaScript باستخدام القوسين المربعين ([]) وتحديد القيم داخلها بفواصل. على سبيل المثال، يمكنك إنشاء مصفوفة تحتوي على أرقام مثل هذا:
var numbers = [1, 2, 3, 4, 5];
ويمكنك الوصول إلى العناصر داخل المصفوفة باستخدام الفهرس (index) الخاص بها. على سبيل المثال، للوصول إلى العنصر الثالث في المصفوفة السابقة، يمكنك استخدام الفهرس 2 (يبدأ العد من الصفر):
var thirdNumber = numbers[2]; // سيكون قيمة thirdNumber مساوية للرقم 3
بالإضافة إلى ذلك، يوفر JavaScript العديد من الطرق لتعديل وتعامل مع المصفوفات، مثل إضافة وحذف العناصر وتغيير قيمها وترتيبها، والعديد من الدوال المدمجة للقيام بعمليات مختلفة على المصفوفات.
تطبيق شامل في صفحة ويب مع الشرح
هاكم مثالًا على تطبيق ويب بسيط يستخدم JavaScript لإنشاء قائمة مهام (To-Do List). سيكون هذا التطبيق يتيح للمستخدمين إضافة مهام جديدة، وتحديد مهام كمكتملة، وحذف المهام.
صفحة HTML:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>ToDo List</title> <link rel="stylesheet" href="styles.css"> </head> <body> <div class="container"> <h1>ToDo List</h1> <input type="text" id="taskInput" placeholder="Add New Task"> <button onclick="addTask()">Add Task</button> <ul id="taskList"></ul> </div> <script src="script.js"></script> </body> </html> renderTasks();
CSS (styles.css):
.container
{ max-width: 400px;
margin: 0 auto;
padding: 20px;
text-align: center; }
ul { list-style-type: none;
padding: 0; }
li { margin: 10px 0; cursor: pointer; }
.completed { text-decoration: line-through;
color: grey; }
JavaScript (script.js):
let tasks = [];
function renderTasks() {
const taskList = document.getElementById('taskList');
taskList.innerHTML = '';
tasks.forEach((task, index) => {
const listItem = document.createElement('li');
listItem.textContent = task;
if (task.isCompleted) {
listItem.classList.add('completed');
}
listItem.onclick = () => {
toggleTask(index);
renderTasks();
};
taskList.appendChild(listItem);
});
}
function addTask() {
const taskInput = document.getElementById('taskInput');
const taskText = taskInput.value.trim();
if (taskText !== '') {
tasks.push({ text: taskText, isCompleted: false });
taskInput.value = '';
renderTasks();
}
}
function toggleTask(index) {
tasks[index].isCompleted = !tasks[index].isCompleted;
}
renderTasks();
الشرح:
HTML الأساسي: يحتوي على حقل إدخال لإضافة مهمة جديدة وزر لإضافتها، وقائمة (ul) لعرض المهام.
CSS: تحسينات بسيطة للتصميم لجعل التطبيق يبدو أفضل.
JavaScript: يقوم بإدارة العمليات المختلفة في التطبيق، بما في ذلك إضافة المهام، وتحديد مهمة كمكتملة، وتحديث عرض القائمة. تستخدم مصفوفة (tasks) لتخزين المهام، ويتم تحديث عرض القائمة (renderTasks()) في كل مرة يتم فيها تغيير المهام.
طرق ةوسائل المصفوفات في جافاسكربت
javascript arrays methods
طرق المصفوفات في JavaScript هي مجموعة من الوظائف المدمجة التي تسمح لك بتنفيذ عمليات مختلفة على المصفوفات، مثل إضافة عناصر جديدة، وحذف عناصر موجودة، وتغيير قيم العناصر، والعديد من العمليات الأخرى. إليك بعض أهم هذه الطرق:
push(): تُستخدم لإضافة عنصر جديد إلى نهاية المصفوفة.
let fruits = ["Apple", "Banana", "Orange"];
fruits.push("Mango");
// fruits is now ["Apple", "Banana", "Orange", "Mango"]
pop():
تُستخدم لإزالة العنصر الأخير من المصفوفة وإرجاعه.
let fruits = ["Apple", "Banana", "Orange"]; let lastFruit = fruits.pop(); // lastFruit is "Orange", fruits is now ["Apple", "Banana"]
shift(): تُستخدم لإزالة العنصر الأول من المصفوفة وإرجاعه.
let fruits = ["Apple", "Banana", "Orange"]; let firstFruit = fruits.shift(); // firstFruit is "Apple", fruits is now ["Banana", "Orange"]
unshift():
تُستخدم لإضافة عنصر جديد إلى بداية المصفوفة.
let fruits = ["Banana", "Orange"];
fruits.unshift("Apple");
// fruits is now ["Apple", "Banana", "Orange"]
splice():
تُستخدم لإضافة أو حذف عناصر من أي موضع في المصفوفة.
let fruits = ["Apple", "Banana", "Orange"]; fruits.splice(1, 1, "Mango", "Grapes"); // حذف عنصر واحد من الموضع 1 وإضافة Mango و Grapes // fruits is now ["Apple", "Mango", "Grapes", "Orange"]
concat():
تُستخدم لدمج مصفوفتين أو أكثر معًا لإنشاء مصفوفة جديدة.
let fruits1 = ["Apple", "Banana"]; let fruits2 = ["Orange", "Mango"]; let allFruits = fruits1.concat(fruits2); // allFruits is ["Apple", "Banana", "Orange", "Mango"]
هذه فقط بعض الأمثلة على الطرق الأكثر استخدامًا، وهناك المزيد من الطرق الأخرى التي تتيحها JavaScript للتعامل مع المصفوفات، مثل slice() و forEach() و map() وغيرها.
slice():
تُستخدم لإنشاء نسخة جديدة من جزء محدد من المصفوفة، دون تغيير المصفوفة الأصلية.
let fruits = ["Apple", "Banana", "Orange", "Mango"]; let citrusFruits = fruits.slice(1, 3); // يسترجع العناصر من الموضع 1 إلى الموضع 2 (غير متضمن) // citrusFruits is ["Banana", "Orange"]
forEach():
تُستخدم لتنفيذ دالة معينة على كل عنصر في المصفوفة.
let numbers = [1, 2, 3, 4, 5];
numbers.forEach(function(number) {
console.log(number);
});
// سيطبع الأرقام من 1 إلى 5
map():
تُستخدم لإنشاء مصفوفة جديدة باستخدام نتائج تطبيق دالة محددة على كل عنصر في المصفوفة الأصلية.
let numbers = [1, 2, 3, 4, 5];
let doubledNumbers = numbers.map(function(number) {
return number * 2;
});
// doubledNumbers is [2, 4, 6, 8, 10]
filter():
تُستخدم لإنشاء مصفوفة جديدة تحتوي على العناصر التي تم تمريرها إلى الدالة التصفية.
let numbers = [1, 2, 3, 4, 5];
let evenNumbers = numbers.filter(function(number) {
return number % 2 === 0;
});
// evenNumbers is [2, 4]
reduce():
تُستخدم لتقليل المصفوفة إلى قيمة واحدة واحتسابها باستخدام دالة محددة.
let numbers = [1, 2, 3, 4, 5];
let sum = numbers.reduce(function(accumulator, currentValue) {
return accumulator + currentValue;
}, 0);
// sum is 15
find():
تُستخدم للعثور على أول عنصر في المصفوفة الذي يطابق شرط معين وتُرجع قيمته.
let numbers = [10, 20, 30, 40, 50];
let found = numbers.find(function(number) {
return number > 25;
});
// found is 30
every():
تُستخدم للتحقق مما إذا كان كل العناصر في المصفوفة تفي بشرط معين أم لا.
let numbers = [10, 20, 30, 40, 50];
let allGreaterThanFive = numbers.every(function(number) {
return number > 5;
});
// allGreaterThanFive is true
some():
تُستخدم للتحقق مما إذا كان عنصر واحد على الأقل في المصفوفة يفي بشرط معين أم لا.
let numbers = [10, 20, 30, 40, 50];
let anyGreaterThanFifty = numbers.some(function(number) {
return number > 50;
});
// anyGreaterThanFifty is false
indexOf():
تُستخدم للعثور على الفهرس (index) للعنصر المعطى في المصفوفة، أو -1 إذا لم يتم العثور عليه.
let fruits = ["Apple", "Banana", "Orange"];
let bananaIndex = fruits.indexOf("Banana");
// bananaIndex is 1
lastIndexOf():
تُستخدم للعثور على الفهرس (index) لأخر ظهور للعنصر المعطى في المصفوفة، أو -1 إذا لم يتم العثور عليه.
jlet numbers = [1, 2, 3, 4, 2, 5]; let lastIndex = numbers.lastIndexOf(2); // lastIndex is 4
includes():
تُستخدم للتحقق مما إذا كانت المصفوفة تحتوي على عنصر محدد أم لا، وتُرجع قيمة مقابلة بينما تُرجع true إذا كانت المصفوفة تحتوي على العنصر المحدد.
let numbers = [1, 2, 3, 4, 5]; let includesThree = numbers.includes(3); // includesThree is true
join():
تُستخدم لتجميع جميع عناصر المصفوفة في سلسلة نصية، مع فصلها بفاصلة أو أي فاصلة محددة.
let fruits = ["Apple", "Banana", "Orange"];
let fruitsString = fruits.join(", ");
// fruitsString is "Apple, Banana, Orange"
reverse():
تُستخدم لعكس ترتيب العناصر في المصفوفة.
let numbers = [1, 2, 3, 4, 5]; numbers.reverse(); // numbers is now [5, 4, 3, 2, 1]
sort():
تُستخدم لفرز عناصر المصفوفة. افتراضيًا، يتم ترتيب العناصر كنصوص بناءً على القيم اليونيكودية.
let fruits = ["Banana", "Orange", "Apple", "Mango"]; fruits.sort(); // fruits is now ["Apple", "Banana", "Mango", "Orange"]
fill():
تُستخدم لملء المصفوفة بقيمة محددة.
let numbers = [1, 2, 3, 4, 5]; numbers.fill(0); // numbers is now [0, 0, 0, 0, 0]
flat():
تُستخدم لتسطيح مصفوفة متداخلة (nested) بمستوى واحد.
let nestedArray = [1, [2, 3], [4, [5, 6]]]; let flatArray = nestedArray.flat(); // flatArray is [1, 2, 3, 4, [5, 6]]
flatMap():
تُستخدم لدمج map() و flat() في عملية واحدة.
let numbers = [1, 2, 3];
let doubledAndFlattened = numbers.flatMap(function(number) {
return [number * 2];
});
// doubledAndFlattened is [2, 4, 6]
reduceRight():
يعمل مثل reduce() ولكن يبدأ العملية من العنصر الأخير ويتجه إلى الأول.
let numbers = [1, 2, 3, 4, 5];
let sumFromRight = numbers.reduceRight(function(accumulator, currentValue) {
return accumulator + currentValue;
});
// sumFromRight is 15
هذه بعض الطرق الأخرى المفيدة للتعامل مع المصفوفات في JavaScript. استخدم هذه الطرق بحسب احتياجاتك وتطبيقاتك لجعل عملك مع المصفوفات أكثر فعالية وسهولة.
تطبيق شامل مع الشرح
طبعًا، دعني أقدم لك مثالًا على تطبيق ويب يستخدم مصفوفات JavaScript لإنشاء قائمة تسوق. سيتيح للمستخدمين إضافة عناصر للقائمة، وتعديل العناصر، وحذفها. سنقوم ببناء الجزء الأساسي من التطبيق باستخدام HTML و CSS و JavaScript.
صفحة HTML:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Shopping List App</title> <link rel="stylesheet" href="styles.css"> </head> <body> <div class="container"> <h1>Shopping List</h1> <input type="text" id="itemInput" placeholder="Add New Item"> <button onclick="addItem()">Add Item</button> <ul id="itemList"></ul> </div> <script src="script.js"></script> </body> </html>
CSS (styles.css):
.container {
max-width: 400px;
margin: 0 auto;
padding: 20px;
text-align: center;
}
ul {
list-style-type: none;
padding: 0;
}
li {
margin: 10px 0;
cursor: pointer;
}
JavaScript (script.js):
let shoppingList = [];
function renderList() {
const itemList = document.getElementById('itemList');
itemList.innerHTML = '';
shoppingList.forEach((item, index) => {
const listItem = document.createElement('li');
listItem.textContent = item;
listItem.onclick = () => {
const newName = prompt('Enter a new name for this item:');
if (newName) {
shoppingList[index] = newName;
renderList();
}
};
itemList.appendChild(listItem);
});
}
function addItem() {
const itemInput = document.getElementById('itemInput');
const newItem = itemInput.value.trim();
if (newItem !== '') {
shoppingList.push(newItem);
itemInput.value = '';
renderList();
}
}
renderList();
الشرح:
HTML الأساسي: يحتوي على حقل إدخال لإضافة عنصر جديد للقائمة وزر لإضافته، وقائمة (ul) لعرض العناصر.
CSS: تطبيق تنسيقات بسيطة لتحسين مظهر التطبيق.
JavaScript: يقوم بإنشاء المصفوفة shoppingList لتخزين العناصر، وتقديم وظيفة renderList() لعرض العناصر على الصفحة. كما يوفر addItem() لإضافة عنصر جديد إلى المصفوفة، ويتم تحديث عرض القائمة بعد كل إضافة.
هذا المثال يوفر تطبيقًا بسيطًا ولكنه فعّال لإدارة قائمة التسوق باستخدام JavaScript و HTML. يمكنك توسيع هذا التطبيق بمزيد من الوظائف مثل حذف العناصر، وتخزين البيانات بشكل دائم باستخدام قواعد بيانات، وإضافة تنبيهات، وغير ذلك.
تطبيق شامل مع الشرح عن :javascript methods
هاكم تطبيقًا شاملاً يستخدم أساليب JavaScript لإنشاء قائمة مهام (To-Do List) مع الشرح:
صفحة HTML:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>To-Do List App</title> <link rel="stylesheet" href="styles.css"> </head> <body> <div class="container"> <h1>To-Do List</h1> <input type="text" id="taskInput" placeholder="Add New Task"> <button onclick="addTask()">Add Task</button> <ul id="taskList"></ul> </div> <script src="script.js"></script> </body> </html>
CSS (styles.css):
.container {
max-width: 400px;
margin: 0 auto;
padding: 20px;
text-align: center;
}
ul {
list-style-type: none;
padding: 0;
}
.completed {
text-decoration: line-through;
color: grey;
}
JavaScript (script.js):
javascript
let tasks = [];
function renderTasks() {
const taskList = document.getElementById('taskList');
taskList.innerHTML = '';
tasks.forEach((task, index) => {
const listItem = document.createElement('li');
listItem.textContent = task.text;
if (task.isCompleted) {
listItem.classList.add('completed');
}
listItem.onclick = () => {
toggleTask(index);
renderTasks();
};
taskList.appendChild(listItem);
});
}
function addTask() {
const taskInput = document.getElementById('taskInput');
const taskText = taskInput.value.trim();
if (taskText !== '') {
tasks.push({ text: taskText, isCompleted: false });
taskInput.value = '';
renderTasks();
}
}
function toggleTask(index) {
tasks[index].isCompleted = !tasks[index].isCompleted;
}
renderTasks();
الشرح:
HTML الأساسي: يحتوي على حقل إدخال لإضافة مهمة جديدة وزر لإضافتها، وقائمة (ul) لعرض المهام.
CSS: تنسيقات بسيطة لتحسين مظهر التطبيق، بما في ذلك خاصية تخطيط للعناصر وتحسينات في تنسيق النص.
JavaScript: يقوم بإنشاء المصفوفة tasks لتخزين المهام، وتقديم وظيفة renderTasks() لعرض المهام على الصفحة. كما يوفر addTask() لإضافة مهمة جديدة، و toggleTask() لتبديل حالة إكمال المهمة. تُظهر العناصر المكتملة بخط متقاطع ولون رمادي.
هذا التطبيق يعتمد على مجموعة من أساليب JavaScript مثل push()، forEach()، و classList.add() لإضافة وتحرير العناصر في المصفوفة، وتحديث وعرض القائمة بشكل ديناميكي في صفحة HTML.
مثال شامل عن استخدامات :javascript arrays methods
طبعًا، دعونا نقدم مثالًا شاملاً يستخدم عدة أساليب لمصفوفات JavaScript لإدارة قائمة مهام (To-Do List)، وذلك باستخدام أساليب مثل push()، splice()، map()، filter()، وغيرها.
لنفترض أننا نريد تطبيقًا يتيح للمستخدمين إضافة مهام جديدة، وتحديد مهام كمكتملة، وحذف المهام.
HTML:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>To-Do List</title> <link rel="stylesheet" href="styles.css"> </head> <body> <div class="container"> <h1>To-Do List</h1> <input type="text" id="taskInput" placeholder="Add New Task"> <button onclick="addTask()">Add Task</button> <ul id="taskList"></ul> </div> <script src="script.js"></script> </body> </html>
CSS (styles.css):
.container {
max-width: 400px;
margin: 0 auto;
padding: 20px;
text-align: center;
}
.completed {
text-decoration: line-through;
color: grey;
}
JavaScript (script.js):
javascript
let tasks = [];
function renderTasks() {
const taskList = document.getElementById('taskList');
taskList.innerHTML = '';
tasks.forEach((task, index) => {
const listItem = document.createElement('li');
listItem.textContent = task.text;
if (task.isCompleted) {
listItem.classList.add('completed');
}
listItem.onclick = () => {
toggleTask(index);
renderTasks();
};
taskList.appendChild(listItem);
});
}
function addTask() {
const taskInput = document.getElementById('taskInput');
const taskText = taskInput.value.trim();
if (taskText !== '') {
tasks.push({ text: taskText, isCompleted: false });
taskInput.value = '';
renderTasks();
}
}
function toggleTask(index) {
tasks[index].isCompleted = !tasks[index].isCompleted;
}
renderTasks();
الشرح:
في هذا المثال، نقوم بإنشاء تطبيق To-Do List يستخدم مصفوفة tasks لتخزين المهام.
يتم استخدام الدالة addTask() لإضافة مهمة جديدة إلى المصفوفة باستخدام push()، ويتم تحديث عرض القائمة بعد ذلك.
الدالة toggleTask() تقوم بتبديل حالة المهمة بين مكتملة وغير مكتملة باستخدام isCompleted.
تستخدم renderTasks() لعرض المهام على الصفحة، مع تغيير تنسيق المهام المكتملة باستخدام classList.add().
هذا المثال يوضح استخدامات عدة لأساليب المصفوفات في JavaScript لإنشاء تطبيق قائمة مهام بسيط وشامل.
خصائص المصفوفات في جافاسكريبت :javascript arrays properties
خصائص المصفوفات في JavaScript هي مجموعة من الخصائص التي توفر معلومات عن المصفوفة نفسها. إليك شرح لبعض الخصائص الشائعة:
length:
هذه الخاصية تحتوي على عدد العناصر في المصفوفة. عند إضافة عنصر جديد أو حذف عنصر، يتم تحديث قيمة length تلقائيًا.
let fruits = [“Apple”, “Banana”, “Orange”];
console.log(fruits.length); // يطبع 3
constructor:
هذه الخاصية تحتوي على مرجع إلى الوظيفة البنائية (constructor) للمصفوفة، والتي هي Array() في حالة المصفوفات القياسية.
let fruits = ["Apple", "Banana", "Orange"];
console.log(fruits.constructor); // يطبع "function Array() { [native code] }"
prototype:
هذه الخاصية تسمح لك بإضافة خصائص وطرق إلى جميع المصفوفات.
Array.prototype.sayHello = function() {
console.log("Hello from Array!");
};
let fruits = ["Apple", "Banana", "Orange"];
fruits.sayHello(); // يطبع "Hello from Array!"
isArray():
هذه الخاصية تحدد ما إذا كان الكائن الممرر إليها مصفوفة أم لا، وتُرجع true إذا كان كذلك، و false إذا لم يكن كذلك.
console.log(Array.isArray(["Apple", "Banana", "Orange"])); // يطبع true
console.log(Array.isArray("Apple")); // يطبع false
toString():
هذه الخاصية تحول المصفوفة إلى سلسلة نصية تحتوي على العناصر المفصولة بفاصلة.
let fruits = ["Apple", "Banana", "Orange"]; console.log(fruits.toString()); // يطبع "Apple,Banana,Orange"
مثال شامل مع الشرح عن:javascript array proprties
حسنًا، دعني أقدم لك مثالًا شاملًا يستخدم بعض خصائص المصفوفات في JavaScript مع شرح لكل منها:
مثال: تحليل قائمة موظفين
فرضيات المثال:
لدينا مصفوفة تحتوي على معلومات عن موظفين الشركة مثل الاسم والعمر والراتب.
نريد استخدام بعض خصائص المصفوفات للقيام ببعض التحليلات الأساسية على هذه البيانات.
HTML:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Employee Analysis</title> </head> <body> <h1>Employee Analysis</h1> <script src="script.js"></script> </body> </html>
JavaScript (script.js):
// تعريف مصفوفة الموظفين
let employees = [
{ name: "John", age: 30, salary: 50000 },
{ name: "Alice", age: 35, salary: 60000 },
{ name: "Bob", age: 40, salary: 70000 }
];
// 1. استخدام خاصية length لحساب عدد الموظفين
console.log("عدد الموظفين:", employees.length);
// 2. استخدام خاصية constructor للتحقق من نوع المصفوفة
console.log("نوع المصفوفة:", employees.constructor);
// 3. إضافة خاصية جديدة إلى المصفوفة باستخدام الخاصية prototype
Array.prototype.getAverageSalary = function() {
let totalSalary = 0;
this.forEach(function(employee) {
totalSalary += employee.salary;
});
return totalSalary / this.length;
};
// 4. استخدام الخاصية isArray للتحقق مما إذا كانت المصفوفة فعلاً من نوع Array
console.log("هل المتغير employees هو مصفوفة؟", Array.isArray(employees));
// 5. استخدام خاصية toString لتحويل المصفوفة إلى سلسلة نصية قابلة للقراءة
console.log("بيانات الموظفين:", employees.toString());
// 6. استخدام الخاصية slice لإنشاء نسخة من جزء من المصفوفة
let seniorEmployees = employees.slice(1);
console.log("الموظفين ذوي الخبرة العالية:", seniorEmployees);
// 7. استخدام الخاصية reverse لعكس ترتيب المصفوفة
employees.reverse();
console.log("ترتيب الموظفين بالعكس:", employees);
// 8. الوصول إلى عناصر المصفوفة باستخدام فهرسها
console.log("الموظف الأول:", employees[0]);
الشرح:
length: يُستخدم لحساب عدد الموظفين في المصفوفة.
constructor: يُستخدم للتحقق من نوع المصفوفة، وفي هذا المثال، يُظهر أن المصفوفة من نوع Array().
prototype: يُستخدم لإضافة خاصية جديدة إلى المصفوفة، وهنا تم إضافة خاصية getAverageSalary() لحساب متوسط الرواتب.
isArray: يُستخدم للتحقق مما إذا كان المتغير employees فعلاً من نوع مصفوفة.
toString: يُستخدم لتحويل المصفوفة إلى سلسلة نصية قابلة للقراءة.
slice: يُستخدم لإنشاء نسخة جديدة من جزء معين من المصفوفة.
reverse: يُستخدم لعكس ترتيب المصفوفة.
الوصول إلى عناصر المصفوفة باستخدام فهرسها.
اختبار عن هذا الدرس مع السرح
هاكم اختبارا قصيرا حول خصائص المصفوفات في JavaScript مع الشرح:
اختبار حول خصائص المصفوفات في JavaScript
1-ما هي خاصية length في المصفوفات في JavaScript؟
أ: تحتوي على عدد العناصر في المصفوفة.
ب: تحدد نوع المصفوفة.
ج: تحوّل المصفوفة إلى سلسلة نصية قابلة للقراءة.
د: تستخدم لإضافة خاصية جديدة إلى المصفوفة.
ما الخاصية التي تُستخدم للتحقق مما إذا كان المتغير فعلاً من نوع مصفوفة؟
أ: constructor
ب: length
ج: isArray
د: toString
2-ما الدالة التي تُستخدم لإضافة خاصية جديدة إلى جميع المصفوفات في JavaScript؟
أ: push()
ب: splice()
ج: prototype
د: concat()
3-ما الخاصية التي تستخدم لتحويل المصفوفة إلى سلسلة نصية قابلة للقراءة؟
أ: constructor
ب: isArray
ج: reverse
د: toString
4-ما الدالة التي تُستخدم لعكس ترتيب المصفوفة؟
أ: slice()
ب: reverse()
ج: map()
د: filter()
الشرح:
الإجابة الصحيحة: أ: تحتوي خاصية length على عدد العناصر في المصفوفة.
الإجابة الصحيحة: ج: تُستخدم خاصية isArray للتحقق مما إذا كان المتغير فعلاً من نوع مصفوفة.
الإجابة الصحيحة: ج: يُستخدم prototype لإضافة خاصية جديدة إلى جميع المصفوفات في JavaScript.
الإجابة الصحيحة: د: يُستخدم toString لتحويل المصفوفة إلى سلسلة نصية قابلة للقراءة.
الإجابة الصحيحة: ب: يُستخدم reverse لعكس ترتيب المصفوفة.
هذا الاختبار يختبر معرفتك حول خصائص المصفوفات في JavaScript وقدرتك على استخدامها وتفسيرها.
1-ما النتيجة التي ستحصل عليها عند استخدام الدالة concat() لدمج مصفوفتين؟
أ: تحصل على نسخة جديدة من المصفوفة الأولى.
ب: تحصل على مصفوفة جديدة تحتوي على عناصر كلا المصفوفتين.
ج: تحصل على مصفوفة جديدة تحتوي على العناصر المشتركة فقط بين الاثنين.
د: تقوم بإضافة عناصر المصفوفة الثانية إلى المصفوفة الأولى.
2-ما هو الهدف من استخدام الخاصية slice() في المصفوفات؟
أ: لإنشاء نسخة من جزء معين من المصفوفة.
ب: لعكس ترتيب المصفوفة.
ج: لتحويل المصفوفة إلى سلسلة نصية.
د: للتحقق مما إذا كان المتغير فعلاً من نوع مصفوفة.
3-ما هو الفرق بين الدالتين forEach() و map() في JavaScript؟
أ: forEach() تستخدم لتطبيق دالة معينة على كل عنصر في المصفوفة، بينما map() تُنشئ مصفوفة جديدة باستخدام النتائج.
ب: forEach() تقوم بتحويل المصفوفة إلى سلسلة نصية، بينما map() تحول المصفوفة إلى عدد صحيح.
ج: forEach() تقوم بتطبيق دالة على كل عنصر دون تغيير المصفوفة، بينما map() تقوم بتحويل العناصر إلى أنواع بيانات مختلفة.
د: لا فرق بينهما، يمكن استخدامهما بنفس الطريقة.
4-كيف يمكنك تعيين قيمة معينة لعنصر في المصفوفة في JavaScript؟
أ: باستخدام الدالة insert().
ب: باستخدام الدالة replace().
ج: باستخدام الدالة set().
د: عن طريق الوصول المباشر إلى عنصر المصفوفة باستخدام فهرسه.
5-ما هو النتيجة التي ستحصل عليها عند استخدام الدالة pop() على المصفوفة [“Apple”, “Banana”, “Orange”]؟
أ: المصفوفة تصبح [“Apple”, “Banana”] والقيمة المحذوفة هي “Orange”.
ب: المصفوفة تصبح [“Banana”, “Orange”] والقيمة المحذوفة هي “Apple”.
ج: المصفوفة تصبح [“Orange”, “Banana”] والقيمة المحذوفة هي “Apple”.
د: المصفوفة تصبح فارغة والقيمة المحذوفة هي “Orange”.
الشرح:
الإجابة الصحيحة: ب: تحصل على مصفوفة جديدة تحتوي على عناصر كلا المصفوفتين.
الدالة concat() تجمع بين مصفوفتين أو أكثر وتُعيد مصفوفة جديدة تحتوي على جميع العناصر.
الإجابة الصحيحة: أ: لإنشاء نسخة من جزء معين من المصفوفة.
الدالة slice() تُستخدم لإنشاء نسخة جديدة من جزء معين من المصفوفة دون تغيير المصفوفة الأصلية.
الإجابة الصحيحة: أ: forEach() تستخدم لتطبيق دالة معينة على كل عنصر في المصفوفة، بينما map() تُنشئ مصفوفة جديدة باستخدام النتائج.
forEach() تُطبق دالة على كل عنصر دون تغيير المصفوفة الأصلية، بينما map() تُنشئ مصفوفة جديدة باستخدام النتائج التي تم إرجاعها من تطبيق الدالة.
الإجابة الصحيحة: د: عن ط