آموزش جاوا اسکریپت

آموزش جاوا اسکریپت

اسلاید 1: بنام خداوند بخشنده ی مهربانآموزش جاوا اسکریپت1

اسلاید 2: 2جاوا اسکریپت یک زبان قدرتمند و رو به رشدی است.اگر به اکثر سایت های بزرگ سر بزنید خواهید دید که برای فرانت اند از جاوا اسکریپت استفاده کرده اند.شما با یادگیری جاوا اسکریپت میتوانید انواع کتابخانه یا framework های آن نظیر react , vue , electron و... را نیز یاد بگیرید که امروزه بازار کار عالی و خوبی دارند.در این آموزش سعی شده مفاهیم به صورت ساده و مفهومی ارائه شده باشد تا مشکلی در یادگیری پیش نیاید.

اسلاید 3: جاوا اسکریپت چیست ؟جاوا اسکریپت زبان برنامه نویسی می باشد که درون کدهای(HTML) قرار می گیرد و بر روی مرورگر بازدید کننده اجرا می شود. جاوا اسکریپت توانایی تغییر در محتویات المانهای نمایش داده شده را بر روی مرورگر فرد بازدید کننده دارد بطوریکه امکان پویا سازی یا دینامیک شدن صفحات بوجود می آید.توانایی های جاوا اسکریپت: توانایی ها و قابلیت های جاوا اسکریپت بسیار متنوع بوده و تنها به موارد که در زیر می آید خلاصه نمی شود. در زیر لیستی از قابلیت های این اسکریپت آورده شده است :امکان تغییر در متون نمایش داده شده در مرورگرامکان تغییر رنگها، رنگ پس زمینه و موقعیت قرار گیری المانهای استفاده شده در طراحی صفحات وبتغییر در مشخصه های المانها و CSS آنهامتحرک سازی، انیمیشن و پویا نماییتعامل با کاربر و از طریق المانهای ورودی نظیرTextbox ها، RadioButton ها، TextArea و غیرهعکس العمل نشان دادن به واکنش های کاربران نظیر تغییر عکسها با حرکت موس روی آنها و ...3

اسلاید 4: مزایای جاوا اسکریپت :دادن پویایی به صفحات استاتیک وب سایت هابرخی از عملیات را نمی توان بدون استفاده از این زبان برنامه نویسی انجام داد. نظیر تعامل با کاربر، یافتن اطلاعات کاربری بازدید کنندگان نظیر IP های آنها و موارد دیگرنزدیک بودن این زبان برنامه نویسی به زبانها برنامه نویسی دیگر نظیر C, C++ و یا C#امکان استفاده از کتابخانه های آماده این زبان برنامه نویسی نظیر کتابخانه های استاندارد ریاضیسادگی در برنامه نویسی و پیاده سازی بدون درگیر شدن با کامپایلرهای پیچیده.معایب جاوا اسکریپت :کند بودن در زمان اجرا بدلیل عدم کامپایل شدن کدها.دیباگ کردن آن بسیار مشکل است.بر روی مرورگر اجرا می شود در نتیجه هیچگونه امکانی برای مبادله با سرور سایت را ندارد.4

اسلاید 5: برای اینکه بتوانیم برنامه های خود را بنویسیم به یک Code Editor نیاز داریم. که چند مورد از آن ها را معرفی میکنم.1 – Atom2 – Sublime3 – Visual Studio Codeبرای دانلود هر یک میتوانید بروی آن کلیک کنید.نکته : آموزش ما با Visual Studio Code خواهد. لذا برای جلوگیری از بروز مشکل ترجیحا از این Editor استفاده نمایید.5

اسلاید 6: 6آماده سازی محیط برای کدنویسی :1 – ابتدا یک پوشه (Folder) در یک مسیر دلخواه ایجاد میکنید.2 – سپس برنامه Visual Studio Code را بازکرده و از تب File گزینه Open Folder را انتخاب کرده و پوشه ساخته شده در مرحله 1 را انتخاب و Ok میکنیم.3 – حال برای راحتی کار نام Extension های موجود در تصویر را در قسمت Serach… جستجو کرده و آن ها را نصب میکنیم.

اسلاید 7: 7شروع کد نویسی اولین برنامه :1 – از سمت راست Explorer را انتخاب میکنیم.2 – پوشه خود را انتخاب کرده و گزینه New File رو میزنیم.3 – یک نام دلخواه برای برنامه انتخاب کنید با پسوند htmlحال برنامه برای کدنویسی آمده است.

اسلاید 8: 8با نوشتن html و با کمک Extension هایی که نصب کرده ایم چند گزینه میاره واسمون که ما html:5 رو انتخاب میکنیم که ورژن 5 html هست.با انتخاب html:5 کدهای آمده و پیشفرض html رو به این صورت میاره واسمون.

اسلاید 9: 9حال همه چیز مهیاست برای کدنویسی با این زبان قدرتمند و دوست داشتنی جاوا اسکریپتامیدوارم تا اینجای آموزش لذت برده باشید و خودتون رو واسه یه دنیای پر هیجان آماده کرده باشید.کد های جاوا اسکریپت درون تگ های <script></script> نوشته میشوند.ما به دو روش میتوانیم script های خودمان را بنویسیم.روش اول:به اینصورت هست که script ها رو در پایین همین صفحه html بنویسیم که این روش اصلا توصیه نمیشود و حرفه ای نیست.نکته : از علامت // برای توضیح نویسی یا به اصطلاح Comment استفاده میشود. بدین معنی که کدهایی که در مقابل // نوشته میشوند اجرا نمیشوند

اسلاید 10: 10روش دوم : به اینصورت هست که ما کدهایمان در یک فایل جداگانه مینویسیم و به صفحه ی html خود وصل میکنیم.1 – گزینه new folder رو انتخاب کرده و یک پوشه جدید با نام دلخواه ایجاد میکنیم.2- داخل پوشه یک new file ایجاد میکنیم و یک نام با پسوند js برایش انتخاب میکنیم.

اسلاید 11: 11حال باید این فایل js رو به فایل html خود وصل کنیم.اکنون ما کدهای خودمان را درون فایل Main.js نوشته و اجرا خواهیم کرد.