أدوات jQuery المساعدة والوظائف المفيدة

<script>
// التكرار على مصفوفة
var fruits = ['apple', 'banana', 'orange'];

$.each(fruits, function(index, value) {
    console.log(index + ': ' + value);
});
// النتيجة: 0: apple, 1: banana, 2: orange

// التكرار على كائن
var person = {
    name: 'John',
    age: 30,
    city: 'New York'
};

$.each(person, function(key, value) {
    console.log(key + ': ' + value);
});
// النتيجة: name: John, age: 30, city: New York

// مثال عملي: ملء قائمة
var colors = ['red', 'green', 'blue'];
var list = $('<ul></ul>');

$.each(colors, function(i, color) {
    list.append('<li>' + color + '</li>');
});

$('#color-container').append(list);
</script>

<script>
// تحويل مصفوفة
var numbers = [1, 2, 3, 4, 5];

var doubled = $.map(numbers, function(value) {
    return value * 2;
});

console.log(doubled); // [2, 4, 6, 8, 10]

// استخراج خصائص من الكائنات
var users = [
    { name: 'John', age: 25 },
    { name: 'Jane', age: 30 },
    { name: 'Bob', age: 35 }
];

var names = $.map(users, function(user) {
    return user.name;
});

console.log(names); // ['John', 'Jane', 'Bob']

// التصفية والتحويل معاً
var products = [
    { name: 'Laptop', price: 1000 },
    { name: 'Mouse', price: 25 },
    { name: 'Keyboard', price: 75 }
];

var expensiveItems = $.map(products, function(product) {
    if (product.price > 50) {
        return product.name;
    }
});

console.log(expensiveItems); // ['Laptop', 'Keyboard']
</script>

<script>
// تصفية الأرقام
var numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

var evenNumbers = $.grep(numbers, function(n) {
    return n % 2 === 0;
});

console.log(evenNumbers); // [2, 4, 6, 8, 10]

// التصفية مع خيار العكس
var oddNumbers = $.grep(numbers, function(n) {
    return n % 2 === 0;
}, true); // true يعكس التصفية

console.log(oddNumbers); // [1, 3, 5, 7, 9]

// مثال عملي: تصفية المهام المنجزة
var tasks = [
    { title: 'Buy groceries', completed: true },
    { title: 'Write report', completed: false },
    { title: 'Call client', completed: true },
    { title: 'Review code', completed: false }
];

var completedTasks = $.grep(tasks, function(task) {
    return task.completed;
});

console.log(completedTasks.length + ' tasks completed');
</script>

<script>
var text = '   Hello World   ';
var trimmed = $.trim(text);

console.log('|' + text + '|');     // |   Hello World   |
console.log('|' + trimmed + '|'); // |Hello World|

// مثال عملي: تنظيف إدخال المستخدم
$('#submit-btn').click(function() {
    var username = $.trim($('#username').val());
    var email = $.trim($('#email').val());

    if (username === '') {
        alert('اسم المستخدم لا يمكن أن يكون فارغاً');
        return false;
    }

    // معالجة البيانات المنظفة
    console.log('Username: ' + username);
    console.log('Email: ' + email);
});
</script>

<script>
var fruits = ['apple', 'banana', 'orange', 'grape'];

console.log($.inArray('banana', fruits));  // 1
console.log($.inArray('mango', fruits));   // -1

// مثال عملي: التحقق من وجود العنصر
var selectedItems = ['item1', 'item3', 'item5'];

$('#add-item-btn').click(function() {
    var itemId = $(this).data('item-id');

    if ($.inArray(itemId, selectedItems) === -1) {
        selectedItems.push(itemId);
        console.log('تمت إضافة العنصر');
    } else {
        console.log('العنصر موجود بالفعل');
    }
});

// التحقق من قيم متعددة
function hasAnyFruit(fruits) {
    var searchFor = ['apple', 'pear'];

    for (var i = 0; i < searchFor.length; i++) {
        if ($.inArray(searchFor[i], fruits) !== -1) {
            return true;
        }
    }
    return false;
}

console.log(hasAnyFruit(fruits)); // true
</script>

<script>
// $.isArray() - التحقق من كون المتغير مصفوفة
console.log($.isArray([1, 2, 3]));     // true
console.log($.isArray('string'));      // false

// $.isFunction() - التحقق من كون المتغير دالة
console.log($.isFunction(function(){})); // true
console.log($.isFunction(123));          // false

// $.isNumeric() - التحقق من كون المتغير رقمياً
console.log($.isNumeric(123));      // true
console.log($.isNumeric('123'));    // true
console.log($.isNumeric('abc'));    // false

// $.isPlainObject() - التحقق من كون المتغير كائن بسيط
console.log($.isPlainObject({}));                // true
console.log($.isPlainObject({a: 1}));            // true
console.log($.isPlainObject(new Date()));        // false
console.log($.isPlainObject([1, 2]));            // false

// $.isEmptyObject() - التحقق من كون الكائن فارغاً
console.log($.isEmptyObject({}));           // true
console.log($.isEmptyObject({a: 1}));       // false

// مثال عملي: التحقق من صحة البيانات قبل AJAX
function sendData(data) {
    if (!$.isPlainObject(data)) {
        console.error('يجب أن تكون البيانات كائناً');
        return;
    }

    if ($.isEmptyObject(data)) {
        console.error('لا يمكن أن تكون البيانات فارغة');
        return;
    }

    // إرسال البيانات
    $.ajax({
        url: '/api/save',
        method: 'POST',
        data: data
    });
}
</script>

<script>
// دمج أساسي
var defaults = {
    color: 'blue',
    size: 'medium',
    price: 100
};

var options = {
    color: 'red',
    discount: 10
};

var settings = $.extend({}, defaults, options);

console.log(settings);
// { color: 'red', size: 'medium', price: 100, discount: 10 }

// دمج عميق
var obj1 = {
    a: 1,
    b: {
        c: 2,
        d: 3
    }
};

var obj2 = {
    b: {
        d: 4,
        e: 5
    },
    f: 6
};

var merged = $.extend(true, {}, obj1, obj2); // true = دمج عميق

console.log(merged);
// { a: 1, b: { c: 2, d: 4, e: 5 }, f: 6 }

// مثال عملي: إعدادات الإضافة
function MyPlugin(element, options) {
    this.settings = $.extend({}, MyPlugin.defaults, options);
    this.element = $(element);
    this.init();
}

MyPlugin.defaults = {
    speed: 300,
    effect: 'fade',
    autoplay: false
};

MyPlugin.prototype.init = function() {
    console.log('تم تهيئة الإضافة مع:', this.settings);
};

// الاستخدام
var plugin = new MyPlugin('#my-element', {
    speed: 500,
    autoplay: true
});
</script>

<script>
// $.parseJSON() - تحليل نص JSON
var jsonString = '{"name":"John","age":30}';
var obj = $.parseJSON(jsonString);

console.log(obj.name); // John
console.log(obj.age);  // 30

// $.parseHTML() - تحليل نص HTML إلى عقد DOM
var htmlString = '<div class="box"><p>Hello</p></div>';
var nodes = $.parseHTML(htmlString);

$('#container').append(nodes);

// مثال عملي: معالجة استجابة API
$.ajax({
    url: '/api/user',
    dataType: 'text', // استلام كنص
    success: function(response) {
        try {
            var data = $.parseJSON(response);
            displayUser(data);
        } catch (e) {
            console.error('استجابة JSON غير صالحة');
        }
    }
});
</script>

<script>
// الحصول على الطابع الزمني الحالي بالميلي ثانية
var timestamp = $.now();
console.log(timestamp); // مثلاً، 1635789456789

// مثال عملي: قياس الأداء
var startTime = $.now();

// تنفيذ عملية ما
for (var i = 0; i < 1000000; i++) {
    // بعض العمل
}

var endTime = $.now();
var duration = endTime - startTime;

console.log('استغرقت العملية ' + duration + 'ms');

// منع التخزين المؤقت
function loadData() {
    $.ajax({
        url: '/api/data?t=' + $.now(), // منع التخزين المؤقت
        success: function(data) {
            console.log(data);
        }
    });
}
</script>

<script>
// استخدام $.noop() كـ callback افتراضي
function processData(data, callback) {
    callback = callback || $.noop;

    // معالجة البيانات
    console.log('جاري المعالجة...');

    // تنفيذ الـ callback
    callback();
}

// الاستدعاء بدون callback - لا يوجد خطأ
processData({name: 'John'});

// الاستدعاء مع callback
processData({name: 'Jane'}, function() {
    console.log('تم!');
});
</script>