مقدمة في JavaScript: استكمال للدرس الاول Bitwise Operators

بسم الله الرحمن الرحيم

اللَّهُمَّ انْفَعْنَا بِمَا عَلَّمْتَنَا , وَعَلِّمْنَا مَا يَنْفَعُنَا , وَزِدْنَا عِلْمًا إِلَى عِلْمِنَا

مقدمة:

استكمالًا  لسلسلة دروس (مقدمة في JavaScript -سنرمز لها لاحقأ بالاختصار JS-) سوف نتعلم اليوم النوع الأخير من العمليات في لغة JS وهي عمليات البيتوايز (Bitwise operators).

https://3alam.pro/articles/javascript/javascript-introduction-syntax/

تذكر JavaScript ليست Java

العمليات (Operations): 

هُنا جدول يوضح عمليات ال Bitwise

#	وصف العملية
&	المسمى: Bitwise AND الوظيفة: يقوم بعمل مقارنة لكل بت (Bit) في السلسلة بحيث اذا تقابل البت 1 مع البت 1 سيكون الناتج 1 عدى ذلك 0. // مثال توضيحي var x = 2; // In (4) bit: 0010 var y = 3; // In (4) bit: 0011 var z; z = (x & y); // Z = 2
|	المسمى: Bitwise OR الوظيفة: يقوم بعمل مقارنة لكل بت (Bit) في السلسلة بحث اذا تقابل البت 0 مع البت 0 سيكون الناتج 0 عدى ذلك 1. // مثال توضيحي var x = 2; // In (4) bit: 0010 var y = 3; // In (4) bit: 0011 var z; z = (x | y); // Z = 3
^	المسمى: Bitwise exclusive OR الاختصار: XOR الوظيفة: يقوم بعمل مقارنة لكل بت (Bit) في السلسلة بحيث اذا تشابه البت في كلا الطرفين سيكون الناتج 0 عدى ذلك 1. // مثال توضيحي var x = 2; // In (4) bit: 0010 var y = 3; // In (4) bit: 0011 var z; z = (x ^ y); // Z = 1
~	المسمى: Bitwise NOT الوظيفة: يقوم بعمل مقارنة لكل بت (Bit) في السلسلة بحيث يقوم بتحويل ال 1 الى 0 وال 0 الى 1. // مثال توضيحي var y = 3; // In (4) bit: 0011 var z; z = (~y); // y = -4 In (4) bit: 1100
	المسمى: Bitwise left shift الوظيفة: يقوم بعمل ازاحة لكل بت حسب المكان المعطى الى جهة اليسار. // مثال توضيحي var y = 3; // In (4) bit: 0011 var z; z = (y << 1); // y = 6 In (4) bit: 0110
	المسمى: Bitwise right shift الوظيفة: يقوم بعمل ازاحة لكل بت حسب المكان المعطى الى جهة اليمين. // مثال توضيحي var y = 3; // In (4) bit: 0011 var z; z = (y >> 1); // y = 1 In (4) bit: 001
	المسمى: Bitwise right shift with ZERO الوظيفة: يقوم بعمل ازاحة لكل بت حسب المكان المعطى الي جهة اليمين. الفرق بينها وبين Right shift انها دومًا تعوض جهة اليسار بالبت 0. تستخدم غالبًا مع الاعداد السالبة. // مثال توضيحي var y = 3; // In (4) bit: 0011 var z; z = (y >>> 1); // y = 1 In (4) bit: 001

في الجدول أعلاه قمنا بوضع كل عملية مع مثال مبسط لها، ومنه نستنتج أن  Bitwise Operator تتعامل مع ال Binary لكل عدد وتقارن وتزيح حسب العملية المستخدم والازاحة المعطاة.

ولنبسط الفكرة، سوف نأخذ كل عملية ونقوم بوضع مثال مشروح لها.

اولًا : Bitwise AND

لنفترض أن لدينا العدد 2 والعدد 3 كما في المثال المدرج في الجدول، ولكل عدد قيمة رقمية متسلسلة (Binary) خاصة به وكل قيمة سوف نجعلها 4 Bit أي متكونة من 4 خانات كالأتي:

العدد 2 لديه القيمة: 10 ولنجعلها 4 Bit نضيف اصفار من على اليسار لتصبح 0010

العدد 3 لديه القيمة: 11 ولنجعلها 4 Bit نضيف أصفار من على اليسار لتصبح 0011

عملية بسيطة أليس كذلك؟ وللتبسيط أكثر ياصديقي سوف نخرج عن الموضوع قليلًا لنشرح ماهي ال Binary.

باللغة العربية ( نظام العد الثنائي )، وبالإنجليزية ( Binary Numeral System ) هو نظام أعداد -غير بشري أي لا يستطيع البشر فهمه أو قراءته بسهولة - يستخدم لتمثيل قيم عددية باستخدام الرمزين (الرقمين) 1 و 0، وهو لغة الآلة أو اللغة التي يتحدث بها الكمبيوتر ( الحاسب الآلي ). 

ملاحظة: نظام الأرقام الذي نستخدمه نحن بنو البشر هو Decimal Numeral System بالعربية ( نظام العد العشري ).

نعود لمثالنا، الأن عند استخدام العميلة (AND) والتي يرمز لها بالرمز & فالذي يحدث هو أن النظام يقوم بمقارنة كُل خانة من سلسلة الأرقام الأولى بكل خانة من سلسلة الأرقام الثانية ... لم تفهم صح 

سأبسط لك العملية بهذه الصورة:

لاحظ المنطق، يكون الناتج 1 فقط اذا تقابل 1 مع 1 .. عدى ذلك سيكون الناتج دائمًا 0، والناتج النهائي هو الرقم 2 بالتأكيد. فهمت كيف تعمل الان ؟! 

ثانيًا: Bitwise OR

لنفترض نفس المثال مع AND، والصورة التالية تشرح الأمر:

هل لاحظت الإختلاف عن العملية AND، الأن في العملية OR اذا تقابل 0 مع 0 يكون الناتج 0 عدى ذلك فهو 1.

ونفس المنطق تمامًا يعمل مع بقية العمليات عدى أن المنطق يختلف قليلًا من عملية إلى أخرى، وربما تكون أصعب عملية هي الـ Shifting ( التحريك )، كونها تحتاج لمبدأ ثابت ومنطق صارم لكي يكون الناتج صحيح.

ولنبسط الـ Shifting كما فعلنا مع الـ AND والـ OR سوف نشرحها في بطاقة ( صورة توضيحية )، وبالتأكيد سأقوم بشرح واحدة من العمليات الثلاث، كون أن فهم واحدة منهن يكفي لفهم الإثنتان الأخريين.

ثالثًا: Bitwise Shifting

الصورة التالية توضح عملية الـ Left Shift (  ):

لاحظ عندما قمنا بالتحريك لليسار ( من اليمين إلى اليسار ) تحركت الأرقام حتى خسرنا 0 من جهة اليسار، وللتعويض قمنا بوضع 0 في اليمين ... وهكذا تتم العملية. 

ولكي أتأكد من عدم وجود أي غموض بالموضوع، هذه صورة متحركة تشرح الخطوات! الصورة تحتوي على مصطلحات مثل Flip Flop و Clear و Data Input تجاهلها فقط، لأن الصورة تشرح عمل ال Register وهو لا يهمنا ولكن مايهمنا توضيح الفكرة 

أتمنى أن تكون الأمور أكثر وضوحًا الان، واسأل الله العلي العظيم أن أكون قد وفقت في إيصال المعلومة.

تحياتي.