دايماً بيبقى عندنا مشكلة في معرفة الـ History بتاع الـ Computer Science، ومع إن ممكن حد يشوفها معلومات نظرية، بس الحقيقة إنها بتفرق جداً في فهم الصورة الكاملة للي إحنا بنعمله النهاردة.

The Birth of the Web (1989 - 1991)

البداية كانت سنة 1989 مع شخص عبقري اسمه Tim Berners-Lee. الراجل ده هو الـ Godfather بتاع الـ Web، وهو اللي بدأ يفكر في فكرة الـ Web أساساً. في أواخر سنة 1990 وبداية 1991، طلع أول الـ Browser في التاريخ وكان اسمه WWW Browser، وده كان سبب تسمية المواقع بـ www لحد النهاردة. “تيم” هو اللي عمل الـ HTML وعمل منظمة الـ W3C المسؤولة عن الـ Standardization للـ HTML والـ CSS.

The Era of Browsers (1993 - 1994)

الـ Web فضل من سنة 91 لسنة 93 من غير صور! لحد ما ظهر الـ Browser اللي اسمه Mosaic سنة 1993، ودا كان أول الـ Browser يقدر يعرض صور جوه الـ Web. بعدها بسنة (1994)، ظهر العملاق Netscape، ودا كان الـ Browser الأكثر استخداماً في العالم لحد سنة 2008 تقريباً، وأغلب الـ Features اللي بنشوفها في الـ Browser حالياً زي Chrome و Firefox هي في الأصل مستوحاة من الـ Netscape.

The Creation of JavaScript (1995)

سنة 1995، شركة Netscape جابت واحد جامد جداً اسمه Brendan Eich (والراجل ده لسه عايش). الـ Netscape طلبوا منه يعمل لغة برمجة تشتغل جوه الـ Browser عشان يقدروا يتعاملوا مع الـ Events والـ Logic، بعيداً عن الـ HTML والـ CSS الـ “Static”. “بريندن” عمل حاجة غريبة جداً؛ قعد 10 أيام بس وطلع لغة البرمجة دي! في الوقت ده كان فيه 3 لغات مشهورين:

  1. الـ Java: أشهر علامة تجارية وقتها.
  2. الـ Scheme.
  3. الـ Self.

الراجل عمل ميكس بينهم، وطلع لغة سماها في الأول Mocha، وبعدين بقت LiveScript.

الـ Brendan Eich in 10 days: بالرغم من إن “بريندن آيك” فعلاً عمل الـ Prototype الأول للغة في 10 أيام، إلا إن اللغة تطورت جداً على مدار السنين من خلال لجان الـ TC39 في منظمة ECMA، ومابقتش مجرد مجهود فردي.

Why the name “JavaScript”?

بسبب العداوة بين شركة Sun Microsystems (صاحبة الـ Java) وبين Microsoft، وبما إن الـ Netscape كمان كانت بتكره Microsoft، عملوا شراكة مع بعض، وادوا العلامة التجارية “Java” للغة الـ LiveScript، ومن هنا بقى اسمها الـ JavaScript. (مع إنها لغة تانية خالص غير الـ Java، بس الاسم كان للتسويق).

The Standards War: JavaScript vs. JScript

لما الـ Netscape عملت الـ JavaScript، شركة Microsoft قلبت الدنيا وعملت لغة تانية سماها JScript وبدأت تحطها في الـ Browser بتاعها (IE). بقى عندنا لغتين مختلفتين، والمبرمجين تاهوا! يشتغلوا بـ JavaScript ولا JScript؟ الخلاف ده قعد من سنة 95 لـ 97، لحد ما راحوا لمنظمة اسمها ECMA في جنيف (المنظمة دي هي اللي عملت الـ Standardization للـ C# كمان).

المنظمة قالت: “لا هنسميها JavaScript ولا JScript، إحنا هنسميها EcmaScript”.

graph TD
    A[Netscape - JavaScript] --> C[ECMA Standardization]
    B[Microsoft - JScript] --> C
    C --> D[EcmaScript - The Official Standard]

JavaScript vs. EcmaScript

الحقيقة إن الـ JavaScript ما اسمهاش JavaScript، اسمها الرسمي EcmaScript.

  • الـ EcmaScript: هو الاسم الرسمي والـ Versions الرسمية (ES1, ES2…).
  • الـ JavaScript: هو الاسم التجاري أو “اسم السوق” اللي المبرمجين متعودين عليه.

لما حد يسألك في انترفيو “إيه الفرق بين الـ JavaScript والـ EcmaScript؟”، الإجابة هي إن الـ EcmaScript هو الـ Standard، والـ JavaScript هي اللغة اللي بتطبق الـ Standard ده.

The Evolution of EcmaScript Versions

  1. الـ ES1 (1997), ES2 (1998), ES3 (1999): الفروقات بينهم كانت بسيطة جداً.
  2. الـ ES4: حصل فيها مشاكل كتير واتسحبت، مفيش نسخة رسمية منها.
  3. الـ ES5 (2009): بدأت تعمل تحسينات بسيطة والـ Browser بدأ يدعمها بشكل كبير.
  4. الـ ES6 (2015): أو اللي بنسميها ES2015. دي كانت الـ “Breaking Point”. النسخة دي قلبت الدنيا وغيرت الـ JavaScript تماماً، لدرجة إن الناس بدأت تحس إنها لغة جديدة.

من أول 2015، بقى بينزل Version جديد كل سنة (ES7, ES8, ES9…). الـ “حوار” كله بدأ من ES6، وعشان كدة في السوق بنقول “JavaScript” على النسخ القديمة، و “EcmaScript” أو “ES6+” على التحديثات الجديدة.

Other Languages in the Ecosystem

في لغات تانية ظهرت عشان تكون بديلة أو “تسهل” الـ JavaScript:

  • الـ CoffeeScript: مكملتش كتير.
  • الـ Dart: طلعتها Google سنة 2012 عشان تكون بديلة للـ JS، بس منجحتش في كدة، وحالياً بتستخدم مع Flutter.
  • الـ TypeScript: طلعتها Microsoft، وهي عبارة عن JavaScript بس بزيادة ميزات قوية جداً (زي الـ Types)، ودي اللي بتستخدم في الـ Angular والـ React حالياً.

إحنا في الكورس هناخد الـ Latest، يعني هنتعلم الـ ES6 وما بعدها، بس الأول لازم نمر على الـ ES3 والـ ES5 عشان نفهم الأساسيات.


Notes

Clarification

  • الـ The “Java” confusion: كتير من المبتدئين بيفتكروا إن الـ Java هي الـ JavaScript. الحقيقة هما زي الفرق بين “الـ Car” و “الـ Carpet”، الاسم متشابه بس الوظيفة والمحرك مختلفين تماماً.
  • الـ ES4 Failure: النسخة دي فشلت لأنها كانت “طموحة” زيادة عن اللزوم وحاولت تغير اللغة بشكل جذري مرة واحدة، فشركات زي Yahoo و Google و Microsoft اختلفوا، وتم إلغاؤها والتركيز على ES5 اللي كانت أهدى بكتير.

Advanced Topics

  • الـ Transpilers (Babel): بما إن الـ Versions الجديدة (ES6+) ممكن متبقاش مدعومة في الـ Browser القديمة، بنستخدم أداة اسمها الـ Babel. دي وظيفتها تحول الكود الـ “Modern” لكود قديم (ES5) عشان يشتغل عند كل الناس.
  • الـ EcmaScript Next: مصطلح بيطلق على أي Feature جديدة لسه تحت الدراسة وموصلتش للـ Standard النهائي.

Relation to .NET

  • الـ JavaScript Interop in Blazor: في الـ .NET، وبالتحديد في الـ Blazor، بنحتاج الـ JavaScript جداً عشان نعمل حاجات الـ C# مبيعرفش يعملها لوحده (زي الـ DOM Manipulation المباشر).