آموزش جاوا اسکریپت از مقدماتی تا پیشرفته + پروژه های عملی
در دوره آموزش کامل HTML و HTML5 ما یاد گرفتیم که چجوری ساختار یک صفحه وب رو تشکیل بدیم و همچنین در دوره آموزش کامل CSS و CSS3 هم یاد گرفتیم که چجوری به صفحه وب خودمون جان ببخشیم و آن را استایل دهی کنیم اما این صفحه وب ما باز هم از یک لحاظ کامل نبود ، از لحاظ اینکه صفحه وب ما کاملا استاتیک و ثابت بود و هیچ منطق یا کنش و واکنشی نداشت ، برای اینکه ما بتونیم صفحه وب خودمون رو کامل تر کنیم نیاز داریم تا این صفحه وب استاتیک و ثابت رو به یک صفحه داینامیک و پویا تبدیل کنیم و بعد از ایجاد ساختار و استایل دهی آن ، رفتار آن را کنترل کنیم که اینکار رو با کمک زبان برنامه نویسی قدرتمند جاوا اسکریپت و آموزش جاوا اسکریپت انجام خواهیم داد.توصیه میشود ( دوره آموزشی طراحی سایت ) را نیز مشاهده کنید
Javascript چیست؟
Javascript یکی از پر طرفدار ترین و کاربردی ترین زبان های برنامه نویسی است. این زبان برنامه نویسی چند رویه ، پویا، شی گرا است و جزو زبان های سطح بالا یا اصطلاحا فرست کلاس محسوب می شود. دلیل پر طرفدار بودن این زبان، کاربری ساده آن است که باعث شده بسیاری از افراد مبتدی نیز به راحتی از آن استفاده کنند.
جاوا اسکریپت را با عنوان زبان برنامه نویسی برای وب می شناسند، اما به جز مرورگر ها در محیط های دیگر نیز از آن استفاده می شود؛ مانند node.js و Apache CouchD. جاوا اسکریپت زبان برنامه نویسی شی گرا است که معمولا برای ایجاد جلوه های تعاملی در مرورگرهای وب استفاده می شود. نمونه های پرکابرد از این جلوه ها شامل به روز رسانی محتوای به موقع، نقشه های تعاملی، گرافیک متحرک ۲D / 3D و غیره است.
جاوا اسکریپت یک زبان کاملا جمع و جور و در عین حال خیلی انعطاف پذیر است. توسعه دهندگان، انواع گوناگونی از ابزار ها را روی زبان اصلی جاوا اسکریپت نوشته اند و تعداد زیادی از قابلیت های اضافی را روی آن پیاده کرده اند.
همچنین جاوا اسکریپت صفحات وب را از حالت ساده استاتیک به حالت داینامیک و رفتاری تبدیل میکند.
پیش نمایش دوره آموزش جاوا اسکریپت :
برای مشاهده ادامه این دوره آموزشی فهرست دورس را مشاهده کنید.
چند مثال ساده برای مفهوم استایتک و داینامیک :
فرض کنید شما در صفحه وب خودتون بخواهید یک دکمه قرار دهید که کاربر وقتی بر روی این دکمه کلیک می کند یک اتفاقی بیافتد مثلا یک پیغام برای کاربر نمایش داده شود
یا مثلا یک Input را در صفحه قرار دهید که کاربر اگر مقدار درست را در Input وارد کرد پیغام درستی را به کاربر نمایش دهد و در غیر این صورت پیغام مناسب دیگری را نشان دهد
و یا اینکه بخواهید کاربر با کلیک بر روی یک دکمه ، یک قسمت از صفحه حذف یا یک المنتی به صفحه اضافه شود
همچین کارهایی با استفاده از HTML و CSS قابل انجام نیست چون این زبان ها فقط میتوانند یک صفحه ثابت و استاتیک رو ایجاد کنند و برای انجام این کارها که در صفحه یک رفتاری رخ میدهد باید از جاوا اسکریپت استفاده کرد و صفحه را به یک صفحه داینامیک تبدیل کرد که در دوره آموزش جاوا اسکریپت به صورت مکرر این مباحث رو انجام خواهیم داد.
چرا باید جاوا اسکریپت یاد بگیریم؟
میتونیم اینطوری بگیم که پایه و اساس ورود به دنیای برنامه نویسی تحت وب جاوا اسکریپت است. یکی از مزایای بسیار عالی زبان جاوا اسکریپت وجود کتابخانه ها و فریم ورک های بسیار متنوع آن است که به عنوان یکی از مشهورترین فریم ورک های این زبان میتوانیم به Jquery اشاره کنیم.
فریم ورک ها یا کتابخانه های جاوا اسکریپت باعث میشوند تا کدنویسی این زبان راحت تر و سریع تر شود اما شاید سوال براتون پیش بیاد که اگر کار با فریم ورک های این زبان راحت تر است پس چرا باید جاوا اسکریپت یاد بگیریم؟ همون طور که گفتیم جاوا اسکریپت پایه و اساس برنامه نویسی وب است و تمامی فریم ورک هایی که برای این زبان وجود دارد از این زبان نشات گرفته شده اند و طبیعتا اگر ما بخوایم بدون یادگیری این زبان وارد فریم ورک های آن بشیم مطمئنا یادگیری آن ها برای ما بسیار دشوار و گیج کننده خواهد شد.
و اما نقطه قوت دیگر جاوا اسکریپت این است که با توسعه داده شدن فریم ورک های این زبان ، شما میتوانید علاوه بر برنامه نویسی سمت کاربر یا همان Client Side ، برنامه نویسی سمت سرور یا Server Side رو هم انجام بدید و یا حتی فراتر از این ، شما میتوانید با فریم ورک های این زبان، اپلیکیشن های موبایل مانند سیستم عامل های IOS و Android رو هم پیاده سازی کنید.
از مشهور ترین ابزار ها و فریم ورک های این زبان میتوان به موارد زیر اشاره کرد :
- فریم ورک ReactJS که توسط شرکت فیس بوک توسعه داده شده و بسیاری از سایت های بزرگ با آن پیاده سازی شده اند.
- فریم ورک AngularJS که توسط شرکت گوگل توسعه داده شده است و بسیاری از سایت های مشهور از آن استفاده میکنند.
- فریم ورک React Native که محصول دیگری از شرکت فیس بوک است ، امکان تولید اپلیکیشن های موبایل مانند IOS و Android را بر پایه زبان جاوا اسکریپت فراهم میکند ، یکی از اپلیکیشن های بسیار قدرتمند که با این فریم ورک پیاده سازی شده است ، اپلیکیشن اینستاگرام است.
- پلتفرم NodeJS که میتوانیم با استفاده از آن کدهای جاوا اسکریپت را در سمت سرور اجرا کنیم.
خب میبینید که دنیای برنامه نویسی این زبان یعنی جاوا اسکریپت بسیار گسترده و وسیع است و شما با یادگیری این زبان ، قدم ورود به این دنیای بزرگ رو برمیدارید.
جزئیات مباحثی که در این دوره مطرح خواهد شد:
آموزش جاوا اسکریپت از مقدماتی تا پیشرفته
درس اول : مقدمات کار با جاوا اسکریپت
- نحوه صحیح قرار دادن کدهای جاوا اسکریپت
- آشنایی با متد alert
درس دوم : خروجی ها در جاوا اسکریپت
- انتخاب یک المنت HTML بر اساس id
- آشنایی با خروجی innerHTML
- آشنایی با خروجی innerText
- آشنایی با خروجی textContent
- آشنایی با خروجی outerHTML
- آشنایی با خروجی document.write
- آشنایی با خروجی console.log
درس سوم : متغیرها و انواع داده ای در جاوا اسکریپت
- آشنایی با متد typeof
- قوانین نام گذاری متغیرها
- آشنایی با انواع داده ای در جاوا اسکریپت
درس چهارم : عملگرها در جاوا اسکریپت
- عملگرهای ریاضیاتی
- عملگرهای انتسابی
- عملگرهای مقایسه ای
- عملگر شرطی
- عملگرهای منطقی
- نحوه تعریف یک الگو یا عبارت با قاعده
- آشنایی با متد test
- آشنایی با Metacharacters
- کار با متد call
- کار با متد Apply
ویژگی های دوره
- تعداد جلسات 44
- امتحانات 0
- مدت 15 ساعت و 30 دقیقه
- سطح مهارت مقدماتی تا پیشرفته
- زبان فارسی
- دانشجویان 648
- ارزیابی ها بله
-
پیش نمایش و فایل های دانلودی دوره
-
آموزش جاوا اسکریپت از مقدماتی تا پیشرفته
- مقدمات کار با جاوا اسکریپت
- خروجی ها در جاوا اسکریپت
- متغیرها و انواع داده ای در جاوا اسکریپت
- عملگرها در جاوا اسکریپت
- توابع در جاوا اسکریپت
- شی یا object در جاوا اسکریپت
- حوزه تعریف متغیرها و hoisting در جاوا اسکریپت
- رشته ها و متدهای آن در جاوا اسکریپت
- شی Math و متدهای آن در جاوا اسکریپت
- تاریخ و زمان و متدهای آن در جاوا اسکریپت
- دستورات شرطی if و switch در جاوا اسکریپت
- حلقه ها در جاوا اسکریپت
- آرایه ها در جاوا اسکریپت
- متدهای آرایه در جاوا اسکریپت
- عبارات با قاعده در جاوا اسکریپت – بخش اول
- عبارات با قاعده در جاوا اسکریپت – بخش دوم
- خطایابی و مدیریت خطا در جاوا اسکریپت – بخش اول
- خطایابی و مدیریت خطا در جاوا اسکریپت – بخش دوم
- مباحث تکمیلی نوع داده ای و اعداد در جاوا اسکریپت
- شی گرایی در جاوا اسکریپت
- متدهای Call و Apply در جاوا اسکریپت
- آشنایی با مدل DOM و سلکتورهای آن در جاوا اسکریپت
- کار با Attribute المنت های HTML در جاوا اسکریپت
- دسترسی به المنت ها به روش Object Collection در جاوا اسکریپت
- رویدادها در جاوا اسکریپت – بخش اول
- رویدادها در جاوا اسکریپت – بخش دوم
- کنترل رویدادها به روش EventListener در جاوا اسکریپت
- متدهای زمانی یا انیمیشن ها در جاوا اسکریپت
- پیمایش گره ها در جاوا اسکریپت
- حذف و اضافه کردن گره ها در جاوا اسکریپت
- آشنایی با مدل BOM و متدهای آن در جاوا اسکریپت
- شی Location در جاوا اسکریپت
- کوکی ها در جاوا اسکریپت
- آشنایی با Ajax در جاوا اسکریپت
- پروژه اعتبار سنجی فرم در جاوا اسکریپت
- پروژه Smooth Scrolling در جاوا اسکریپت
- پروژه Sidenav و Loading در جاوا اسکریپت
- پروژه ساخت یک Accordion در جاوا اسکریپت
- پروژه ساخت Scroller Slider در جاوا اسکریپت
- پروژه ساخت Navigation Tab در جاوا اسکریپت
- پروژه ساخت Slider در جاوا اسکریپت
- دو زبانه کردن سایت با جاوا اسکریپت
-
محمدحسین
عالی
بهترین و کامل ترین آموزشی بود که دیدم. منمون از سایت خوبتون !
-
pooriagg2
عالی
بسیار جامع و کامل
-
Javkak
عالی
خیلی عالی بود ممنون
-
s amir mahdi
بهترین آموزش
سلام . واقعاً این آموزش کامل و عالیه . من واقعاً بابت این آموزش از آقای مصطفی زاده متشکرم . این دوره آموزش خیلی کامله و خیلی هم توضیح روان و خوبی داره .من دوره های مختلفی رو نگاه کردم و بابتشون هزینه های زیادی دادم ولی این آموزش هم قیمت خوبی داره و به نظر من این بهترین آموزشه .
-
Behnam Coding
عالی..
با سلام، دوره بسیار خوب و با کیفیتی بود من خیلی راضی بودم از دوره.. فقط یه چند تا از بحث های کاربردی جاوااسکریپت گفته نشد مثل popup box در هر صورت ممنون از دوره بسیار خوبتون
315 دیدگاه
سلام استاد خسته نباشید.
استاد من برای یه تگ p یه اسکریپتی نوشتم و مشکلی هم نداره و فعاله ولی وقتی با استفاده از php اون تگ p تکرار می شه بقیه غیر از اولی کار نمی کنه؟! می شه راهنمایی کنید لطفا.
مرسی.
سلام
اسکریپتی که نوشتید باید همه تگ های p رو انتخاب کنید ، احتمالا شما فقط تگ p ابتدایی رو انتخاب کردید
بله استاد متوجه شدم مرسی از پاسخگوییتون.
موفق باشین.
سلام استاد. وقت بخیر
من از سایت های آموزشی دیگه شنیدم که برای طراحی سایت لازم نیست جاوا اسکریپت رو به صورت تخصصی و عمیق یاد بگیریم چون اولاً نیاز نیست دوماً این زبان پیچیدگی داره و ممکنه خستمون کنه.
آیا این مطلب درسته؟
سلام و درود
خیر دوست عزیز درست نیست ، شما پایه و اساس جاوا اسکریپ رو به خود زبان جاوا اسکریپت یاد میگیرید و اگر بخواید بدون یادگیری جاوا اسکریپت وارد فریم ورک های دیگه بشید احتمالا بعضی از مباحث برای شما گنگ خواهد بود
با سلام و عرض ادب ،
ببخشید،تخفیف ها چه مواقعی فعال میشود؟
سلام و درود
تخفیف دوره ها به تازگی برداشته شدن و فعلا زمان تمدید مجدد تخفیف مشخص نیست متاسفانه
خیلی ممنون از پاسخ گویی شما*
سلام جناب مصطفی زاده خداقوت، نیاز من es6 هست میشه این دوره شماره یاد بگیرم و بعدش فقط یه دوره es6؟ دوباره کاری و وقت زیادی نمیبره؟ البته تکرار و مرور کردنم به صورت کلی بد نیست. در کل ممنون میشم راهنمایی کنید
سلام و درود
مباحث es6 بسیار راحت و کم هستن و در حد آپدیت چندین متد هست که میتونید یاد بگیرید
سلام مجدد
میبخشین استاد این دوره آموزشی چه سالی تهیه شده یعنی آخرین بروزرسانی بر طبق Es چنده؟
سلام
تقریبا سال 97 – 98
استاد سلام …یه سوال در jجاوا اسکریپت ما var داریم و const و let داریم…که اشاره ای نشده در این اموزش …ایا این ربطی به ورژن جدید جاوااسکریپت میشه یا این مسائل مسائل کوچیکین که ما خودمون دیگه باید پیگیری کنیم…مرسی از اموزش فوق العادتون..ارادتمند
ممنون میشم پاسخمو بدید استاد
پاسخ داده شده خدمتتون
بله مربوط به مباحث جدید جاوا اسکریپت میشه و مباحث خیلی جزئی هستن که حتی با سرچ هم میتونید یاد بگیرید
سلام اقای کریم مصطفی زاده خسته نباشید من یک سوال داشتم چطوری میتونیم به سایتی که با جاوا اسکریپت طراحی کردیم یک لینک بدیم یعنی لینک سایت خودمونو تغییر بدیم مثلا چطوری با سرچ amuzeshtak.com تو گوگل سایت شما باز میشه ما چطوری میتونیم یک لینک تعریف کنیم که با سرچ اون سایتی که ما طراحی کردیم باز بشه؟
سلام
نیاز با کار خاصی نیست شما بعد اینکه سایتتون توی گوگل بالا اومد با کلیک روش سایت شما باز میشه
سلام استاد. ببخشید چگونه می توان عرض و ارتفاع یک تگ p را در جاوا اسکریپت به صورت دقیق بدست آورد؟
سلام محمد حسین عزیز
توی دوره این مورد رو گفتیم با خاصیت های offsetWidth offsetHeight
سلام استاد لطفا 1 یا 2 پروژه شی گرایی در جاوا اسکریپت به این دوره اضافه کنید.
با تشکر
درود بر استاد عزیز
استاد جان میشه کم کم شروع کنید به ضبط و انتشار بروزرسانی دوره؟
حداقل تا عید چندتا بروزرسانی داشته باشید
ممنونم
فرصت بشه چشم
سلام استاد عزیز خسته نباشید
یه پیشنهاد داشتم میشه این دوره رو بروزرسانی کنید و مباحث پاپ اپ باکس و فنسی باکس و اگه میشه API و سبد خرید هم بگید ممنونم استاد
سلام و درود
بله حتما سر فرصت اینکارو انجام میدیم