شبيبة تعليمي

شبيبة المنزل مقدمة شبيبة شبيبة إلى أين إخراج JS بيانات شبيبة بناء جملة JS تعليقات JS متغيرات JS JS Let شبيبة كونست مشغلي JS شبيبة الحساب احالة JS أنواع بيانات JS وظائف JS كائنات JS أحداث شبيبة سلاسل شبيبة طرق سلسلة JS بحث سلسلة JS JS String Templates أرقام شبيبة طرق عدد JS صفيفات JS طرق صفيف JS ترتيب صفيف JS تكرار صفيف JS JS Array Const تواريخ شبيبة تنسيقات التاريخ JS طرق الحصول على تاريخ JS طرق تعيين تاريخ JS شبيبة الرياضيات شبيبة عشوائية شبيبة منطقية مقارنات شبيبة شروط JS مفتاح JS JS Loop For JS Loop For In. شبيبة حلقة JS لـ Of شبيبة حلقة بينما شبيبة استراحة شبيبة تكرارات مجموعات JS خرائط شبيبة شبيبة تايبوف JS نوع التحويل شبيبة Bitwise JS RegExp أخطاء JS شبيبة النطاق رفع JS وضع JS الصارم شبيبة هذه الكلمة دالة سهم JS فئات JS شبيبة شبيبة تصحيح أخطاء JS دليل أسلوب JS أفضل ممارسات JS أخطاء JS أداء JS شبيبة الكلمات المحجوزة

إصدارات JS

إصدارات JS JS 2009 (ES5) شبيبة 2015 (ES6) شبيبة 2016 شبيبة 2017 شبيبة 2018 شبيبة آي إي / إيدج تاريخ شبيبة

كائنات JS

تعريفات الكائن خصائص الموضوع طرق الكائن عرض الكائن موصلي الكائنات منشئو الكائنات نماذج الكائن كائن تكرارات مجموعات الكائن خرائط الكائن مرجع الكائن

وظائف JS

تعريفات الوظائف معلمات الوظيفة استدعاء الوظيفة استدعاء الوظيفة تطبيق الوظيفة عمليات إغلاق الوظائف

فئات JS

مقدمة عن الفصل الوراثة الطبقية فئة ثابتة

شبيبة آسينك

عمليات الاسترجاعات JS شبيبة غير متزامن وعود شبيبة شبيبة Async / انتظار

JS HTML DOM

مقدمة DOM طرق DOM مستند DOM عناصر DOM DOM HTML نماذج DOM DOM CSS الرسوم المتحركة DOM أحداث DOM مستمع أحداث DOM التنقل في DOM عقد DOM مجموعات DOM قوائم عقدة DOM

متصفح JS BOM

نافذة JS شاشة JS موقع JS تاريخ شبيبة شبيبة ملاح تنبيه منبثق لـ JS توقيت شبيبة ملفات تعريف الارتباط JS

JS Web APIs

مقدمة واجهة برمجة تطبيقات الويب واجهة برمجة تطبيقات نماذج الويب واجهة برمجة تطبيقات سجل الويب واجهة برمجة تطبيقات تخزين الويب Web Worker API واجهة برمجة تطبيقات جلب الويب واجهة برمجة تطبيقات تحديد الموقع الجغرافي على الويب

شبيبة أجاكس

مقدمة أجاكس أجاكس XMLHttp طلب AJAX استجابة AJAX ملف AJAX XML أجاكس بي إتش بي أجاكس آسيا والمحيط الهادئ قاعدة بيانات أجاكس تطبيقات أجاكس أمثلة AJAX

شبيبة شبيبة

مقدمة JSON بناء جملة JSON JSON مقابل XML أنواع بيانات JSON تحليل JSON تنسيق JSON كائنات JSON صفائف JSON خادم JSON JSON PHP JSON HTML جسون جسونب

JS مقابل jQuery

محددات jQuery jQuery HTML jQuery CSS jQuery DOM

شبيبة الرسومات

شبيبة الرسومات قماش شبيبة شبيبة بلوتلي JS Chart.js مخطط جوجل JS شبيبة D3.js

أمثلة JS

أمثلة JS JS HTML DOM إدخال JS HTML كائنات JS HTML أحداث HTML متصفح JS محرر JS تمارين شبيبة شبيبة مسابقة شهادة JS

مراجع JS

كائنات جافا سكريبت كائنات HTML DOM


متغيرات جافا سكريبت

4 طرق لتعريف متغير JavaScript:

  • استخدامvar
  • استخدامlet
  • استخدامconst
  • باستخدام لا شيء

ما هي المتغيرات؟

المتغيرات عبارة عن حاويات لتخزين البيانات (تخزين قيم البيانات).

في هذا المثال ، x، yو z، متغيرات ، معرّفة varبالكلمة الأساسية:

مثال

var x = 5;
var y = 6;
var z = x + y;

في هذا المثال ، x، yو z، متغيرات ، معرّفة letبالكلمة الأساسية:

مثال

let x = 5;
let y = 6;
let z = x + y;

في هذا المثال ، تعتبر x، yو z، متغيرات غير معرّفة:

مثال

x = 5;
y = 6;
z = x + y;

من جميع الأمثلة أعلاه ، يمكنك تخمين:

  • x يخزن القيمة 5
  • y يخزن القيمة 6
  • يخزن z القيمة 11

متى تستخدم JavaScript var؟

قم دائمًا بتعريف متغيرات JavaScript باستخدام var، letأو ، أو const.

تم varاستخدام الكلمة الأساسية في جميع أكواد JavaScript من 1995 إلى 2015.

تمت letإضافة constالكلمات الأساسية والكلمات الرئيسية إلى JavaScript في عام 2015.

إذا كنت تريد تشغيل التعليمات البرمجية الخاصة بك في متصفح أقدم ، فيجب عليك استخدام var.


متى يتم استخدام JavaScript const؟

إذا كنت تريد قاعدة عامة: أعلن دائمًا عن المتغيرات باستخدام const.

إذا كنت تعتقد أن قيمة المتغير يمكن أن تتغير ، فاستخدم let.

في هذا المثال ، تكون price1، price2و total، متغيرات:

مثال

const price1 = 5;
const price2 = 6;
let total = price1 + price2;

يتم التصريح عن المتغيرين بالكلمة price1الأساسية .price2const

هذه قيم ثابتة ولا يمكن تغييرها.

totalيتم التصريح عن المتغير letبالكلمة الأساسية.

هذه قيمة يمكن تغييرها.


تماما مثل الجبر

كما هو الحال في الجبر ، فإن المتغيرات تحمل قيمًا:

let x = 5;
let y = 6;

كما هو الحال في الجبر ، يتم استخدام المتغيرات في التعبيرات:

let z = x + y;

من المثال أعلاه ، يمكنك تخمين أن الإجمالي محسوب على أنه 11.

ملحوظة

المتغيرات عبارة عن حاويات لتخزين القيم.



معرفات جافا سكريبت

يجب تحديد جميع متغيرات JavaScript بأسماء فريدة .

تسمى هذه الأسماء الفريدة بالمعرفات .

يمكن أن تكون المعرفات أسماء قصيرة (مثل x و y) أو أسماء وصفية أكثر (العمر ، المجموع ، إجمالي الحجم).

القواعد العامة لإنشاء أسماء للمتغيرات (المعرفات الفريدة) هي:

  • يمكن أن تحتوي الأسماء على أحرف وأرقام وشرطات سفلية وعلامات الدولار.
  • يجب أن تبدأ الأسماء بحرف
  • يمكن أن تبدأ الأسماء أيضًا بـ $ و _ (لكننا لن نستخدمها في هذا البرنامج التعليمي)
  • الأسماء حساسة لحالة الأحرف (y و Y متغيران مختلفان)
  • لا يمكن استخدام الكلمات المحجوزة (مثل كلمات JavaScript الأساسية) كأسماء

ملحوظة

معرّفات JavaScript حساسة لحالة الأحرف.


عامل التخصيص

في JavaScript ، علامة التساوي ( =) هي عامل "تعيين" ، وليست عامل تشغيل "يساوي".

هذا يختلف عن الجبر. ما يلي لا معنى له في الجبر:

x = x + 5

ومع ذلك ، في JavaScript ، يكون الأمر منطقيًا تمامًا: فهو يعين قيمة x + 5 إلى x.

(تحسب قيمة x + 5 وتضع النتيجة في x. تزداد قيمة x بمقدار 5.)

ملحوظة

عامل التشغيل "يساوي" مكتوب مثل ==جافا سكريبت.


أنواع بيانات JavaScript

يمكن أن تحتوي متغيرات جافا سكريبت على أرقام مثل 100 وقيم نصية مثل "John Doe".

في البرمجة ، تسمى القيم النصية سلاسل نصية.

يمكن لـ JavaScript التعامل مع العديد من أنواع البيانات ، ولكن في الوقت الحالي ، ما عليك سوى التفكير في الأرقام والسلاسل.

تتم كتابة السلاسل داخل علامتي اقتباس مزدوجتين أو مفردة. الأرقام مكتوبة بدون علامات اقتباس.

إذا وضعت رقمًا بين علامتي اقتباس ، فسيتم التعامل معه كسلسلة نصية.

مثال

const pi = 3.14;
let person = "John Doe";
let answer = 'Yes I am!';

إعلان متغير جافا سكريبت

يسمى إنشاء متغير في JavaScript "إعلان" متغير.

تعلن عن متغير جافا سكريبت باستخدام varأو letالكلمة الأساسية:

var carName;
أو:
let carName;

بعد الإعلان ، المتغير ليس له قيمة (من الناحية الفنية undefined).

لتعيين قيمة للمتغير ، استخدم علامة التساوي:

carName = "Volvo";

يمكنك أيضًا إسناد قيمة للمتغير عندما تعلنه:

let carName = "Volvo";

في المثال أدناه ، أنشأنا متغيرًا يسمى متغيرًا carNameوخصصنا له القيمة "Volvo".

ثم "نخرج" القيمة داخل فقرة HTML بالمعرف = "demo":

مثال

<p id="demo"></p>

<script>
let carName = "Volvo";
document.getElementById("demo").innerHTML = carName;
</script>

ملحوظة

إنها ممارسة برمجية جيدة للإعلان عن جميع المتغيرات في بداية البرنامج النصي.


بيان واحد ، العديد من المتغيرات

يمكنك التصريح عن العديد من المتغيرات في بيان واحد.

ابدأ العبارة بفاصلاتvar وافصل بين المتغيرات :

مثال

let person = "John Doe", carName = "Volvo", price = 200;

يمكن أن يمتد الإعلان على عدة أسطر:

مثال

let person = "John Doe",
carName = "Volvo",
price = 200;

القيمة = غير محدد

في برامج الكمبيوتر ، غالبًا ما يتم التصريح عن المتغيرات بدون قيمة. يمكن أن تكون القيمة شيئًا يجب حسابه ، أو شيئًا سيتم توفيره لاحقًا ، مثل مدخلات المستخدم.

المتغير المعلن بدون قيمة سيكون له القيمة undefined.

سيكون للمتغير carName القيمة undefinedبعد تنفيذ هذه العبارة:

مثال

let carName;

إعادة تعريف متغيرات جافا سكريبت

إذا قمت بإعادة التصريح عن متغير JavaScript تم الإعلان عنه var، فلن يفقد قيمته.

carNameسيظل المتغير يحمل قيمة "فولفو" بعد تنفيذ هذه العبارات:

مثال

var carName = "Volvo";
var carName;

ملحوظة

لا يمكنك إعادة التصريح عن متغير تم تعريفه باستخدام letأو const.

هذا لن يعمل:

let carName = "Volvo";
let carName;

JavaScript الحسابي

كما هو الحال مع الجبر ، يمكنك إجراء العمليات الحسابية باستخدام متغيرات JavaScript ، باستخدام عوامل تشغيل مثل =و +:

مثال

let x = 5 + 2 + 3;

يمكنك أيضًا إضافة سلاسل ، لكن السلاسل ستكون متسلسلة:

مثال

let x = "John" + " " + "Doe";

جرب هذا أيضًا:

مثال

let x = "5" + 2 + 3;

ملحوظة

إذا وضعت رقمًا بين علامتي اقتباس ، فسيتم التعامل مع باقي الأرقام كسلاسل ، ومسلسلة.

جرب هذا الآن:

مثال

let x = 2 + 3 + "5";

JavaScript Dollar Sign $

نظرًا لأن JavaScript يتعامل مع علامة الدولار كحرف ، فإن المعرفات التي تحتوي على $ هي أسماء متغيرات صالحة:

مثال

let $ = "Hello World";
let $$$ = 2;
let $myMoney = 5;

استخدام علامة الدولار ليس شائعًا جدًا في JavaScript ، ولكن غالبًا ما يستخدمها المبرمجون المحترفون كاسم مستعار للوظيفة الرئيسية في مكتبة JavaScript.

في مكتبة JavaScript jQuery ، على سبيل المثال ، $تُستخدم الوظيفة الرئيسية لتحديد عناصر HTML. في jQuery $("p");تعني "حدد كل عناصر p".


الشرطة السفلية لجافا سكريبت (_)

نظرًا لأن JavaScript يتعامل مع الشرطة السفلية كحرف ، فإن المعرفات التي تحتوي على _ هي أسماء متغيرات صالحة:

مثال

let _lastName = "Johnson";
let _x = 2;
let _100 = 5;

استخدام الشرطة السفلية ليس شائعًا جدًا في JavaScript ، ولكن العرف بين المبرمجين المحترفين هو استخدامه كاسم مستعار للمتغيرات "الخاصة (المخفية)".


اختبر نفسك مع التمارين

ممارسه الرياضه:

أنشئ متغيرًا يسمى متغيرًا carNameوقم بتعيين القيمة Volvoله.

var  = "";