JavaScript: الدوال في جافاسكريبت

<!DOCTYPE html>
<html lang="ar" dir="rtl">
<head><meta charset="UTF-8"><title>استدعاء الدوال</title></head>
<body>
<div id="output"></div>
<script>
function sayHello() {
  document.getElementById('output').textContent += 'مرحبا!\n';
}

sayHello();
sayHello();
</script>
</body>
</html>

<script>
// إعلان الدالة
function greet(name) {
  return `مرحبا، ${name}!`;
}

// تعبير الدالة
let greet2 = function(name) {
  return `مرحبا، ${name}!`;
};
</script>

<script>
// إعلان الدالة: استدعاء قبل التعريف — يعمل بشكل جيد
hello();  // يعمل بدون خطأ
function hello() { console.log('مرحبا'); }

// تعبير الدالة: استدعاء قبل التعريف — خطأ
// hi();     // TypeError: hi is not a function
// let hi = function() { console.log('مرحبا'); };
</script>

<script>
function add(a, b) {
  return a + b;
}
add(1, 2);  // 3
</script>

<script>
function greet(name, greeting = 'مرحبا') {
  return `${greeting}، ${name}!`;
}

greet('سارة');           // 'مرحبا، سارة!'
greet('سارة', 'أهلا');    // 'أهلا، سارة!'
</script>

<script>
function square(n) {
  return n * n;
}

let result = square(5);  // 25
</script>

<script>
function doNothing() {
  // لا يوجد return
}
doNothing();  // undefined
</script>

<script>
// دالة عادية
let double = function(n) {
  return n * 2;
};

// دالة سهمية
let double2 = (n) => n * 2;

// جمل متعددة تتطلب أقواسًا وreturn صريح
let greet = (name) => {
  let msg = `مرحبا، ${name}!`;
  return msg;
};
</script>

<script>
function test() {
  let x = 10;    // متغير محلي
  const y = 20;
  var z = 30;
}
test();
// console.log(x);  // ReferenceError: x is not defined
</script>

<!DOCTYPE html>
<html lang="ar" dir="rtl">
<head><meta charset="UTF-8"><title>نطاق الدالة</title></head>
<body>
<pre id="output"></pre>
<script>
let global = 'متغير عام';

function show() {
  let local = 'متغير محلي';
  document.getElementById('output').textContent +=
    'داخل الدالة — global: ' + global + '\n' +
    'داخل الدالة — local: ' + local + '\n';
}
show();
document.getElementById('output').textContent +=
  'خارج الدالة — global: ' + global + '\n' +
  'خارج الدالة — local: غير قابل للوصول (متغير محلي)';
</script>
</body>
</html>

<!DOCTYPE html>
<html lang="ar" dir="rtl">
<head><meta charset="UTF-8"><title>الاستدعاءات الخلفية</title></head>
<body>
<pre id="output"></pre>
<script>
function processArray(arr, callback) {
  for (let item of arr) {
    callback(item);
  }
}

let names = ['سارة', 'أحمد', 'محمد'];
processArray(names, function(name) {
  document.getElementById('output').textContent += 'مرحبا، ' + name + '\n';
});
</script>
</body>
</html>

<script>
// الدالة المجهولة هنا هي استدعاء خلفي
[1, 2, 3].forEach(function(n) {
  console.log(n);
});

// الدوال السهمية تجعلها أكثر اختصارًا
[1, 2, 3].forEach(n => console.log(n));
</script>