|
49 | 49 | تعتمد قدرات جافا سكريبت بشكل كبير على البيئة التي تعمل بها. على سبيل المثال ، يدعم [نود.جي إس](https://ar.wikipedia.org/wiki/نود.جي_إس) |
50 | 50 | الوظائف التي تسمح لجافا سكريبت بقراءة / كتابة ملفات عشوائية ، وتنفيذ طلبات الشبكة، إلخ. |
51 | 51 |
|
| 52 | +<<<<<<< HEAD |
52 | 53 | يمكن لجافا سكريبت في المتصفح القيام بكل ما يتعلق بمعالجة صفحات الويب والتفاعل مع المستخدم وخادم الويب. |
53 | 54 |
|
54 | 55 | على سبيل المثال ، يمكن لجافا سكريبت في المتصفح: |
| 56 | +======= |
| 57 | +- [V8](https://en.wikipedia.org/wiki/V8_(JavaScript_engine)) -- in Chrome, Opera and Edge. |
| 58 | +- [SpiderMonkey](https://en.wikipedia.org/wiki/SpiderMonkey) -- in Firefox. |
| 59 | +- ...There are other codenames like "Chakra" for IE, "JavaScriptCore", "Nitro" and "SquirrelFish" for Safari, etc. |
| 60 | + |
| 61 | +The terms above are good to remember because they are used in developer articles on the internet. We'll use them too. For instance, if "a feature X is supported by V8", then it probably works in Chrome, Opera and Edge. |
| 62 | +>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf |
55 | 63 |
|
56 | 64 | - إضافة HTML جديد إلى الصفحة ، وتغيير المحتوى الحالي ، وتعديل التصاميم. |
57 | 65 | - الرد على تفاعلات المستخدم ، والتشغيل على نقرات الفأرة ، وحركات المؤشر ، والضغط على المفاتيح. |
|
61 | 69 |
|
62 | 70 | ## ما الذي لا يمكن لجافا سكريبت في المتصفح فعله؟ |
63 | 71 |
|
| 72 | +<<<<<<< HEAD |
64 | 73 | إمكانيات جافا سكريبت في المتصفح محدودة من أجل سلامة المستخدم. الهدف هو منع صفحة ويب شريرة من الوصول إلى المعلومات الخاصة أو الإضرار ببيانات المستخدم. |
| 74 | +======= |
| 75 | +1. The engine (embedded if it's a browser) reads ("parses") the script. |
| 76 | +2. Then it converts ("compiles") the script to machine code. |
| 77 | +3. And then the machine code runs, pretty fast. |
| 78 | +>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf |
65 | 79 |
|
66 | 80 | من أمثلة هذه القيود: |
67 | 81 |
|
68 | 82 | - جافا سكريبت على صفحة الويب قد لا تقرأ/تكتب ملفات عشوائية على القرص الصلب أو تنسخها أو تنفذ برامج. ليس لديها وصول مباشر إلى وظائف نظام التشغيل. |
69 | 83 |
|
| 84 | +<<<<<<< HEAD |
70 | 85 | تسمح المتصفحات الحديثة له بالعمل مع الملفات ، ولكن الوصول محدود ويتم توفيره فقط إذا قام المستخدم بإجراءات معينة ، مثل "إسقاط" ملف في نافذة المتصفح أو تحديده عبر علامة `<input>`. |
| 86 | +======= |
| 87 | +Modern JavaScript is a "safe" programming language. It does not provide low-level access to memory or the CPU, because it was initially created for browsers which do not require it. |
| 88 | +>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf |
71 | 89 |
|
72 | 90 | هناك طرق للتفاعل مع الكاميرا / الميكروفون والأجهزة الأخرى ، لكنها تتطلب إذنًا صريحًا من المستخدم. لذلك قد لا تعمل الصفحة التي تم تمكين جافا سكريبت فيها بشكل خفي على تمكين كاميرا الويب ومراقبة المناطق المحيطة وإرسال المعلومات إلى [آن آس أيه](https://ar.wikipedia.org/wiki/وكالة_الأمن_القومي_الأمريكية) |
73 | 91 | -بشكل عام لا تعرف علامات التبويب / النوافذ المختلفة حول بعضها البعض. في بعض الأحيان يفعلون ذلك، على سبيل المثال عندما تستخدم إحدى النوافذ جافا سكريبت لفتح النافذة الأخرى. ولكن حتى في هذه الحالة ، قد لا تتمكن جافا سكريبت في إحدى الصفحات من الوصول إلى الصفحة الأخرى إذا كانت تأتي من مواقع مختلفة (من مجال أو بروتوكول أو منفذ مختلف). |
74 | 92 |
|
| 93 | +<<<<<<< HEAD |
75 | 94 | وهذا ما يسمى "سياسة المصدر الأوحد". للتغلب على ذلك ، يجب أن توافق *الصفحتان* على تبادل البيانات وتحتوي على كود جافا سكريبت خاص يتعامل معه. سنغطي ذلك في البرنامج التعليمي. |
76 | 95 |
|
77 | 96 | هذا القيد ، مرة أخرى ، لسلامة المستخدم. يجب ألا تتمكن صفحة من `http://anysite.com` فتحها المستخدم من الوصول إلى نافذة متصفح أخرى بعنوان `http://gmail.com` وسرقة المعلومات من هناك. |
|
80 | 99 |  |
81 | 100 |
|
82 | 101 | لا توجد مثل هذه الحدود إذا تم استخدام جافا سكريبت خارج المتصفح ، على سبيل المثال على الخادم. تسمح المتصفحات الحديثة أيضًا الإضافات التي قد تطلب تصريحات ممتدة. |
| 102 | +======= |
| 103 | +In-browser JavaScript can do everything related to webpage manipulation, interaction with the user, and the webserver. |
| 104 | + |
| 105 | +For instance, in-browser JavaScript is able to: |
| 106 | + |
| 107 | +- Add new HTML to the page, change the existing content, modify styles. |
| 108 | +- React to user actions, run on mouse clicks, pointer movements, key presses. |
| 109 | +- Send requests over the network to remote servers, download and upload files (so-called [AJAX](https://en.wikipedia.org/wiki/Ajax_(programming)) and [COMET](https://en.wikipedia.org/wiki/Comet_(programming)) technologies). |
| 110 | +- Get and set cookies, ask questions to the visitor, show messages. |
| 111 | +- Remember the data on the client-side ("local storage"). |
| 112 | + |
| 113 | +## What CAN'T in-browser JavaScript do? |
| 114 | + |
| 115 | +JavaScript's abilities in the browser are limited to protect the user's safety. The aim is to prevent an evil webpage from accessing private information or harming the user's data. |
| 116 | + |
| 117 | +Examples of such restrictions include: |
| 118 | + |
| 119 | +- JavaScript on a webpage may not read/write arbitrary files on the hard disk, copy them or execute programs. It has no direct access to OS functions. |
| 120 | + |
| 121 | + Modern browsers allow it to work with files, but the access is limited and only provided if the user does certain actions, like "dropping" a file into a browser window or selecting it via an `<input>` tag. |
| 122 | + |
| 123 | + There are ways to interact with the camera/microphone and other devices, but they require a user's explicit permission. So a JavaScript-enabled page may not sneakily enable a web-camera, observe the surroundings and send the information to the [NSA](https://en.wikipedia.org/wiki/National_Security_Agency). |
| 124 | +- Different tabs/windows generally do not know about each other. Sometimes they do, for example when one window uses JavaScript to open the other one. But even in this case, JavaScript from one page may not access the other page if they come from different sites (from a different domain, protocol or port). |
| 125 | + |
| 126 | + This is called the "Same Origin Policy". To work around that, *both pages* must agree for data exchange and must contain special JavaScript code that handles it. We'll cover that in the tutorial. |
| 127 | + |
| 128 | + This limitation is, again, for the user's safety. A page from `http://anysite.com` which a user has opened must not be able to access another browser tab with the URL `http://gmail.com`, for example, and steal information from there. |
| 129 | +- JavaScript can easily communicate over the net to the server where the current page came from. But its ability to receive data from other sites/domains is severely limited. Though possible, it requires explicit agreement (expressed in HTTP headers) from the remote side. Once again, that's a safety limitation. |
| 130 | + |
| 131 | + |
| 132 | + |
| 133 | +Such limitations do not exist if JavaScript is used outside of the browser, for example on a server. Modern browsers also allow plugins/extensions which may ask for extended permissions. |
| 134 | +>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf |
83 | 135 |
|
84 | 136 | ## ما الذي يجعل جافا سكريبت فريدًا؟ |
85 | 137 |
|
86 | 138 | هناك على الأقل *ثلاثة* أشياء رائعة حول جافا سكريبت: |
87 | 139 |
|
88 | 140 | ```compare |
| 141 | +<<<<<<< HEAD |
89 | 142 | + تكامل تام مع HTML / CSS. |
90 | 143 | + الأشياء البسيطة تتم ببساطة. |
91 | 144 | + مدعوم من قبل جميع المتصفحات الرائدة وتمكينه تلقائيا. |
| 145 | +======= |
| 146 | ++ Full integration with HTML/CSS. |
| 147 | ++ Simple things are done simply. |
| 148 | ++ Supported by all major browsers and enabled by default. |
| 149 | +>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf |
92 | 150 | ``` |
93 | 151 |
|
94 | 152 | جافا سكريبت هي تقنية المتصفح الوحيدة التي تجمع بين هذه الأشياء الثلاثة. |
95 | 153 |
|
| 154 | +<<<<<<< HEAD |
96 | 155 | هذا ما يجعل جافا سكريبت فريدًا. هذا هو السبب في أنها الأداة الأكثر انتشارًا لإنشاء واجهات المتصفح. |
| 156 | +======= |
| 157 | +That said, JavaScript can be used to create servers, mobile applications, etc. |
| 158 | +>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf |
97 | 159 |
|
98 | 160 | ومع ذلك، تسمح جافا سكريبت أيضًا بإنشاء خوادم وتطبيقات الجوال، إلخ. |
99 | 161 |
|
100 | 162 | ## لغات "فوق" جافا سكريبت |
101 | 163 |
|
102 | 164 | لا تتناسب القواعد اللغوية لجافا سكريبت مع احتياجات الجميع. الناس المختلفون يريدون ميزات مختلفة. |
103 | 165 |
|
| 166 | +<<<<<<< HEAD |
104 | 167 | هذا أمر متوقع ، لأن المشاريع والمتطلبات تختلف من شخص لآخر. |
| 168 | +======= |
| 169 | +So, recently a plethora of new languages appeared, which are *transpiled* (converted) to JavaScript before they run in the browser. |
| 170 | +>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf |
105 | 171 |
|
106 | 172 | ظهرت في الآونة الأخيرة عدد كبير من اللغات الجديدة ، والتي *تم تحويلها* إلى جافا سكريبت قبل تشغيلها في المتصفح. |
107 | 173 |
|
108 | 174 | الأدوات الحديثة تجعل الترجمة سريعة وشفافة للغاية ، مما يسمح للمطورين في الواقع بالتشفير بلغة أخرى وتحويلها تلقائيًا "خلف الكواليس". |
109 | 175 |
|
| 176 | +<<<<<<< HEAD |
110 | 177 | أمثلة على هذه اللغات: |
111 | 178 |
|
112 | 179 | - [كوفي سكريبت](http://coffeescript.org/) هو "سكر نحوي" لجافا سكريبت. إنه يقدم بناء جمل أقصر ، مما يسمح لنا بكتابة كود أكثر وضوحًا ودقة. عادة ،مطورو روبي يحبونها. |
|
115 | 182 | - [دارت](https://www.dartlang.org/) هي لغة قائمة بذاتها لها محركها الخاص الذي يعمل في بيئات غير المتصفح (مثل تطبيقات الهاتف المحمول) ، ولكن يمكن أيضًا تحويلها إلى جافا سكريبت. من تطوير جوجل. |
116 | 183 | - [بريثون](https://brython.info/) هو محول من بايثون إلى جافا سكريبت و الذي يمكّن من كتابة التطبيقات بلغة بايثون بشكل كامل بدون جافا سكريبت. |
117 | 184 | - [كوتلن](https://kotlinlang.org/docs/reference/js-overview.html) هي لغة برمجة حديثة وموجزة وآمنة يمكنها استهداف المتصفح أو نود. |
| 185 | +======= |
| 186 | +- [CoffeeScript](https://coffeescript.org/) is "syntactic sugar" for JavaScript. It introduces shorter syntax, allowing us to write clearer and more precise code. Usually, Ruby devs like it. |
| 187 | +- [TypeScript](https://www.typescriptlang.org/) is concentrated on adding "strict data typing" to simplify the development and support of complex systems. It is developed by Microsoft. |
| 188 | +- [Flow](https://flow.org/) also adds data typing, but in a different way. Developed by Facebook. |
| 189 | +- [Dart](https://www.dartlang.org/) is a standalone language that has its own engine that runs in non-browser environments (like mobile apps), but also can be transpiled to JavaScript. Developed by Google. |
| 190 | +- [Brython](https://brython.info/) is a Python transpiler to JavaScript that enables the writing of applications in pure Python without JavaScript. |
| 191 | +- [Kotlin](https://kotlinlang.org/docs/reference/js-overview.html) is a modern, concise and safe programming language that can target the browser or Node. |
| 192 | + |
| 193 | +There are more. Of course, even if we use one of these transpiled languages, we should also know JavaScript to really understand what we're doing. |
| 194 | +>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf |
118 | 195 |
|
119 | 196 | هناك أكثر. بالطبع ، حتى لو استخدمنا إحدى اللغات المترجمة ، يجب أن نعرف أيضًا جافا سكريبت لفهم ما نقوم به حقًا. |
120 | 197 |
|
| 198 | +<<<<<<< HEAD |
121 | 199 | ## ملخص |
122 | 200 |
|
123 | 201 | - تم إنشاء جافا سكريبت في البداية كلغة للمتصفح فقط ، ولكنها تُستخدم الآن في العديد من البيئات الأخرى أيضًا. |
124 | 202 | - تتمتع جافا سكريبت اليوم بمكانة فريدة باعتبارها لغة المتصفح الأكثر استخدامًا مع تكاملها التام مع HTML / CSS. |
125 | | -- هناك العديد من اللغات التي يتم "تحويلها" إلى جافا سكريبت وتوفر ميزات معينة. يوصى بإلقاء نظرة عليهم ، على الأقل لفترة وجيزة ، بعد إتقان جافا سكريبت. |
| 203 | +- هناك العديد من اللغات التي يتم "تحويلها" إلى جافا سكريبت وتوفر ميزات معينة. يوصى بإلقاء نظرة عليهم ، على الأقل لفترة وجيزة ، بعد إتقان جافا سكريبت. |
| 204 | +======= |
| 205 | +- JavaScript was initially created as a browser-only language, but it is now used in many other environments as well. |
| 206 | +- Today, JavaScript has a unique position as the most widely-adopted browser language, fully integrated with HTML/CSS. |
| 207 | +- There are many languages that get "transpiled" to JavaScript and provide certain features. It is recommended to take a look at them, at least briefly, after mastering JavaScript. |
| 208 | +>>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf |
0 commit comments