مرورگر شما از این ویدیو پشتیبانی نمی کند.
نکته:
آخرین آپدیت رو دریافت میکنید حتی اگر این محتوا بروز نباشد.
نمونه ویدیوها:
(صرفا برای مشاهده نمونه ویدیو، ممکن هست نیاز به شکن داشته باشید.)
بارگزاری مجدد
توضیحات دوره:
جاوا اسکریپت مدرن از ابتدا - تا سطح متخصص JS! منبع جاوا اسکریپت ضروری در سال 2023. جاوا اسکریپت را از ابتدا و با جزئیات کامل بیاموزید - از مبتدی تا پیشرفته همه ویژگی ها و مفاهیم اصلی که در توسعه جاوا اسکریپت مدرن باید بدانید همه چیزهایی که برای تبدیل شدن به یک متخصص جاوا اسکریپت و درخواست برای پروژه جاوا اسکریپت نیاز دارید- یادگیری هدایت شده با مثال های فراوان همه چیز در مورد متغیرها، توابع، اشیا و آرایه ها برنامه نویسی شی گرا بررسی عمیق در نمونه های اولیه، موتورهای جاوا اسکریپت و نحوه عملکرد آن در پشت صحنه دستکاری صفحات وب (= DOM) با مدیریت رویداد جاوا اسکریپت، کدگذاری ناهمزمان و Http درخواستها برنامهنویسی متا، بهینهسازی عملکرد، از بین بردن نشت حافظه، تست، امنیت و استقرار و موارد دیگر! پیش نیازها: نیازی به دانش قبلی جاوا اسکریپت نیست دانش اولیه توسعه وب توصیه می شود درک اولیه HTML و CSS کمک می کند اما لازم نیست به جامع ترین و عمیق ترین دوره آموزشی جاوا اسکریپت در Udemy بپیوندید و جاوا اسکریپت را از ابتدا با جزئیات کامل با این دوره پرفروش یاد بگیرید!
جاوا اسکریپت مهمترین زبان برنامه نویسی است که شما به عنوان یک توسعه دهنده وب باید یاد بگیرید - و با این دوره مطمئن می شوید که هیچ چیزی را که به عنوان یک توسعه دهنده جاوا اسکریپت باید بدانید را از دست نخواهید داد!
این جامعترین و مدرنترین دورهای است که میتوانید در جاوا اسکریپت بیابید - بر اساس دانش و تجربه آموزشی من در زمینه جاوا اسکریپت است. این هم یک راهنمای کامل است که با اصول اولیه زبان شروع میشود و هم یک مرجع گسترده از زبان و محیط جاوا اسکریپت است که تضمین میکند هم تازهواردها و هم توسعهدهندگان با تجربه جاوا اسکریپت از این دوره بهرههای زیادی میبرند!
این یک دوره آموزشی بزرگ است زیرا مملو از دانش مهم و محتوای مفید است. از مبانی اصلی، بیش از مفاهیم پیشرفته و تخصص های جاوا اسکریپت، تا موضوعات تخصصی مانند بهینه سازی عملکرد و آزمایش - این دوره همه چیز را دارد. هدف من این بود که منبع اصلی خود را برای زبان جاوا اسکریپت ایجاد کنم، که نه تنها میتوانید از آن برای یادگیری آن استفاده کنید، بلکه میتوانید به عنوان منبعی که میتوانید به آن بازگردید و موضوعات مهم را جستجو کنید.
این دوره بر اساس تجربه من به عنوان یک توسعه دهنده بلندمدت جاوا اسکریپت و همچنین معلمی با بیش از 2,000,000 دانش آموز در Udemy و همچنین در کانال YouTube Academind من است. این مملو از مثالها، دموها، پروژهها، تکالیف، آزمونها و البته ویدیوها است - همه با هدف ارائه بهترین روش ممکن برای یادگیری جاوا اسکریپت.
چه چیزی در دوره وجود دارد؟
این دوره به وضوح مملو از محتوا است - بنابراین اکیداً توصیه میکنم که برنامه درسی دوره کامل را بررسی کنید تا ایده روشنی از همه موضوعات تحت پوشش دوره داشته باشید. به طور کلی، آنچه در این دوره خواهید یافت به شرح زیر است:
جاوا اسکریپت مدرن از ابتدا: سینتکس جاوا اسکریپت با گذشت زمان تغییر کرد - در این دوره، آخرین نحو را از ابتدا یاد خواهید گرفت (هرچند با سینتکس قدیمی نیز آشنا خواهید شد، به طوری که می توانید در هر JS کار کنید. پروژه)
همه مبانی: متغیرها، ثابت ها، توابع، نحوه بارگیری اسکریپت ها و غیره
اشیاء آرایه: ما این ساختارهای داده بسیار مهم را با جزئیات زیاد بررسی خواهیم کرد
ساختارهای کنترل: نحوه اجرای کد به صورت شرطی و در حلقه را بدانید
نگاهی به پشت صحنه: موتورهای جاوا اسکریپت چگونه در پشت صحنه کار می کنند و چه معنایی برای ما دارد
بررسی عمیق در مفاهیم اصلی: همه چیزهای خاص در مورد عملکرد جاوا اسکریپت، نحوهای مختلف
کار با DOM: نحوه دستکاری صفحات وب به صورت پویا از طریق جاوا اسکریپت (شامل غواصی عمیق و موارد استفاده مختلف)
رویدادها در جاوا اسکریپت: یاد بگیرید که چگونه به طیف وسیعی از رویدادها گوش دهید (به عنوان مثال کشیدن دراپ) و کد مناسب را اجرا کنید
کلاسها برنامهنویسی شیگرا: نحوه کار با کلاسها، نمونههای اولیه، کلمه کلیدی "این"، توابع سازنده و موارد دیگر را بیاموزید
برنامه نویسی ناهمزمان و همزمان: ما تماس ها، وعده ها، همگام سازی/انتظار و سایر ابزارهای مهم و ویژگی های زبان را برای اجرای صحیح کد بررسی خواهیم کرد
درخواستهای Http: نحوه ارسال درخواستهای Http از طریق جاوا اسکریپت را بیاموزید
ابزار، بهینهسازی پشتیبانی مرورگر: تقسیم کد، تولید کدهای کوچک و اطمینان از کارکرد اسکریپتها در همه مرورگرها - این مهم است و از این رو با جزئیات کامل پوشش داده میشود
چارچوبهای کتابخانهها: درباره کتابخانههایی مانند Axios یا چارچوبهایی مانند React.js بیاموزید - چرا اهمیت دارند و چگونه از آنها استفاده کنید
Node.js : در حالی که در اکثر دوره آموزشی روی سمت مرورگر تمرکز می کنیم (چون نحو یکسان است)، ما همچنین یک بخش اختصاصی در Node.js خواهیم داشت تا همه چیز را در مورد محیط میزبان JS یاد بگیریم
بهینهسازیهای عملکرد امنیتی: مطمئناً امنیت مهم است، عملکرد نیز مهم است - جای تعجب نیست که هر دو در دوره پوشش داده میشوند!
تست خودکار: تست دستی کار سختی است و می تواند غیرقابل اعتماد باشد - در این دوره همچنین مقدمه ای بر تست خودکار خواهید داشت
پیش نیازهای دوره چیست؟
دانش جاوا اسکریپت لازم نیست - شما آن را از ابتدا یاد خواهید گرفت!
شما همچنین به هیچ تجربه برنامه نویسی غیر از دانش اولیه توسعه وب (به عنوان مثال نحوه عملکرد وب) نیاز ندارید
دانش اولیه HTML و CSS توصیه میشود اما لازم نیست
سرفصل ها و درس ها
معرفی
Introduction
معرفی
Introduction
جاوا اسکریپت چیست؟
What is JavaScript?
جاوا اسکریپت در عمل!
JavaScript in Action!
به انجمن آموزش آنلاین ما بپیوندید
Join our Online Learning Community
نحوه اجرای جاوا اسکریپت
How JavaScript Is Executed
زبانهای پویا در مقابل زبانهای ضعیف
Dynamic vs Weakly Typed Languages
جاوا اسکریپت در یک محیط میزبان اجرا می شود
JavaScript Executes In A Hosted Environment
خلاصه دوره - در این دوره چیست؟
Course Outline - What's In This Course?
چگونه از این دوره بیشترین بهره را ببرید
How To Get The Most Out Of This Course
استفاده از منابع دوره
Using Course Resources
جاوا اسکریپت در مقابل جاوا
JavaScript vs Java
تاریخچه مختصری از جاوا اسکریپت
A Brief History Of JavaScript
راه اندازی یک محیط توسعه
Setting Up a Development Environment
سوالات متداول دوره
Course FAQs
معرفی
Introduction
معرفی
Introduction
جاوا اسکریپت چیست؟
What is JavaScript?
جاوا اسکریپت در عمل!
JavaScript in Action!
به انجمن آموزش آنلاین ما بپیوندید
Join our Online Learning Community
نحوه اجرای جاوا اسکریپت
How JavaScript Is Executed
زبانهای پویا در مقابل زبانهای ضعیف
Dynamic vs Weakly Typed Languages
جاوا اسکریپت در یک محیط میزبان اجرا می شود
JavaScript Executes In A Hosted Environment
خلاصه دوره - در این دوره چیست؟
Course Outline - What's In This Course?
چگونه از این دوره بیشترین بهره را ببرید
How To Get The Most Out Of This Course
استفاده از منابع دوره
Using Course Resources
جاوا اسکریپت در مقابل جاوا
JavaScript vs Java
تاریخچه مختصری از جاوا اسکریپت
A Brief History Of JavaScript
راه اندازی یک محیط توسعه
Setting Up a Development Environment
سوالات متداول دوره
Course FAQs
مبانی: متغیرها، انواع داده ها، اپراتورها و توابع
Basics: Variables, Data Types, Operators & Functions
معرفی ماژول
Module Introduction
راه اندازی پروژه
Setting Up the Project
اطلاعات بیشتر در مورد کنترل نسخه و گیت
More on Version Control & Git
افزودن جاوا اسکریپت به وب سایت
Adding JavaScript to the Website
معرفی متغیرها و ثابت ها
Introducing Variables & Constants
اعلان و تعریف متغیرها
Declaring & Defining Variables
کار با متغیرها و اپراتورها
Working with Variables & Operators
متغیرها و اپراتورها
Variables & Operators
تمرین: متغیرها و عملگرها
Exercise: Variables & Operators
آشنایی با کد شروع
Understanding the Starting Code
انواع داده ها: اعداد و رشته ها (متن)
Data Types: Numbers & Strings (Text)
استفاده از ثابت ها
Using Constants
بیشتر در مورد رشته ها
More on Strings
انواع داده ها و ثابت ها
Data Types & Constants
زمان برای تمرین: متغیرها، ثابت ها، اپراتورها و انواع داده های اصلی
Time to Practice: Variables, Constants, Operators & Core Data Types
معرفی توابع
Introducing Functions
اضافه کردن یک تابع سفارشی
Adding A Custom Function
سبکهای کد، قراردادها و نحو
Code Styles, Conventions & Syntax
ارزش های برگشتی
Returning Values
تمرین: توابع
Exercise: Functions
(بی)اهمیت ترتیب کد
The (Un)Importance of Code Order
مقدمه ای بر دامنه جهانی و محلی
An Introduction to Global & Local Scope
"متغیرهای سایه دار"
"Shadowed Variables"
اطلاعات بیشتر در مورد بیانیه "بازگشت".
More about the "return" Statement
اجرای توابع "غیر مستقیم"
Executing Functions "Indirectly"
اجرای عملکرد "غیر مستقیم" در مقابل "مستقیم" - خلاصه
"Indirect" vs "Direct" Function Execution - Summary
تمرین: اجرای مستقیم و غیرمستقیم توابع
Exercise: Executing Functions Directly & Indirectly
توابع و دامنه
Functions & Scope
زمان برای تمرین: توابع
Time to Practice: Functions
تبدیل انواع داده ها
Converting Data Types
مخلوط کردن اعداد و رشته ها
Mixing Numbers & Strings
تقسیم کد به توابع
Splitting Code into Functions
اتصال همه دکمه ها به توابع
Connecting all Buttons to Functions
کار با نظرات کد
Working with Code Comments
اپراتورهای بیشتر!
More Operators!
انواع داده های اصلی بیشتر!
More Core Data Types!
استفاده از آرایه ها
Using Arrays
تمرین: آرایه ها
Exercise: Arrays
ایجاد اشیاء
Creating Objects
تمرین: اشیاء
Exercise: Objects
اشیاء - گوچاهای نحو مشترک
Objects - Common Syntax Gotchas
دسترسی به داده های شی
Accessing Object Data
آرایه ها و اشیاء
Arrays & Objects
اضافه کردن یک تابع قابل استفاده مجدد که از اشیاء استفاده می کند
Adding a Re-Usable Function That Uses Objects
تعریف نشده، تهی و NaN
undefined, null & NaN
اپراتور "نوع".
The "typeof" Operator
"تعریف نشده"، "تهی" و "NaN"
"undefined", "null" & "NaN"
وارد کردن اسکریپتها بهطور صحیح با «به تعویق انداختن» و «ناهمگام»
Importing Scripts Correctly with "defer" & "async"
وارد کردن جاوا اسکریپت - خلاصه
Importing JavaScript - Summary
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
مبانی: متغیرها، انواع داده ها، اپراتورها و توابع
Basics: Variables, Data Types, Operators & Functions
معرفی ماژول
Module Introduction
راه اندازی پروژه
Setting Up the Project
اطلاعات بیشتر در مورد کنترل نسخه و گیت
More on Version Control & Git
افزودن جاوا اسکریپت به وب سایت
Adding JavaScript to the Website
معرفی متغیرها و ثابت ها
Introducing Variables & Constants
اعلان و تعریف متغیرها
Declaring & Defining Variables
کار با متغیرها و اپراتورها
Working with Variables & Operators
متغیرها و اپراتورها
Variables & Operators
تمرین: متغیرها و عملگرها
Exercise: Variables & Operators
آشنایی با کد شروع
Understanding the Starting Code
انواع داده ها: اعداد و رشته ها (متن)
Data Types: Numbers & Strings (Text)
استفاده از ثابت ها
Using Constants
بیشتر در مورد رشته ها
More on Strings
انواع داده ها و ثابت ها
Data Types & Constants
زمان برای تمرین: متغیرها، ثابت ها، اپراتورها و انواع داده های اصلی
Time to Practice: Variables, Constants, Operators & Core Data Types
معرفی توابع
Introducing Functions
اضافه کردن یک تابع سفارشی
Adding A Custom Function
سبکهای کد، قراردادها و نحو
Code Styles, Conventions & Syntax
ارزش های برگشتی
Returning Values
تمرین: توابع
Exercise: Functions
(بی)اهمیت ترتیب کد
The (Un)Importance of Code Order
مقدمه ای بر دامنه جهانی و محلی
An Introduction to Global & Local Scope
"متغیرهای سایه دار"
"Shadowed Variables"
اطلاعات بیشتر در مورد بیانیه "بازگشت".
More about the "return" Statement
اجرای توابع "غیر مستقیم"
Executing Functions "Indirectly"
اجرای عملکرد "غیر مستقیم" در مقابل "مستقیم" - خلاصه
"Indirect" vs "Direct" Function Execution - Summary
تمرین: اجرای مستقیم و غیرمستقیم توابع
Exercise: Executing Functions Directly & Indirectly
توابع و دامنه
Functions & Scope
زمان برای تمرین: توابع
Time to Practice: Functions
تبدیل انواع داده ها
Converting Data Types
مخلوط کردن اعداد و رشته ها
Mixing Numbers & Strings
تقسیم کد به توابع
Splitting Code into Functions
اتصال همه دکمه ها به توابع
Connecting all Buttons to Functions
کار با نظرات کد
Working with Code Comments
اپراتورهای بیشتر!
More Operators!
انواع داده های اصلی بیشتر!
More Core Data Types!
استفاده از آرایه ها
Using Arrays
تمرین: آرایه ها
Exercise: Arrays
ایجاد اشیاء
Creating Objects
تمرین: اشیاء
Exercise: Objects
اشیاء - گوچاهای نحو مشترک
Objects - Common Syntax Gotchas
دسترسی به داده های شی
Accessing Object Data
آرایه ها و اشیاء
Arrays & Objects
اضافه کردن یک تابع قابل استفاده مجدد که از اشیاء استفاده می کند
Adding a Re-Usable Function That Uses Objects
تعریف نشده، تهی و NaN
undefined, null & NaN
اپراتور "نوع".
The "typeof" Operator
"تعریف نشده"، "تهی" و "NaN"
"undefined", "null" & "NaN"
وارد کردن اسکریپتها بهطور صحیح با «به تعویق انداختن» و «ناهمگام»
Importing Scripts Correctly with "defer" & "async"
وارد کردن جاوا اسکریپت - خلاصه
Importing JavaScript - Summary
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
توسعه کارآمد و اشکال زدایی
Efficient Development & Debugging
معرفی ماژول
Module Introduction
توسعه کارآمد و اشکال زدایی - یک مرور کلی
Efficient Development & Debugging - An Overview
پیکربندی IDE Look & Feel
Configuring the IDE Look & Feel
استفاده از میانبرها
Using Shortcuts
کار با نکات تکمیل خودکار و IDE
Working with Auto-Completion & IDE Hints
نصب برنامه های افزودنی IDE
Installing IDE Extensions
بهینه سازی تنظیمات ویرایشگر
Tweaking Editor Settings
استفاده از نماهای مختلف IDE
Utilizing Different IDE Views
یافتن راهنما و کار با MDN
Finding Help & Working with MDN
استاندارد ECMAScript
The ECMAScript Standard
چگونه به درستی "گوگل" کنیم
How to "google" Correctly
اشکال زدایی جاوا اسکریپت - یک مرور کلی
Debugging JavaScript - An Overview
یک پیام خطا! دلیلی برای وحشت وجود ندارد!
An Error Message! No Reason To Panic!
استفاده از console.log() برای نگاه کردن به کد
Using console.log() to look "into the Code"
اشکال زدایی سطح بعدی با ابزارهای برنامه نویس کروم و نقاط شکست
Next-Level Debugging with the Chrome Devtools & Breakpoints
کد تست مستقیماً در Devtools تغییر می کند
Testing Code Changes Directly in the Devtools
اشکال زدایی کد مستقیماً در داخل کد VS
Debugging Code directly Inside VS Code
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
توسعه کارآمد و اشکال زدایی
Efficient Development & Debugging
معرفی ماژول
Module Introduction
توسعه کارآمد و اشکال زدایی - یک مرور کلی
Efficient Development & Debugging - An Overview
پیکربندی IDE Look & Feel
Configuring the IDE Look & Feel
استفاده از میانبرها
Using Shortcuts
کار با نکات تکمیل خودکار و IDE
Working with Auto-Completion & IDE Hints
نصب برنامه های افزودنی IDE
Installing IDE Extensions
بهینه سازی تنظیمات ویرایشگر
Tweaking Editor Settings
استفاده از نماهای مختلف IDE
Utilizing Different IDE Views
یافتن راهنما و کار با MDN
Finding Help & Working with MDN
استاندارد ECMAScript
The ECMAScript Standard
چگونه به درستی "گوگل" کنیم
How to "google" Correctly
اشکال زدایی جاوا اسکریپت - یک مرور کلی
Debugging JavaScript - An Overview
یک پیام خطا! دلیلی برای وحشت وجود ندارد!
An Error Message! No Reason To Panic!
استفاده از console.log() برای نگاه کردن به کد
Using console.log() to look "into the Code"
اشکال زدایی سطح بعدی با ابزارهای برنامه نویس کروم و نقاط شکست
Next-Level Debugging with the Chrome Devtools & Breakpoints
کد تست مستقیماً در Devtools تغییر می کند
Testing Code Changes Directly in the Devtools
اشکال زدایی کد مستقیماً در داخل کد VS
Debugging Code directly Inside VS Code
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
کار با ساختارهای کنترل (اگر عبارات، حلقه ها، مدیریت خطا)
Working with Control Structures (if Statements, Loops, Error Handling)
معرفی ماژول
Module Introduction
معرفی عبارات «اگر» و عملگرهای بولی (مقایسه).
Introducing "if" Statements & Boolean (Comparison) Operators
استفاده از Booleans در شرایط و موارد دیگر در مقایسه متن
Using Booleans in Conditions & More on Text Comparisons
استفاده از عبارات "اگر".
Using "if" Statements
کار با "اگر"، "دیگر" و "اگر-اگر"
Working with "if", "else" and "else-if"
تمرین: شروع با if statements
Exercise: Getting Started with if Statements
هنگام مقایسه اشیا و آرایه ها برای برابری مراقب باشید!
Beware When Comparing Objects & Arrays for Equality!
عملگرهای منطقی AND و OR
The Logical AND and OR Operators
درک اولویت اپراتور
Understanding Operator Precedence
اپراتورهای if & Boolean - مبانی
if & Boolean Operators - The Basics
فراتر از درست/کاذب: ارزشهای «حقیقت» و «کاذب».
Beyond true/ false: "Truthy" and "Falsy" Values
اجبار در مقابل تبدیل
Coercion vs Conversion
ارزش های دروغین و واقعی
Falsy and Truthy Values
راه اندازی یک پروژه نمونه بزرگتر («قاتل هیولا»)
Setting Up a Bigger Example Project (The "Monster Killer")
اضافه کردن یک تابع "حمله".
Adding an "Attack" Function
استفاده از عبارات "if" برای بررسی وضعیت Win-Condition
Using "if" Statements for Checking the Win-Condition
افزودن بیانیه های بیشتر "اگر" و عملکرد "حمله قوی".
Adding More "if" Statements & A "Strong Attack" Functionality
زمان برای عملکرد "Heal Player" است!
Time for a "Heal Player" Functionality!
کنترل عمر پاداش شرطی (بدون عملگرهای بولی!)
Controlling the Conditional Bonus Life (Without Boolean Operators!)
اضافه کردن یک عملکرد "بازنشانی بازی".
Adding a "Reset Game" Functionality
اعتبار سنجی ورودی کاربر
Validating User Input
استفاده از ثابت های جهانی به عنوان شناسه در کد شرطی
Utilizing Global Constants as Identifiers in Conditional Code
اضافه کردن گزارش نبرد مشروط
Adding a Conditional Battle Log
معرفی اپراتور سه تایی
Introducing the Ternary Operator
کمی تئوری: عبارات در مقابل عبارات
A Bit of Theory: Statements vs Expressions
عملگر منطقی "ترفندها" و کوتاهنویسی
Logical Operator "Tricks" & Shorthands
عملگرهای منطقی - خلاصه ای سریع
Logical Operators - A Quick Summary
عملگرهای منطقی و نحوه کار آنها
Logical Operators & How They Work
کار با عبارت "switch-case".
Working with the "switch-case" Statement
معرفی حلقه ها
Introducing Loops
حلقه "برای".
The "for" Loop
تمرین: برای حلقه ها
Exercise: for Loops
حلقه "for-of".
The "for-of" Loop
حلقه "for-in".
The "for-in" Loop
حلقه های "while" و "do-while".
The "while" & "do-while" Loops
حلقه ها - مبانی
Loops - Basics
زمان تمرین: ساختارهای کنترل
Time to Practice: Control Structures
کنترل حلقه ها با "شکستن"
Controlling Loops with "break"
کنترل تکرارها با "ادامه"
Controlling Iterations with "continue"
کنترل بیشتر با بیانیه های برچسب دار
More Control with Labeled Statements
شکستن و ادامه دادن
break & continue
مدیریت خطا با "try-catch" - مقدمه
Error Handling with "try-catch" - An Introduction
پرتاب خطاهای سفارشی
Throwing Custom Errors
تمرین: پرتاب و رسیدگی به خطاها
Exercise: Throwing & Handling Errors
کار با "try-catch" برای Catch & Handle Errors
Working with "try-catch" to Catch & Handle Errors
رسیدگی به خطا
Error Handling
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
کار با ساختارهای کنترل (اگر عبارات، حلقه ها، مدیریت خطا)
Working with Control Structures (if Statements, Loops, Error Handling)
معرفی ماژول
Module Introduction
معرفی عبارات «اگر» و عملگرهای بولی (مقایسه).
Introducing "if" Statements & Boolean (Comparison) Operators
استفاده از Booleans در شرایط و موارد دیگر در مقایسه متن
Using Booleans in Conditions & More on Text Comparisons
استفاده از عبارات "اگر".
Using "if" Statements
کار با "اگر"، "دیگر" و "اگر-اگر"
Working with "if", "else" and "else-if"
تمرین: شروع با if statements
Exercise: Getting Started with if Statements
هنگام مقایسه اشیا و آرایه ها برای برابری مراقب باشید!
Beware When Comparing Objects & Arrays for Equality!
عملگرهای منطقی AND و OR
The Logical AND and OR Operators
درک اولویت اپراتور
Understanding Operator Precedence
اپراتورهای if & Boolean - مبانی
if & Boolean Operators - The Basics
فراتر از درست/کاذب: ارزشهای «حقیقت» و «کاذب».
Beyond true/ false: "Truthy" and "Falsy" Values
اجبار در مقابل تبدیل
Coercion vs Conversion
ارزش های دروغین و واقعی
Falsy and Truthy Values
راه اندازی یک پروژه نمونه بزرگتر («قاتل هیولا»)
Setting Up a Bigger Example Project (The "Monster Killer")
اضافه کردن یک تابع "حمله".
Adding an "Attack" Function
استفاده از عبارات "if" برای بررسی وضعیت Win-Condition
Using "if" Statements for Checking the Win-Condition
افزودن بیانیه های بیشتر "اگر" و عملکرد "حمله قوی".
Adding More "if" Statements & A "Strong Attack" Functionality
زمان برای عملکرد "Heal Player" است!
Time for a "Heal Player" Functionality!
کنترل عمر پاداش شرطی (بدون عملگرهای بولی!)
Controlling the Conditional Bonus Life (Without Boolean Operators!)
اضافه کردن یک عملکرد "بازنشانی بازی".
Adding a "Reset Game" Functionality
اعتبار سنجی ورودی کاربر
Validating User Input
استفاده از ثابت های جهانی به عنوان شناسه در کد شرطی
Utilizing Global Constants as Identifiers in Conditional Code
اضافه کردن گزارش نبرد مشروط
Adding a Conditional Battle Log
معرفی اپراتور سه تایی
Introducing the Ternary Operator
کمی تئوری: عبارات در مقابل عبارات
A Bit of Theory: Statements vs Expressions
عملگر منطقی "ترفندها" و کوتاهنویسی
Logical Operator "Tricks" & Shorthands
عملگرهای منطقی - خلاصه ای سریع
Logical Operators - A Quick Summary
عملگرهای منطقی و نحوه کار آنها
Logical Operators & How They Work
کار با عبارت "switch-case".
Working with the "switch-case" Statement
معرفی حلقه ها
Introducing Loops
حلقه "برای".
The "for" Loop
تمرین: برای حلقه ها
Exercise: for Loops
حلقه "for-of".
The "for-of" Loop
حلقه "for-in".
The "for-in" Loop
حلقه های "while" و "do-while".
The "while" & "do-while" Loops
حلقه ها - مبانی
Loops - Basics
زمان تمرین: ساختارهای کنترل
Time to Practice: Control Structures
کنترل حلقه ها با "شکستن"
Controlling Loops with "break"
کنترل تکرارها با "ادامه"
Controlling Iterations with "continue"
کنترل بیشتر با بیانیه های برچسب دار
More Control with Labeled Statements
شکستن و ادامه دادن
break & continue
مدیریت خطا با "try-catch" - مقدمه
Error Handling with "try-catch" - An Introduction
پرتاب خطاهای سفارشی
Throwing Custom Errors
تمرین: پرتاب و رسیدگی به خطاها
Exercise: Throwing & Handling Errors
کار با "try-catch" برای Catch & Handle Errors
Working with "try-catch" to Catch & Handle Errors
رسیدگی به خطا
Error Handling
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
پشت صحنه و گذشته (عجیب) (ES3، ES5) و حال (ES6+) جاوا اسکریپت
Behind the Scenes & The (Weird) Past (ES3, ES5) & Present (ES6+) of JavaScript
معرفی ماژول
Module Introduction
ES5 در مقابل ES6+ ("Next Gen JS") - تکامل جاوا اسکریپت
ES5 vs ES6+ ("Next Gen JS") - Evolution of JavaScript
var vs let & const - معرفی "Block Scope"
var vs let & const - Introducing "Block Scope"
درک "بالا بردن"
Understanding "Hoisting"
حالت دقیق و نوشتن کد خوب
Strict Mode & Writing Good Code
"تخصص جاوا اسکریپت"
"JavaScript Specialties"
نحوه تجزیه و کامپایل کد
How Code is Parsed & Compiled
داخل موتور جاوا اسکریپت - نحوه اجرای کد
Inside the JavaScript Engine - How the Code Executes
[DEEP DIVE] زبان جاوا اسکریپت در مقابل APIهای مرورگر
[DEEP DIVE] JavaScript Language vs Browser APIs
مقادیر اولیه در مقابل مقادیر مرجع
Primitive vs Reference Values
جمع آوری زباله و مدیریت حافظه
Garbage Collection & Memory Management
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
پشت صحنه و گذشته (عجیب) (ES3، ES5) و حال (ES6+) جاوا اسکریپت
Behind the Scenes & The (Weird) Past (ES3, ES5) & Present (ES6+) of JavaScript
معرفی ماژول
Module Introduction
ES5 در مقابل ES6+ ("Next Gen JS") - تکامل جاوا اسکریپت
ES5 vs ES6+ ("Next Gen JS") - Evolution of JavaScript
var vs let & const - معرفی "Block Scope"
var vs let & const - Introducing "Block Scope"
درک "بالا بردن"
Understanding "Hoisting"
حالت دقیق و نوشتن کد خوب
Strict Mode & Writing Good Code
"تخصص جاوا اسکریپت"
"JavaScript Specialties"
نحوه تجزیه و کامپایل کد
How Code is Parsed & Compiled
داخل موتور جاوا اسکریپت - نحوه اجرای کد
Inside the JavaScript Engine - How the Code Executes
[DEEP DIVE] زبان جاوا اسکریپت در مقابل APIهای مرورگر
[DEEP DIVE] JavaScript Language vs Browser APIs
مقادیر اولیه در مقابل مقادیر مرجع
Primitive vs Reference Values
جمع آوری زباله و مدیریت حافظه
Garbage Collection & Memory Management
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
بیشتر در مورد توابع
More on Functions
معرفی ماژول
Module Introduction
جمع بندی دانش توابع - آنچه تاکنون می دانیم
Recapping Functions Knowledge - What We Know Thus Far
پارامترها در مقابل آرگومان ها
Parameters vs Arguments
توابع در مقابل روش ها
Functions vs Methods
توابع اشیا هستند!
Functions are Objects!
عبارات تابع: ذخیره توابع در متغیرها
Function Expressions: Storing Functions in Variables
عبارات تابع در مقابل اعلان تابع
Function Expressions vs Function Declarations
توابع ناشناس
Anonymous Functions
کار بر روی پروژه: افزودن گزینه های کاربر به بازی
Working on the Project: Adding User Choices to the Game
پیاده سازی منطق اصلی بازی
Implementing the Core Game Logic
معرفی توابع پیکان
Introducing Arrow Functions
نحوهای مختلف تابع پیکان
Different Arrow Function Syntaxes
ایجاد توابع
Creating Functions
ارسال پیام به کاربر
Outputting Messages to the User
آرگومان های پیش فرض در توابع
Default Arguments in Functions
معرفی پارامترهای استراحت ("اپراتور استراحت")
Introducing Rest Parameters ("Rest Operator")
ایجاد توابع در داخل توابع
Creating Functions Inside of Functions
درک عملکردهای برگشت به تماس
Understanding Callback Functions
زمان برای تمرین: توابع
Time to Practice: Functions
کار با "bind()"
Working with "bind()"
توابع - پیشرفته
Functions - Advanced
افزودن bind() به پروژه ماشین حساب
Adding bind() to the Calculator Project
call() و application()
call() and apply()
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
بیشتر در مورد توابع
More on Functions
معرفی ماژول
Module Introduction
جمع بندی دانش توابع - آنچه تاکنون می دانیم
Recapping Functions Knowledge - What We Know Thus Far
پارامترها در مقابل آرگومان ها
Parameters vs Arguments
توابع در مقابل روش ها
Functions vs Methods
توابع اشیا هستند!
Functions are Objects!
عبارات تابع: ذخیره توابع در متغیرها
Function Expressions: Storing Functions in Variables
عبارات تابع در مقابل اعلان تابع
Function Expressions vs Function Declarations
توابع ناشناس
Anonymous Functions
کار بر روی پروژه: افزودن گزینه های کاربر به بازی
Working on the Project: Adding User Choices to the Game
پیاده سازی منطق اصلی بازی
Implementing the Core Game Logic
معرفی توابع پیکان
Introducing Arrow Functions
نحوهای مختلف تابع پیکان
Different Arrow Function Syntaxes
ایجاد توابع
Creating Functions
ارسال پیام به کاربر
Outputting Messages to the User
آرگومان های پیش فرض در توابع
Default Arguments in Functions
معرفی پارامترهای استراحت ("اپراتور استراحت")
Introducing Rest Parameters ("Rest Operator")
ایجاد توابع در داخل توابع
Creating Functions Inside of Functions
درک عملکردهای برگشت به تماس
Understanding Callback Functions
زمان برای تمرین: توابع
Time to Practice: Functions
کار با "bind()"
Working with "bind()"
توابع - پیشرفته
Functions - Advanced
افزودن bind() به پروژه ماشین حساب
Adding bind() to the Calculator Project
call() و application()
call() and apply()
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
کار با DOM (کد HTML مرورگر) در جاوا اسکریپت
Working with the DOM (Browser HTML Code) in JavaScript
معرفی ماژول
Module Introduction
"DOM" چیست؟
What's the "DOM"?
سند و شی پنجره
Document and Window Object
آشنایی با DOM و نحوه ایجاد آن
Understanding the DOM and how it's created
گره ها و عناصر - پرس و جو از نمای کلی DOM
Nodes & Elements - Querying the DOM Overview
انتخاب عناصر در DOM
Selecting Elements in the DOM
تمرین: انتخاب عناصر در DOM
Exercise: Selecting Elements in the DOM
خلاصه: روش های پرس و جو گره
Summary: Node Query Methods
کاوش و تغییر ویژگی های DOM
Exploring and Changing DOM Properties
ویژگی ها در مقابل ویژگی ها
Attributes vs Properties
انتخاب چند عنصر و خلاصه
Selecting Multiple Elements & Summary
مبانی DOM
DOM Basics
زمان برای تمرین: پرس و جو DOM
Time to Practice: DOM Querying
عبور از DOM - نمای کلی
Traversing the DOM - Overview
عبور از گره های کودک
Traversing Child Nodes
استفاده از parentNode و parentElement
Using parentNode & parentElement
انتخاب عناصر خواهر و برادر
Selecting Sibling Elements
پیمایش DOM در مقابل روشهای پرس و جو
DOM Traversal vs Query Methods
یک ظاهر طراحی شده عناصر DOM
Styling DOM Elements
ایجاد عناصر با JS - نمای کلی
Creating Elements with JS - Overview
اضافه کردن عناصر از طریق HTML در کد
Adding Elements via HTML in Code
افزودن عناصر از طریق createElement()
Adding Elements via createElement()
تمرین: اضافه کردن عناصر
Exercise: Adding Elements
درج عناصر DOM
Inserting DOM Elements
شبیه سازی گره های DOM
Cloning DOM Nodes
لیست گره های زنده در مقابل لیست گره های ایستا
Live Node Lists vs Static Node Lists
حذف عناصر
Removing Elements
خلاصه روش درج و حذف
Insertion & Removal Method Summary
خلاصه: درج، جایگزین، حذف
Summary: Insert, Replace, Remove
راه اندازی پروژه تمرین
Setting Up the Practice Project
انتخاب Modal و دکمه "Add".
Selecting the Modal and "Add" Button
باز کردن یک Modal با تغییر کلاس های CSS
Opening a Modal by Changing CSS Classes
کنترل پس زمینه
Controlling the Backdrop
واکشی و اعتبارسنجی ورودی کاربر
Fetching and Validating User Input
ایجاد یک فیلم در جاوا اسکریپت و پاک کردن ورودی
Creating a Movie in JavaScript & Clearing the Input
رندر کردن آیتم های فیلم روی صفحه
Rendering Movie Items on the Screen
حذف عناصر فیلم
Deleting Movie Elements
نمایش و پنهان کردن "آیا مطمئن هستید؟" گفتگو
Showing & Hiding the "Are you sure?" Dialog
با منطق تایید شروع کنید
Starting with the Confirmation Logic
در حال اتمام برنامه
Finishing the App
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
کار با DOM (کد HTML مرورگر) در جاوا اسکریپت
Working with the DOM (Browser HTML Code) in JavaScript
معرفی ماژول
Module Introduction
"DOM" چیست؟
What's the "DOM"?
سند و شی پنجره
Document and Window Object
آشنایی با DOM و نحوه ایجاد آن
Understanding the DOM and how it's created
گره ها و عناصر - پرس و جو از نمای کلی DOM
Nodes & Elements - Querying the DOM Overview
انتخاب عناصر در DOM
Selecting Elements in the DOM
تمرین: انتخاب عناصر در DOM
Exercise: Selecting Elements in the DOM
خلاصه: روش های پرس و جو گره
Summary: Node Query Methods
کاوش و تغییر ویژگی های DOM
Exploring and Changing DOM Properties
ویژگی ها در مقابل ویژگی ها
Attributes vs Properties
انتخاب چند عنصر و خلاصه
Selecting Multiple Elements & Summary
مبانی DOM
DOM Basics
زمان برای تمرین: پرس و جو DOM
Time to Practice: DOM Querying
عبور از DOM - نمای کلی
Traversing the DOM - Overview
عبور از گره های کودک
Traversing Child Nodes
استفاده از parentNode و parentElement
Using parentNode & parentElement
انتخاب عناصر خواهر و برادر
Selecting Sibling Elements
پیمایش DOM در مقابل روشهای پرس و جو
DOM Traversal vs Query Methods
یک ظاهر طراحی شده عناصر DOM
Styling DOM Elements
ایجاد عناصر با JS - نمای کلی
Creating Elements with JS - Overview
اضافه کردن عناصر از طریق HTML در کد
Adding Elements via HTML in Code
افزودن عناصر از طریق createElement()
Adding Elements via createElement()
تمرین: اضافه کردن عناصر
Exercise: Adding Elements
درج عناصر DOM
Inserting DOM Elements
شبیه سازی گره های DOM
Cloning DOM Nodes
لیست گره های زنده در مقابل لیست گره های ایستا
Live Node Lists vs Static Node Lists
حذف عناصر
Removing Elements
خلاصه روش درج و حذف
Insertion & Removal Method Summary
خلاصه: درج، جایگزین، حذف
Summary: Insert, Replace, Remove
راه اندازی پروژه تمرین
Setting Up the Practice Project
انتخاب Modal و دکمه "Add".
Selecting the Modal and "Add" Button
باز کردن یک Modal با تغییر کلاس های CSS
Opening a Modal by Changing CSS Classes
کنترل پس زمینه
Controlling the Backdrop
واکشی و اعتبارسنجی ورودی کاربر
Fetching and Validating User Input
ایجاد یک فیلم در جاوا اسکریپت و پاک کردن ورودی
Creating a Movie in JavaScript & Clearing the Input
رندر کردن آیتم های فیلم روی صفحه
Rendering Movie Items on the Screen
حذف عناصر فیلم
Deleting Movie Elements
نمایش و پنهان کردن "آیا مطمئن هستید؟" گفتگو
Showing & Hiding the "Are you sure?" Dialog
با منطق تایید شروع کنید
Starting with the Confirmation Logic
در حال اتمام برنامه
Finishing the App
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
اطلاعات بیشتر در مورد آرایه ها و تکرارپذیرها
More on Arrays & Iterables
معرفی ماژول
Module Introduction
"Iterables" و "Array-like Objects" چیست؟
What are "Iterables" and "Array-like Objects"?
ایجاد آرایه ها
Creating Arrays
کدام داده ها را می توانید در آرایه ها ذخیره کنید؟
Which Data Can You Store In Arrays?
push()، pop()، unshift()، shift() - افزودن و حذف عناصر
push(), pop(), unshift(), shift() - Adding & Removing Elements
روش splice().
The splice() Method
انتخاب محدوده و ایجاد کپی با slice()
Selecting Ranges & Creating Copies with slice()
اضافه کردن آرایه به آرایه با concat()
Adding Arrays to Arrays with concat()
بازیابی ایندکس ها با indexOf()/& lastIndexOf()
Retrieving Indexes with indexOf() /& lastIndexOf()
یافتن مطالب: find() و findIndex()
Finding Stuff: find() and findIndex()
آیا شامل می شود؟
Is it Included?
جایگزین for Loops: متد forEach().
Alternative to for Loops: The forEach() Method
تبدیل داده ها با map()
Transforming Data with map()
تمرین: map()
Exercise: map()
sort()ing و reverse()ing
sort()ing and reverse()ing
فیلتر کردن آرایه ها با filter()
Filtering Arrays with filter()
جایی که توابع فلش می درخشد!
Where Arrow Functions Shine!
روش کاهش () مهم
The Important reduce() Method
روش های زنجیره ای در جاوا اسکریپت
Chaining Methods in JavaScript
آرایه ها و رشته ها - split() و join()
Arrays & Strings - split() and join()
اپراتور Spread (...)
The Spread Operator (...)
شناخت تخریب آرایه
Understanding Array Destructuring
نقشه ها و مجموعه ها - نمای کلی
Maps & Sets - Overview
کار با مجموعه ها
Working with Sets
کار با Maps
Working with Maps
نقشه ها در مقابل اشیاء
Maps vs Objects
درک WeakSet
Understanding WeakSet
درک WeakMap
Understanding WeakMap
زمان تمرین: آرایه ها و تکرارپذیرها
Time to Practice: Arrays & Iterables
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
اطلاعات بیشتر در مورد آرایه ها و تکرارپذیرها
More on Arrays & Iterables
معرفی ماژول
Module Introduction
"Iterables" و "Array-like Objects" چیست؟
What are "Iterables" and "Array-like Objects"?
ایجاد آرایه ها
Creating Arrays
کدام داده ها را می توانید در آرایه ها ذخیره کنید؟
Which Data Can You Store In Arrays?
push()، pop()، unshift()، shift() - افزودن و حذف عناصر
push(), pop(), unshift(), shift() - Adding & Removing Elements
روش splice().
The splice() Method
انتخاب محدوده و ایجاد کپی با slice()
Selecting Ranges & Creating Copies with slice()
اضافه کردن آرایه به آرایه با concat()
Adding Arrays to Arrays with concat()
بازیابی ایندکس ها با indexOf()/& lastIndexOf()
Retrieving Indexes with indexOf() /& lastIndexOf()
یافتن مطالب: find() و findIndex()
Finding Stuff: find() and findIndex()
آیا شامل می شود؟
Is it Included?
جایگزین for Loops: متد forEach().
Alternative to for Loops: The forEach() Method
تبدیل داده ها با map()
Transforming Data with map()
تمرین: map()
Exercise: map()
sort()ing و reverse()ing
sort()ing and reverse()ing
فیلتر کردن آرایه ها با filter()
Filtering Arrays with filter()
جایی که توابع فلش می درخشد!
Where Arrow Functions Shine!
روش کاهش () مهم
The Important reduce() Method
روش های زنجیره ای در جاوا اسکریپت
Chaining Methods in JavaScript
آرایه ها و رشته ها - split() و join()
Arrays & Strings - split() and join()
اپراتور Spread (...)
The Spread Operator (...)
شناخت تخریب آرایه
Understanding Array Destructuring
نقشه ها و مجموعه ها - نمای کلی
Maps & Sets - Overview
کار با مجموعه ها
Working with Sets
کار با Maps
Working with Maps
نقشه ها در مقابل اشیاء
Maps vs Objects
درک WeakSet
Understanding WeakSet
درک WeakMap
Understanding WeakMap
زمان تمرین: آرایه ها و تکرارپذیرها
Time to Practice: Arrays & Iterables
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
اطلاعات بیشتر در مورد اشیاء
More on Objects
معرفی ماژول
Module Introduction
یک شی چیست؟
What's an Object?
اشیاء و ارزش های اولیه
Objects & Primitive Values
اشیاء - خلاصه
Objects - Recap
افزودن، اصلاح و حذف خواص
Adding, Modifying & Deleting Properties
نامهای کلید ویژه و دسترسی به اموال براکت مربعی
Special Key Names & Square Bracket Property Access
انواع املاک و سفارش املاک
Property Types & Property Order
دسترسی به ویژگی پویا و تنظیم ویژگی ها به صورت پویا
Dynamic Property Access & Setting Properties Dynamically
ویژگی های شی
Object Properties
برنامه آزمایشی و نحو ویژگی مختصر
Demo App & Shorthand Property Syntax
رندر کردن عناصر بر اساس اشیا
Rendering Elements based on Objects
حلقههای for-in و خروجی ویژگیهای پویا
for-in Loops & Outputting Dynamic Properties
افزودن عملکرد فیلتر
Adding the Filter Functionality
آشنایی با «زنجیرهسازی» (زنجیرهسازی خواص و روش)
Understanding "Chaining" (Property & Method Chaining)
اپراتور Object Spread (...)
The Object Spread Operator (...)
درک Object.assign()
Understanding Object.assign()
تخریب شی
Object Destructuring
بررسی وجود ملک
Checking for Property Existance
معرفی "این"
Introducing "this"
نحو سینتکس روش
The Method Shorthand Syntax
کلمه کلیدی "این" و رفتار عجیب آن
The "this" Keyword And Its Strange Behavior
call() و application()
call() and apply()
کاری که مرورگر (گاهی اوقات) با "این" انجام می دهد
What the Browser (Sometimes) Does to "this"
توابع "this" و Arrow
"this" and Arrow Functions
"این" - خلاصه
"this" - Summary
"این"
"this"
گیرنده و تنظیم کننده
Getters & Setters
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
اطلاعات بیشتر در مورد اشیاء
More on Objects
معرفی ماژول
Module Introduction
یک شی چیست؟
What's an Object?
اشیاء و ارزش های اولیه
Objects & Primitive Values
اشیاء - خلاصه
Objects - Recap
افزودن، اصلاح و حذف خواص
Adding, Modifying & Deleting Properties
نامهای کلید ویژه و دسترسی به اموال براکت مربعی
Special Key Names & Square Bracket Property Access
انواع املاک و سفارش املاک
Property Types & Property Order
دسترسی به ویژگی پویا و تنظیم ویژگی ها به صورت پویا
Dynamic Property Access & Setting Properties Dynamically
ویژگی های شی
Object Properties
برنامه آزمایشی و نحو ویژگی مختصر
Demo App & Shorthand Property Syntax
رندر کردن عناصر بر اساس اشیا
Rendering Elements based on Objects
حلقههای for-in و خروجی ویژگیهای پویا
for-in Loops & Outputting Dynamic Properties
افزودن عملکرد فیلتر
Adding the Filter Functionality
آشنایی با «زنجیرهسازی» (زنجیرهسازی خواص و روش)
Understanding "Chaining" (Property & Method Chaining)
اپراتور Object Spread (...)
The Object Spread Operator (...)
درک Object.assign()
Understanding Object.assign()
تخریب شی
Object Destructuring
بررسی وجود ملک
Checking for Property Existance
معرفی "این"
Introducing "this"
نحو سینتکس روش
The Method Shorthand Syntax
کلمه کلیدی "این" و رفتار عجیب آن
The "this" Keyword And Its Strange Behavior
call() و application()
call() and apply()
کاری که مرورگر (گاهی اوقات) با "این" انجام می دهد
What the Browser (Sometimes) Does to "this"
توابع "this" و Arrow
"this" and Arrow Functions
"این" - خلاصه
"this" - Summary
"این"
"this"
گیرنده و تنظیم کننده
Getters & Setters
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
کلاس ها و برنامه نویسی شی گرا (OOP)
Classes & Object-oriented Programming (OOP)
معرفی ماژول
Module Introduction
"برنامه نویسی شی گرا" (OOP) چیست؟
What is "Object-oriented Programming" (OOP)?
شروع با کد OOP
Getting Started with OOP Code
تعریف و استفاده از فرست کلاس
Defining & Using a First Class
کار با متدهای سازنده
Working with Constructor Methods
فیلدها در مقابل خواص
Fields vs Properties
استفاده و "اتصال" چندین کلاس
Using & "Connecting" Multiple Classes
روش های کلاس الزام آور و کار با "این"
Binding Class Methods & Working with "this"
اضافه کردن سبد خرید و کلاس خرید
Adding a Cart and Shop Class
برقراری ارتباط می تواند چالش برانگیز باشد!
Communicating Can Be Challenging!
روش ها و خواص استاتیک
Static Methods & Properties
اولین خلاصه و کلاس ها در مقابل شیء Literals
First Summary & Classes vs Object Literals
گیرنده و تنظیم کننده
Getters & Setters
معرفی وراثت
Introducing Inheritance
اجرای وراثت
Implementing Inheritance
استفاده از وراثت در همه جا
Using Inheritance Everywhere
Overriding Methods و super() Constructor
Overriding Methods and the super() Constructor
super() Constructor Execution, Order & "this"
super() Constructor Execution, Order & "this"
روش های مختلف اضافه کردن روش ها
Different Ways of Adding Methods
املاک خصوصی
Private Properties
خواص "شبه خصوصی".
"Pseudo-Private" Properties
زمان برای تمرین: کلاس ها و OOP
Time to Practice: Classes & OOP
اپراتور "نمونه".
The "instanceof" Operator
کلاس های داخلی
Built-in Classes
درک توصیفگرهای شی
Understanding Object Descriptors
کلاس ها
Classes
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
کلاس ها و برنامه نویسی شی گرا (OOP)
Classes & Object-oriented Programming (OOP)
معرفی ماژول
Module Introduction
"برنامه نویسی شی گرا" (OOP) چیست؟
What is "Object-oriented Programming" (OOP)?
شروع با کد OOP
Getting Started with OOP Code
تعریف و استفاده از فرست کلاس
Defining & Using a First Class
کار با متدهای سازنده
Working with Constructor Methods
فیلدها در مقابل خواص
Fields vs Properties
استفاده و "اتصال" چندین کلاس
Using & "Connecting" Multiple Classes
روش های کلاس الزام آور و کار با "این"
Binding Class Methods & Working with "this"
اضافه کردن سبد خرید و کلاس خرید
Adding a Cart and Shop Class
برقراری ارتباط می تواند چالش برانگیز باشد!
Communicating Can Be Challenging!
روش ها و خواص استاتیک
Static Methods & Properties
اولین خلاصه و کلاس ها در مقابل شیء Literals
First Summary & Classes vs Object Literals
گیرنده و تنظیم کننده
Getters & Setters
معرفی وراثت
Introducing Inheritance
اجرای وراثت
Implementing Inheritance
استفاده از وراثت در همه جا
Using Inheritance Everywhere
Overriding Methods و super() Constructor
Overriding Methods and the super() Constructor
super() Constructor Execution, Order & "this"
super() Constructor Execution, Order & "this"
روش های مختلف اضافه کردن روش ها
Different Ways of Adding Methods
املاک خصوصی
Private Properties
خواص "شبه خصوصی".
"Pseudo-Private" Properties
زمان برای تمرین: کلاس ها و OOP
Time to Practice: Classes & OOP
اپراتور "نمونه".
The "instanceof" Operator
کلاس های داخلی
Built-in Classes
درک توصیفگرهای شی
Understanding Object Descriptors
کلاس ها
Classes
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
Deep Dive: توابع سازنده و نمونه های اولیه
Deep Dive: Constructor Functions & Prototypes
معرفی ماژول
Module Introduction
معرفی توابع سازنده
Introducing Constructor Functions
توابع سازنده در مقابل کلاس ها و درک "جدید"
Constructor Functions vs Classes & Understanding "new"
معرفی نمونه های اولیه
Introducing Prototypes
نمونه های اولیه - خلاصه
Prototypes - Summary
کار با نمونه های اولیه
Working with Prototypes
زنجیره اولیه و جهانی "شیء"
The Prototype Chain and the Global "Object"
توابع سازنده و نمونه های اولیه
Constructor Functions & Prototypes
کلاس ها و نمونه های اولیه
Classes & Prototypes
روشها در کلاسها و سازندگان
Methods in Classes & In Constructors
نمونه های اولیه داخلی در جاوا اسکریپت
Built-in Prototypes in JavaScript
تنظیم و دریافت نمونه های اولیه
Setting & Getting Prototypes
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
Deep Dive: توابع سازنده و نمونه های اولیه
Deep Dive: Constructor Functions & Prototypes
معرفی ماژول
Module Introduction
معرفی توابع سازنده
Introducing Constructor Functions
توابع سازنده در مقابل کلاس ها و درک "جدید"
Constructor Functions vs Classes & Understanding "new"
معرفی نمونه های اولیه
Introducing Prototypes
نمونه های اولیه - خلاصه
Prototypes - Summary
کار با نمونه های اولیه
Working with Prototypes
زنجیره اولیه و جهانی "شیء"
The Prototype Chain and the Global "Object"
توابع سازنده و نمونه های اولیه
Constructor Functions & Prototypes
کلاس ها و نمونه های اولیه
Classes & Prototypes
روشها در کلاسها و سازندگان
Methods in Classes & In Constructors
نمونه های اولیه داخلی در جاوا اسکریپت
Built-in Prototypes in JavaScript
تنظیم و دریافت نمونه های اولیه
Setting & Getting Prototypes
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
تمرین: OOP و کلاس ها
Practice: OOP & Classes
معرفی ماژول
Module Introduction
اولین مراحل پروژه و برنامه ریزی
First Project Steps & Planning
ایجاد لیست های پروژه و تجزیه داده های عنصر
Creating Project Lists & Parsing Element Data
با منطق "Switch Project" شروع کنید
Starting with the "Switch Project" Logic
مراجع روش عبور در اطراف
Passing Method References Around
جابجایی عناصر DOM
Moving DOM Elements
افزودن یک راهنمای ابزار
Adding a Tooltip
اضافه کردن وراثت
Adding Inheritance
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
تمرین: OOP و کلاس ها
Practice: OOP & Classes
معرفی ماژول
Module Introduction
اولین مراحل پروژه و برنامه ریزی
First Project Steps & Planning
ایجاد لیست های پروژه و تجزیه داده های عنصر
Creating Project Lists & Parsing Element Data
با منطق "Switch Project" شروع کنید
Starting with the "Switch Project" Logic
مراجع روش عبور در اطراف
Passing Method References Around
جابجایی عناصر DOM
Moving DOM Elements
افزودن یک راهنمای ابزار
Adding a Tooltip
اضافه کردن وراثت
Adding Inheritance
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
بازگشت به DOM و APIهای مرورگر بیشتر
Back to the DOM & More Browser APIs
معرفی ماژول
Module Introduction
استفاده از "مجموعه داده" (داده-* ویژگی ها)
Using "dataset" (data-* Attributes)
دریافت ابعاد جعبه عنصر
Getting Element Box Dimensions
کار با اندازه و موقعیت عناصر
Working with Element Sizes & Positions
DOM و نمونه های اولیه
The DOM & Prototypes
قرار دادن راهنمای ابزار
Positioning the Tooltip
دست زدن به اسکرول
Handling Scrolling
کار با برچسب های <template>
Working with <template> Tags
بارگیری پویا اسکریپت ها
Loading Scripts Dynamically
تنظیم تایمرها و فواصل
Setting Timers & Intervals
اشیاء "مکان" و "تاریخ".
The "location" and "history" Objects
شی "ناوبر".
The "navigator" Object
کار با خرما
Working with Dates
تابع شی و سازنده "خطا".
The "Error" Object & Constructor Function
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
بازگشت به DOM و APIهای مرورگر بیشتر
Back to the DOM & More Browser APIs
معرفی ماژول
Module Introduction
استفاده از "مجموعه داده" (داده-* ویژگی ها)
Using "dataset" (data-* Attributes)
دریافت ابعاد جعبه عنصر
Getting Element Box Dimensions
کار با اندازه و موقعیت عناصر
Working with Element Sizes & Positions
DOM و نمونه های اولیه
The DOM & Prototypes
قرار دادن راهنمای ابزار
Positioning the Tooltip
دست زدن به اسکرول
Handling Scrolling
کار با برچسب های <template>
Working with <template> Tags
بارگیری پویا اسکریپت ها
Loading Scripts Dynamically
تنظیم تایمرها و فواصل
Setting Timers & Intervals
اشیاء "مکان" و "تاریخ".
The "location" and "history" Objects
شی "ناوبر".
The "navigator" Object
کار با خرما
Working with Dates
تابع شی و سازنده "خطا".
The "Error" Object & Constructor Function
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
کار با رویدادها
Working with Events
معرفی ماژول
Module Introduction
مقدمه ای بر رویدادها در جاوا اسکریپت
Introduction to Events in JavaScript
روش های مختلف گوش دادن به رویدادها
Different Ways of Listening to Events
حذف شنوندگان رویداد
Removing Event Listeners
شیء "رویداد".
The "event" Object
انواع رویداد پشتیبانی شده
Supported Event Types
مثال: اسکرول بی نهایت پایه
Example: Basic Infinite Scrolling
کار با "preventDefault()"
Working with "preventDefault()"
درک مراحل "گرفتن" و "حباب زدن".
Understanding "Capturing" & "Bubbling" Phases
انتشار رویداد و "stopPropagation()"
Event Propagation & "stopPropagation()"
استفاده از رویداد Delegation
Using Event Delegation
راه اندازی عناصر DOM به صورت برنامه ای
Triggering DOM Elements Programmatically
توابع مدیریت رویداد و "این"
Event Handler Functions & "this"
مناسبت ها
Events
کشیدن و رها کردن - تئوری
Drag & Drop - Theory
پیکربندی عناصر قابل کشیدن
Configuring Draggable Elements
علامت گذاری "منطقه سقوط"
Marking the "Drop Area"
رها کردن و جابجایی داده ها + عناصر
Dropping & Moving Data + Elements
تنظیمات فایرفاکس
Firefox Adjustments
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
کار با رویدادها
Working with Events
معرفی ماژول
Module Introduction
مقدمه ای بر رویدادها در جاوا اسکریپت
Introduction to Events in JavaScript
روش های مختلف گوش دادن به رویدادها
Different Ways of Listening to Events
حذف شنوندگان رویداد
Removing Event Listeners
شیء "رویداد".
The "event" Object
انواع رویداد پشتیبانی شده
Supported Event Types
مثال: اسکرول بی نهایت پایه
Example: Basic Infinite Scrolling
کار با "preventDefault()"
Working with "preventDefault()"
درک مراحل "گرفتن" و "حباب زدن".
Understanding "Capturing" & "Bubbling" Phases
انتشار رویداد و "stopPropagation()"
Event Propagation & "stopPropagation()"
استفاده از رویداد Delegation
Using Event Delegation
راه اندازی عناصر DOM به صورت برنامه ای
Triggering DOM Elements Programmatically
توابع مدیریت رویداد و "این"
Event Handler Functions & "this"
مناسبت ها
Events
کشیدن و رها کردن - تئوری
Drag & Drop - Theory
پیکربندی عناصر قابل کشیدن
Configuring Draggable Elements
علامت گذاری "منطقه سقوط"
Marking the "Drop Area"
رها کردن و جابجایی داده ها + عناصر
Dropping & Moving Data + Elements
تنظیمات فایرفاکس
Firefox Adjustments
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
مفاهیم عملکرد پیشرفته
Advanced Function Concepts
معرفی ماژول
Module Introduction
توابع خالص و عوارض جانبی
Pure Functions & Side-Effects
توابع ناخالص در مقابل توابع خالص
Impure vs Pure Functions
توابع کارخانه
Factory Functions
بسته شدن
Closures
بسته شدن در عمل
Closures in Practice
بسته شدن و مدیریت حافظه
Closures & Memory Management
اختیاری: IIFEs
Optional: IIFEs
معرفی "بازگشت"
Introducing "Recursion"
بازگشت پیشرفته
Advanced Recursion
توابع پیشرفته
Advanced Functions
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
مفاهیم عملکرد پیشرفته
Advanced Function Concepts
معرفی ماژول
Module Introduction
توابع خالص و عوارض جانبی
Pure Functions & Side-Effects
توابع ناخالص در مقابل توابع خالص
Impure vs Pure Functions
توابع کارخانه
Factory Functions
بسته شدن
Closures
بسته شدن در عمل
Closures in Practice
بسته شدن و مدیریت حافظه
Closures & Memory Management
اختیاری: IIFEs
Optional: IIFEs
معرفی "بازگشت"
Introducing "Recursion"
بازگشت پیشرفته
Advanced Recursion
توابع پیشرفته
Advanced Functions
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
اطلاعات بیشتر در مورد اعداد و رشته ها
More on Numbers & Strings
معرفی ماژول
Module Introduction
نحوه کار و رفتار اعداد در جاوا اسکریپت
How Numbers Work & Behave in JavaScript
دقت نقطه شناور (Im)
Floating Point (Im)Precision
نوع BigInt
The BigInt Type
اشیاء جهانی "تعداد" و "ریاضی".
The Global "Number" and "Math" Objects
مثال: ایجاد عدد تصادفی بین حداقل/حداکثر
Example: Generate Random Number Between Min/ Max
کاوش در روش های رشته ای
Exploring String Methods
الگوهای برچسب گذاری شده
Tagged Templates
معرفی عبارات منظم ("RegEx")
Introducing Regular Expressions ("RegEx")
بیشتر در مورد عبارات منظم
More on Regular Expressions
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
اطلاعات بیشتر در مورد اعداد و رشته ها
More on Numbers & Strings
معرفی ماژول
Module Introduction
نحوه کار و رفتار اعداد در جاوا اسکریپت
How Numbers Work & Behave in JavaScript
دقت نقطه شناور (Im)
Floating Point (Im)Precision
نوع BigInt
The BigInt Type
اشیاء جهانی "تعداد" و "ریاضی".
The Global "Number" and "Math" Objects
مثال: ایجاد عدد تصادفی بین حداقل/حداکثر
Example: Generate Random Number Between Min/ Max
کاوش در روش های رشته ای
Exploring String Methods
الگوهای برچسب گذاری شده
Tagged Templates
معرفی عبارات منظم ("RegEx")
Introducing Regular Expressions ("RegEx")
بیشتر در مورد عبارات منظم
More on Regular Expressions
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
Async JavaScript: Promises & Callbacks
Async JavaScript: Promises & Callbacks
معرفی ماژول
Module Introduction
درک اجرای کد همزمان ("کد همگام سازی")
Understanding Synchronous Code Execution ("Sync Code")
درک اجرای کد ناهمزمان ("کد Async")
Understanding Asynchronous Code Execution ("Async Code")
کد مسدود کردن و "حلقه رویداد"
Blocking Code & The "Event Loop"
همگام سازی + کد Async - دستور اجرا
Sync + Async Code - The Execution Order
تماس های متعدد و تنظیم زمان خروج (0)
Multiple Callbacks & setTimeout(0)
کد ناهمزمان
Asynchronous Code
شروع با وعده ها
Getting Started with Promises
زنجیر زدن وعده های متعدد
Chaining Multiple Promises
Promise Error Handling
Promise Error Handling
ایالات قول و "بالاخره"
Promise States & "finally"
Async/منتظر
Async/ await
همگامسازی/انتظار و مدیریت خطا
Async/ await & Error Handling
Async/await vs "Raw Promises"
Async/ await vs "Raw Promises"
Promise.all()، Promise.race() و غیره.
Promise.all(), Promise.race() etc.
Promises & async/در انتظار
Promises & async/ await
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
Async JavaScript: Promises & Callbacks
Async JavaScript: Promises & Callbacks
معرفی ماژول
Module Introduction
درک اجرای کد همزمان ("کد همگام سازی")
Understanding Synchronous Code Execution ("Sync Code")
درک اجرای کد ناهمزمان ("کد Async")
Understanding Asynchronous Code Execution ("Async Code")
کد مسدود کردن و "حلقه رویداد"
Blocking Code & The "Event Loop"
همگام سازی + کد Async - دستور اجرا
Sync + Async Code - The Execution Order
تماس های متعدد و تنظیم زمان خروج (0)
Multiple Callbacks & setTimeout(0)
کد ناهمزمان
Asynchronous Code
شروع با وعده ها
Getting Started with Promises
زنجیر زدن وعده های متعدد
Chaining Multiple Promises
Promise Error Handling
Promise Error Handling
ایالات قول و "بالاخره"
Promise States & "finally"
Async/منتظر
Async/ await
همگامسازی/انتظار و مدیریت خطا
Async/ await & Error Handling
Async/await vs "Raw Promises"
Async/ await vs "Raw Promises"
Promise.all()، Promise.race() و غیره.
Promise.all(), Promise.race() etc.
Promises & async/در انتظار
Promises & async/ await
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
کار با درخواست های Http
Working with Http Requests
معرفی ماژول
Module Introduction
چی چرا
What & Why
چگونه وب کار می کند
How The Web Works
پیشینه بیشتر در مورد Http
More Background about Http
شروع کار با Http
Getting Started with Http
ارسال درخواست GET
Sending a GET Request
داده های JSON و تجزیه داده ها
JSON Data & Parsing Data
JSON Data Deep Dive
JSON Data Deep Dive
درخواستهای Http امیدوارکننده (با XMLHttpRequest)
Promisifying Http Requests (with XMLHttpRequest)
ارسال داده با درخواست POST
Sending Data with a POST Request
راه اندازی درخواست ها از طریق UI
Triggering Requests via the UI
دکمه "واکشی" همیشه اضافه می شود
The "Fetch" Button Always Appends
ارسال درخواست DELETE
Sending a DELETE Request
رسیدگی به خطاها
Handling Errors
با استفاده از fetch() API
Using the fetch() API
ارسال داده ها با fetch() API
POSTing Data with the fetch() API
اضافه کردن هدر درخواست
Adding Request Headers
fetch() و رسیدگی به خطا
fetch() & Error Handling
XMLHttpRequest در مقابل fetch()
XMLHttpRequest vs fetch()
کار با FormData
Working with FormData
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
کار با درخواست های Http
Working with Http Requests
معرفی ماژول
Module Introduction
چی چرا
What & Why
چگونه وب کار می کند
How The Web Works
پیشینه بیشتر در مورد Http
More Background about Http
شروع کار با Http
Getting Started with Http
ارسال درخواست GET
Sending a GET Request
داده های JSON و تجزیه داده ها
JSON Data & Parsing Data
JSON Data Deep Dive
JSON Data Deep Dive
درخواستهای Http امیدوارکننده (با XMLHttpRequest)
Promisifying Http Requests (with XMLHttpRequest)
ارسال داده با درخواست POST
Sending Data with a POST Request
راه اندازی درخواست ها از طریق UI
Triggering Requests via the UI
دکمه "واکشی" همیشه اضافه می شود
The "Fetch" Button Always Appends
ارسال درخواست DELETE
Sending a DELETE Request
رسیدگی به خطاها
Handling Errors
با استفاده از fetch() API
Using the fetch() API
ارسال داده ها با fetch() API
POSTing Data with the fetch() API
اضافه کردن هدر درخواست
Adding Request Headers
fetch() و رسیدگی به خطا
fetch() & Error Handling
XMLHttpRequest در مقابل fetch()
XMLHttpRequest vs fetch()
کار با FormData
Working with FormData
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
کار با کتابخانه های جاوا اسکریپت
Working with JavaScript Libraries
معرفی ماژول
Module Introduction
چی چرا
What & Why
افزودن کتابخانه ها (مثال: lodash)
Adding Libraries (Example: lodash)
مثال: jQuery
Example: jQuery
کشف کتابخانه ها
Discovering Libraries
کتابخانه Axios و درخواست های Http
Axios Library & Http Requests
ملاحظات کتابخانه شخص ثالث
Third-Party Library Considerations
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
کار با کتابخانه های جاوا اسکریپت
Working with JavaScript Libraries
معرفی ماژول
Module Introduction
چی چرا
What & Why
افزودن کتابخانه ها (مثال: lodash)
Adding Libraries (Example: lodash)
مثال: jQuery
Example: jQuery
کشف کتابخانه ها
Discovering Libraries
کتابخانه Axios و درخواست های Http
Axios Library & Http Requests
ملاحظات کتابخانه شخص ثالث
Third-Party Library Considerations
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
جاوا اسکریپت ماژولار (کار با ماژول ها)
Modular JavaScript (Working with Modules)
معرفی ماژول
Module Introduction
تقسیم کد به روشی کمتر از بهینه
Splitting Code in a Sub-optimal Way
اولین قدم به سمت ماژول های جاوا اسکریپت
A First Step Towards JavaScript Modules
ما به یک سرور توسعه نیاز داریم!
We Need a Development Server!
اولین کار واردات/صادرات
First import / export Work
تغییر همه فایل ها برای استفاده از ماژول ها
Switching All Files To Use Modules
بیشتر به نام تغییرات نحو صادراتی
More Named Export Syntax Variations
کار با صادرات پیش فرض
Working With Default Exports
واردات پویا و تقسیم کد
Dynamic Imports & Code Splitting
کد ماژول چه زمانی اجرا می شود؟
When Does Module Code Execute?
دامنه ماژول و globalThis
Module Scope & globalThis
ماژول ها
Modules
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
جاوا اسکریپت ماژولار (کار با ماژول ها)
Modular JavaScript (Working with Modules)
معرفی ماژول
Module Introduction
تقسیم کد به روشی کمتر از بهینه
Splitting Code in a Sub-optimal Way
اولین قدم به سمت ماژول های جاوا اسکریپت
A First Step Towards JavaScript Modules
ما به یک سرور توسعه نیاز داریم!
We Need a Development Server!
اولین کار واردات/صادرات
First import / export Work
تغییر همه فایل ها برای استفاده از ماژول ها
Switching All Files To Use Modules
بیشتر به نام تغییرات نحو صادراتی
More Named Export Syntax Variations
کار با صادرات پیش فرض
Working With Default Exports
واردات پویا و تقسیم کد
Dynamic Imports & Code Splitting
کد ماژول چه زمانی اجرا می شود؟
When Does Module Code Execute?
دامنه ماژول و globalThis
Module Scope & globalThis
ماژول ها
Modules
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
ابزار جاوا اسکریپت و گردش کار
JavaScript Tooling & Workflows
معرفی ماژول
Module Introduction
محدودیت های پروژه و چرا ما به ابزار نیاز داریم
Project Limitations & Why We Need Tools
بررسی اجمالی گردش کار
Workflow Overview
نکته ای در مورد نسخه NodeJS
A Note About The NodeJS Version
راه اندازی یک پروژه npm
Setting Up a npm Project
کار با بسته های npm
Working with npm Packages
پرده زدن با ESLint
Linting with ESLint
در حال پیکربندی ESLint
Configuring ESLint
مهم: نسخه Webpack
Important: Webpack Version
بستهبندی با Webpack
Bundling with Webpack
پاداش: چندین امتیاز ورودی
Bonus: Multiple Entry Points
حالت توسعه و رفع "بارگذاری تنبل"
Development Mode & Fixing "Lazy Loading"
با استفاده از webpack-dev-server
Using webpack-dev-server
ایجاد نقشه های منبع
Generating Sourcemaps
ساختمان برای تولید
Building For Production
بهینه سازی های نهایی
Final Optimizations
استفاده از بسته های شخص ثالث با npm و Webpack
Using Third Party Packages with npm & Webpack
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
ابزار جاوا اسکریپت و گردش کار
JavaScript Tooling & Workflows
معرفی ماژول
Module Introduction
محدودیت های پروژه و چرا ما به ابزار نیاز داریم
Project Limitations & Why We Need Tools
بررسی اجمالی گردش کار
Workflow Overview
نکته ای در مورد نسخه NodeJS
A Note About The NodeJS Version
راه اندازی یک پروژه npm
Setting Up a npm Project
کار با بسته های npm
Working with npm Packages
پرده زدن با ESLint
Linting with ESLint
در حال پیکربندی ESLint
Configuring ESLint
مهم: نسخه Webpack
Important: Webpack Version
بستهبندی با Webpack
Bundling with Webpack
پاداش: چندین امتیاز ورودی
Bonus: Multiple Entry Points
حالت توسعه و رفع "بارگذاری تنبل"
Development Mode & Fixing "Lazy Loading"
با استفاده از webpack-dev-server
Using webpack-dev-server
ایجاد نقشه های منبع
Generating Sourcemaps
ساختمان برای تولید
Building For Production
بهینه سازی های نهایی
Final Optimizations
استفاده از بسته های شخص ثالث با npm و Webpack
Using Third Party Packages with npm & Webpack
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
استفاده از فضای ذخیره سازی مرورگر
Utilizing Browser Storage
معرفی ماژول
Module Introduction
گزینه های ذخیره سازی مرورگر
Browser Storage Options
localStorage & sessionStorage
localStorage & sessionStorage
شروع کار با کوکی ها
Getting Started with Cookies
کار با کوکی ها
Working with Cookies
شروع کار با IndexedDB
Getting Started with IndexedDB
کار با IndexedDB
Working with IndexedDB
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
استفاده از فضای ذخیره سازی مرورگر
Utilizing Browser Storage
معرفی ماژول
Module Introduction
گزینه های ذخیره سازی مرورگر
Browser Storage Options
localStorage & sessionStorage
localStorage & sessionStorage
شروع کار با کوکی ها
Getting Started with Cookies
کار با کوکی ها
Working with Cookies
شروع کار با IndexedDB
Getting Started with IndexedDB
کار با IndexedDB
Working with IndexedDB
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
پشتیبانی از جاوا اسکریپت و مرورگر
JavaScript & Browser Support
معرفی ماژول
Module Introduction
"پشتیبانی مرورگر" در مورد چیست؟
What Is "Browser Support" About?
تعیین پشتیبانی مرورگر برای یک ویژگی جاوا اسکریپت
Determining Browser Support For A JavaScript Feature
تعیین پشتیبانی مورد نیاز
Determining Required Support
راه حل: تشخیص ویژگی + کد بازگشتی
Solution: Feature Detection + Fallback Code
راه حل: استفاده از Polyfills
Solution: Using Polyfills
راه حل: انتقال کد
Solution: Transpiling Code
بهبود: شناسایی خودکار + افزودن Polyfills
Improvement: Automatically Detect + Add Polyfills
پشتیبانی خارج از مرورگرها چطور؟
What about Support Outside of Browsers?
پشتیبانی مرورگر خارج از فایل های جاوا اسکریپت
Browser Support Outside of JavaScript Files
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
پشتیبانی از جاوا اسکریپت و مرورگر
JavaScript & Browser Support
معرفی ماژول
Module Introduction
"پشتیبانی مرورگر" در مورد چیست؟
What Is "Browser Support" About?
تعیین پشتیبانی مرورگر برای یک ویژگی جاوا اسکریپت
Determining Browser Support For A JavaScript Feature
تعیین پشتیبانی مورد نیاز
Determining Required Support
راه حل: تشخیص ویژگی + کد بازگشتی
Solution: Feature Detection + Fallback Code
راه حل: استفاده از Polyfills
Solution: Using Polyfills
راه حل: انتقال کد
Solution: Transpiling Code
بهبود: شناسایی خودکار + افزودن Polyfills
Improvement: Automatically Detect + Add Polyfills
پشتیبانی خارج از مرورگرها چطور؟
What about Support Outside of Browsers?
پشتیبانی مرورگر خارج از فایل های جاوا اسکریپت
Browser Support Outside of JavaScript Files
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
زمان تمرین: برنامه مکان من را به اشتراک بگذارید
Time to Practice: Share My Place App
معرفی ماژول
Module Introduction
توجه: از نسخه LTS NodeJS استفاده کنید
Note: Use the LTS Version of NodeJS
راه اندازی پروژه
Setting Up the Project
دریافت دسترسی DOM
Getting DOM Access
دریافت مکان کاربر
Getting the User Location
افزودن بازخورد (نمایش یک مدال)
Adding Feedback (Showing a Modal)
پنهان کردن مدال
Hiding the Modal
رندر کردن نقشه با گوگل مپ
Rendering a Map with Google Maps
ادامه بدون کارت اعتباری
Continuing without a Credit Card
پیدا کردن آدرس و گرفتن مختصات
Finding an Address & Getting the Coordinates
تبدیل ورودی کاربر به مختصات
Converting User Input to Coordinates
ایجاد پیوند "اشتراک گذاری مکان".
Creating a "Share Place" Link
کپی کردن پیوند در کلیپ بورد
Copying the Link to the Clipboard
رندر کردن صفحه "مکان مشترک".
Rendering the "Shared Place" Screen
منابع و لینک های مفید
Useful Resources & Links
زمان تمرین: برنامه مکان من را به اشتراک بگذارید
Time to Practice: Share My Place App
معرفی ماژول
Module Introduction
توجه: از نسخه LTS NodeJS استفاده کنید
Note: Use the LTS Version of NodeJS
راه اندازی پروژه
Setting Up the Project
دریافت دسترسی DOM
Getting DOM Access
دریافت مکان کاربر
Getting the User Location
افزودن بازخورد (نمایش یک مدال)
Adding Feedback (Showing a Modal)
پنهان کردن مدال
Hiding the Modal
رندر کردن نقشه با گوگل مپ
Rendering a Map with Google Maps
ادامه بدون کارت اعتباری
Continuing without a Credit Card
پیدا کردن آدرس و گرفتن مختصات
Finding an Address & Getting the Coordinates
تبدیل ورودی کاربر به مختصات
Converting User Input to Coordinates
ایجاد پیوند "اشتراک گذاری مکان".
Creating a "Share Place" Link
کپی کردن پیوند در کلیپ بورد
Copying the Link to the Clipboard
رندر کردن صفحه "مکان مشترک".
Rendering the "Shared Place" Screen
منابع و لینک های مفید
Useful Resources & Links
کار با فریم ورک های جاوا اسکریپت
Working with JavaScript Frameworks
معرفی ماژول
Module Introduction
چی و چرا؟
What and Why?
ایده پشت React.js
The Idea Behind React.js
تجزیه و تحلیل یک پروژه React
Analysing a React Project
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
کار با فریم ورک های جاوا اسکریپت
Working with JavaScript Frameworks
معرفی ماژول
Module Introduction
چی و چرا؟
What and Why?
ایده پشت React.js
The Idea Behind React.js
تجزیه و تحلیل یک پروژه React
Analysing a React Project
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
فرابرنامهنویسی: نمادها، تکرارکنندهها، ژنراتورها، Reflect API و Proxy API
Meta-Programming: Symbols, Iterators, Generators, Reflect API & Proxy API
معرفی ماژول
Module Introduction
درک نمادها
Understanding Symbols
نمادهای معروف
Well-known Symbols
درک تکرار کننده ها
Understanding Iterators
ژنراتورها و اشیاء تکرار شونده
Generators & Iterable Objects
خلاصه ژنراتورها و مثالهای تکرارشونده داخلی
Generators Summary & Built-in Iterables Examples
Reflect API
The Reflect API
Proxy API و اولین "Trap"
The Proxy API and a First "Trap"
کار با Proxy Traps
Working with Proxy Traps
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
فرابرنامهنویسی: نمادها، تکرارکنندهها، ژنراتورها، Reflect API و Proxy API
Meta-Programming: Symbols, Iterators, Generators, Reflect API & Proxy API
معرفی ماژول
Module Introduction
درک نمادها
Understanding Symbols
نمادهای معروف
Well-known Symbols
درک تکرار کننده ها
Understanding Iterators
ژنراتورها و اشیاء تکرار شونده
Generators & Iterable Objects
خلاصه ژنراتورها و مثالهای تکرارشونده داخلی
Generators Summary & Built-in Iterables Examples
Reflect API
The Reflect API
Proxy API و اولین "Trap"
The Proxy API and a First "Trap"
کار با Proxy Traps
Working with Proxy Traps
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
Node.js: مقدمه
Node.js: An Introduction
معرفی ماژول
Module Introduction
جاوا اسکریپت یک زبان میزبانی شده است
JavaScript is a Hosted Language
نصب و مبانی
Installation & Basics
آشنایی با ماژول ها و دسترسی به فایل
Understanding Modules & File Access
کار با درخواست های Http ورودی
Working with Incoming Http Requests
ارسال پاسخ ها (داده های HTML)
Sending Responses (HTML Data)
تجزیه داده های ورودی
Parsing Incoming Data
معرفی و نصب Express.js
Introducing & Installing Express.js
Express.js: اصول
Express.js: The Basics
استخراج داده ها
Extracting Data
رندر HTML سمت سرور با الگوها و EJS
Rendering Server-side HTML with Templates & EJS
تقویت پروژه ما
Enhancing Our Project
اضافه کردن مسیرهای REST اولیه
Adding Basic REST Routes
درک CORS (اشتراک گذاری منابع متقاطع)
Understanding CORS (Cross Origin Resource Sharing)
ارسال شناسه موقعیت مکانی به Frontend
Sending the Location ID to the Frontend
افزودن مسیر GET Location
Adding the GET Location Route
معرفی MongoDB (پایگاه داده)
Introducing MongoDB (Database)
مدیریت خطای NodeJS
NodeJS Error Handling
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
Node.js: مقدمه
Node.js: An Introduction
معرفی ماژول
Module Introduction
جاوا اسکریپت یک زبان میزبانی شده است
JavaScript is a Hosted Language
نصب و مبانی
Installation & Basics
آشنایی با ماژول ها و دسترسی به فایل
Understanding Modules & File Access
کار با درخواست های Http ورودی
Working with Incoming Http Requests
ارسال پاسخ ها (داده های HTML)
Sending Responses (HTML Data)
تجزیه داده های ورودی
Parsing Incoming Data
معرفی و نصب Express.js
Introducing & Installing Express.js
Express.js: اصول
Express.js: The Basics
استخراج داده ها
Extracting Data
رندر HTML سمت سرور با الگوها و EJS
Rendering Server-side HTML with Templates & EJS
تقویت پروژه ما
Enhancing Our Project
اضافه کردن مسیرهای REST اولیه
Adding Basic REST Routes
درک CORS (اشتراک گذاری منابع متقاطع)
Understanding CORS (Cross Origin Resource Sharing)
ارسال شناسه موقعیت مکانی به Frontend
Sending the Location ID to the Frontend
افزودن مسیر GET Location
Adding the GET Location Route
معرفی MongoDB (پایگاه داده)
Introducing MongoDB (Database)
مدیریت خطای NodeJS
NodeJS Error Handling
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
امنیت
Security
معرفی ماژول
Module Introduction
نمای کلی حفره های امنیتی و افشای داده ها در کد شما
Security Hole Overview & Exposing Data in your Code
حملات اسکریپت بین سایتی (XSS)
Cross-Site Scripting Attacks (XSS)
کتابخانه های شخص ثالث و XSS
Third-Party Libraries & XSS
XSS و افشای جزئیات محرمانه
XSS & Exposing Confidential Details
حملات CSRF (جعل درخواست متقابل سایت)
CSRF Attacks (Cross Site Request Forgery)
CORS (اشتراک گذاری منابع متقاطع)
CORS (Cross Origin Resource Sharing)
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
امنیت
Security
معرفی ماژول
Module Introduction
نمای کلی حفره های امنیتی و افشای داده ها در کد شما
Security Hole Overview & Exposing Data in your Code
حملات اسکریپت بین سایتی (XSS)
Cross-Site Scripting Attacks (XSS)
کتابخانه های شخص ثالث و XSS
Third-Party Libraries & XSS
XSS و افشای جزئیات محرمانه
XSS & Exposing Confidential Details
حملات CSRF (جعل درخواست متقابل سایت)
CSRF Attacks (Cross Site Request Forgery)
CORS (اشتراک گذاری منابع متقاطع)
CORS (Cross Origin Resource Sharing)
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
استقرار کد جاوا اسکریپت
Deploying JavaScript Code
معرفی ماژول
Module Introduction
مراحل استقرار
Deployment Steps
انواع مختلف وب سایت
Different Types of Websites
مثال: استقرار میزبان استاتیک (بدون کد سمت سرور)
Example: Static Host Deployment (no Server-side Code)
تزریق اسکریپت به صورت خودکار به HTML وارد می شود
Injecting Script Imports Into HTML Automatically
مثال: استقرار صفحه پویا (با کد سمت سرور)
Example: Dynamic Page Deployment (with Server-side Code)
منابع و لینک های مفید
Useful Resources & Links
استقرار کد جاوا اسکریپت
Deploying JavaScript Code
معرفی ماژول
Module Introduction
مراحل استقرار
Deployment Steps
انواع مختلف وب سایت
Different Types of Websites
مثال: استقرار میزبان استاتیک (بدون کد سمت سرور)
Example: Static Host Deployment (no Server-side Code)
تزریق اسکریپت به صورت خودکار به HTML وارد می شود
Injecting Script Imports Into HTML Automatically
مثال: استقرار صفحه پویا (با کد سمت سرور)
Example: Dynamic Page Deployment (with Server-side Code)
منابع و لینک های مفید
Useful Resources & Links
عملکرد و بهینه سازی ها
Performance & Optimizations
معرفی ماژول
Module Introduction
"بهینه سازی عملکرد" درباره چیست؟
What is "Performance Optimization" About?
پتانسیل های بهینه سازی
Optimization Potentials
اندازه گیری کارایی
Measuring Performance
غواصی در ابزارهای توسعه دهنده مرورگر (برای اندازه گیری عملکرد)
Diving Into The Browser Devtools (for Performance Measuring)
منابع بیشتر
Further Resources
آماده سازی تنظیمات تست
Preparing The Testing Setup
بهینه سازی زمان راه اندازی و استفاده از کد/پوشش
Optimizing Startup Time & Code Usage / Coverage
به روز رسانی DOM به درستی
Updating The DOM Correctly
به روز رسانی لیست ها به درستی
Updating Lists Correctly
بهینه سازی چیزهای کوچک
Optimizing The Small Things
بهینه سازی های کوچک (دوبار فکر کنید!)
Micro-Optimizations (Think Twice!)
پیدا کردن و رفع نشت حافظه
Finding & Fixing Memory Leaks
بهینه سازی عملکرد سمت سرور
Server-side Performance Optimizations
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
عملکرد و بهینه سازی ها
Performance & Optimizations
معرفی ماژول
Module Introduction
"بهینه سازی عملکرد" درباره چیست؟
What is "Performance Optimization" About?
پتانسیل های بهینه سازی
Optimization Potentials
اندازه گیری کارایی
Measuring Performance
غواصی در ابزارهای توسعه دهنده مرورگر (برای اندازه گیری عملکرد)
Diving Into The Browser Devtools (for Performance Measuring)
منابع بیشتر
Further Resources
آماده سازی تنظیمات تست
Preparing The Testing Setup
بهینه سازی زمان راه اندازی و استفاده از کد/پوشش
Optimizing Startup Time & Code Usage / Coverage
به روز رسانی DOM به درستی
Updating The DOM Correctly
به روز رسانی لیست ها به درستی
Updating Lists Correctly
بهینه سازی چیزهای کوچک
Optimizing The Small Things
بهینه سازی های کوچک (دوبار فکر کنید!)
Micro-Optimizations (Think Twice!)
پیدا کردن و رفع نشت حافظه
Finding & Fixing Memory Leaks
بهینه سازی عملکرد سمت سرور
Server-side Performance Optimizations
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
مقدمه ای بر تست
Introduction to Testing
معرفی ماژول
Module Introduction
تست چیست؟ چرا مهم است؟
What Is Testing? Why Does It Matter?
تنظیم تست
Testing Setup
نوشتن و اجرای آزمون های واحد
Writing & Running Unit Tests
نوشتن و اجرای تست های یکپارچه سازی
Writing & Running Integration Tests
نوشتن و اجرای تست های e2e
Writing & Running e2e Tests
برخورد با کد Async
Dealing with Async Code
کار با Mocks
Working with Mocks
منابع و لینک های مفید
Useful Resources & Links
مقدمه ای بر تست
Introduction to Testing
معرفی ماژول
Module Introduction
تست چیست؟ چرا مهم است؟
What Is Testing? Why Does It Matter?
تنظیم تست
Testing Setup
نوشتن و اجرای آزمون های واحد
Writing & Running Unit Tests
نوشتن و اجرای تست های یکپارچه سازی
Writing & Running Integration Tests
نوشتن و اجرای تست های e2e
Writing & Running e2e Tests
برخورد با کد Async
Dealing with Async Code
کار با Mocks
Working with Mocks
منابع و لینک های مفید
Useful Resources & Links
امتیاز: پارادایم های برنامه نویسی (روشی در مقابل شی گرا در مقابل عملکردی)
Bonus: Programming Paradigms (Procedural vs Object Oriented vs Functional)
معرفی ماژول
Module Introduction
پارادایم های برنامه نویسی چیست؟
What are Programming Paradigms?
برنامه ریزی رویه ای در عمل
Procedural Programming in Practice
برنامه نویسی شی گرا در عمل
Object Oriented Programming in Practice
برنامه نویسی تابعی در عمل
Functional Programming in Practice
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
امتیاز: پارادایم های برنامه نویسی (روشی در مقابل شی گرا در مقابل عملکردی)
Bonus: Programming Paradigms (Procedural vs Object Oriented vs Functional)
معرفی ماژول
Module Introduction
پارادایم های برنامه نویسی چیست؟
What are Programming Paradigms?
برنامه ریزی رویه ای در عمل
Procedural Programming in Practice
برنامه نویسی شی گرا در عمل
Object Oriented Programming in Practice
برنامه نویسی تابعی در عمل
Functional Programming in Practice
بسته شدن
Wrap Up
منابع و لینک های مفید
Useful Resources & Links
جایزه: ساختار داده ها و الگوریتم ها مقدمه
Bonus: Data Structures & Algorithms Introduction
معرفی ماژول
Module Introduction
"ساختارهای داده" و "الگوریتم" چیست؟
What are "Data Structures" & "Algorithms"?
یک مثال اول
A First Example
حل یک مشکل متفاوت
Solving the Same Problem Differently
عملکرد و نماد "Big O".
Performance & The "Big O" Notation
پیچیدگی های زمانی بیشتر و مقایسه الگوریتم ها
More Time Complexities & Comparing Algorithms
اطلاعات بیشتر در مورد Big O
More on Big O
نمونه های بیشتر
More Examples
غواصی در ساختارهای داده و پیچیدگی های زمانی
Diving into Data Structures & Time Complexities
کجا بیشتر بیاموزیم و جمع بندی کنیم
Where to Learn More & Wrap Up
منابع و لینک های مفید
Useful Resources & Links
جایزه: ساختار داده ها و الگوریتم ها مقدمه
Bonus: Data Structures & Algorithms Introduction
معرفی ماژول
Module Introduction
"ساختارهای داده" و "الگوریتم" چیست؟
What are "Data Structures" & "Algorithms"?
یک مثال اول
A First Example
حل یک مشکل متفاوت
Solving the Same Problem Differently
عملکرد و نماد "Big O".
Performance & The "Big O" Notation
پیچیدگی های زمانی بیشتر و مقایسه الگوریتم ها
More Time Complexities & Comparing Algorithms
اطلاعات بیشتر در مورد Big O
More on Big O
نمونه های بیشتر
More Examples
غواصی در ساختارهای داده و پیچیدگی های زمانی
Diving into Data Structures & Time Complexities
کجا بیشتر بیاموزیم و جمع بندی کنیم
Where to Learn More & Wrap Up
منابع و لینک های مفید
Useful Resources & Links
امتیاز: معرفی TypeScript
Bonus: TypeScript Introduction
معرفی ماژول
Module Introduction
TypeScript چیست و چرا از آن استفاده می کنید؟
What is TypeScript and Why would you use it?
کار با Types
Working with Types
انواع هسته و غواصی عمیق تر
Core Types & Diving Deeper
انواع شی، انواع آرایه و انواع توابع
Object Types, Array Types & Function Types
انواع پیشرفته (انواع تحت اللفظی، انواع اتحادیه، Enums)
Advanced Types (Literal Types, Union Types, Enums)
کلاس ها و رابط ها
Classes & Interfaces
انواع ژنریک
Generic Types
پیکربندی کامپایلر TypeScript
Configuring the TypeScript Compiler
منابع و لینک های مفید
Useful Resources & Links
امتیاز: معرفی TypeScript
Bonus: TypeScript Introduction
معرفی ماژول
Module Introduction
TypeScript چیست و چرا از آن استفاده می کنید؟
What is TypeScript and Why would you use it?
کار با Types
Working with Types
انواع هسته و غواصی عمیق تر
Core Types & Diving Deeper
انواع شی، انواع آرایه و انواع توابع
Object Types, Array Types & Function Types
انواع پیشرفته (انواع تحت اللفظی، انواع اتحادیه، Enums)
Advanced Types (Literal Types, Union Types, Enums)
کلاس ها و رابط ها
Classes & Interfaces
انواع ژنریک
Generic Types
پیکربندی کامپایلر TypeScript
Configuring the TypeScript Compiler
منابع و لینک های مفید
Useful Resources & Links
امتیاز: اجزای وب
Bonus: Web Components
معرفی ماژول
Module Introduction
اجزای وب در عمل
Web Components in Action
کامپوننت های وب چیست؟
What are Web Components?
چرا کامپوننت های وب؟
Why Web Components?
شروع شدن!
Getting Started!
پشتیبانی از مرورگر اجزای وب
Web Component Browser Support
راه اندازی توسعه ما
Our Development Setup
اولین عنصر سفارشی
A First Custom Element
تعامل با DOM اطراف
Interacting with the Surrounding DOM
درک چرخه عمر عنصر سفارشی
Understanding the Custom Element Lifecycle
استفاده از "connectedCallback" برای دسترسی DOM
Using "connectedCallback" for DOM Access
گوش دادن به رویدادهای داخل کامپوننت
Listening to Events Inside the Component
استفاده از ویژگی ها در عناصر سفارشی
Using Attributes on Custom Elements
سبک دادن به عناصر ما
Styling our Elements
کار با "Shadow DOM"
Working with the "Shadow DOM"
اضافه کردن یک قالب HTML
Adding an HTML Template
استفاده از اسلات ها
Using Slots
تعریف قالب در جاوا اسکریپت
Defining the Template in JavaScript
استفاده از تگ های سبک در Shadow DOM
Using Style Tags in the Shadow DOM
گسترش عناصر داخلی
Extending Built-in Elements
زمان برای تمرین - مبانی
Time to Practice - The Basics
مراحل بعدی
The Next Steps
درک Shadow DOM Projection
Understanding Shadow DOM Projection
حالت دادن به محتوای «اسلات» خارج از Shadow DOM
Styling "slot" Content Outside of the Shadow DOM
حالت دادن به محتوای «اسلات» در داخل Shadow DOM
Styling "slot" Content Inside of the Shadow DOM
استایل دادن به مؤلفه میزبان
Styling the Host Component
یک ظاهر طراحی میزبان شرطی
Conditional Host Styling
طراحی با در نظر گرفتن محتوای میزبان
Styling with the Host Content in Mind
استایل پویا هوشمند با متغیرهای CSS
Smart Dynamic Styling with CSS Variables
تمیز کردن یک ظاهر طراحی کلی
Cleaning Up the Overall Styling
مشاهده تغییرات صفت
Observing Attribute Changes
تنظیم رفتار مؤلفه بر اساس تغییرات ویژگی
Adjusting the Component Behavior Upon Attribute Changes
استفاده از "disconnectedCallback"
Using "disconnectedCallback"
افزودن یک متد render().
Adding a render() Method
تنظیم نهایی
Final Adjustment
مراحل بعدی
The Next Steps
ایجاد مؤلفه اساسی مدال
Creating the Basic Modal Component
افزودن ظرف مدال
Adding the Modal Container
سبک دادن به عناصر مدال
Styling the Modal Elements
اضافه کردن برخی از منطق برنامه عمومی
Adding Some General App Logic
باز کردن Modal از طریق CSS
Opening the Modal via CSS
روشها و ویژگیهای عمومی
Public Methods & Properties
آشنایی با اسلات های نامگذاری شده
Understanding Named Slots
گوش دادن به تغییرات محتوای اسلات
Listening to Slot Content Changes
بستن Modal
Closing the Modal
ارسال رویدادهای سفارشی
Dispatching Custom Events
پیکربندی رویدادهای سفارشی
Configuring Custom Events
تمومش کردن!
Finishing it up!
منابع و لینک های مفید
Useful Resources & Links
امتیاز: اجزای وب
Bonus: Web Components
معرفی ماژول
Module Introduction
اجزای وب در عمل
Web Components in Action
کامپوننت های وب چیست؟
What are Web Components?
چرا کامپوننت های وب؟
Why Web Components?
شروع شدن!
Getting Started!
پشتیبانی از مرورگر اجزای وب
Web Component Browser Support
راه اندازی توسعه ما
Our Development Setup
اولین عنصر سفارشی
A First Custom Element
تعامل با DOM اطراف
Interacting with the Surrounding DOM
درک چرخه عمر عنصر سفارشی
Understanding the Custom Element Lifecycle
استفاده از "connectedCallback" برای دسترسی DOM
Using "connectedCallback" for DOM Access
گوش دادن به رویدادهای داخل کامپوننت
Listening to Events Inside the Component
استفاده از ویژگی ها در عناصر سفارشی
Using Attributes on Custom Elements
سبک دادن به عناصر ما
Styling our Elements
کار با "Shadow DOM"
Working with the "Shadow DOM"
اضافه کردن یک قالب HTML
Adding an HTML Template
استفاده از اسلات ها
Using Slots
تعریف قالب در جاوا اسکریپت
Defining the Template in JavaScript
استفاده از تگ های سبک در Shadow DOM
Using Style Tags in the Shadow DOM
گسترش عناصر داخلی
Extending Built-in Elements
زمان برای تمرین - مبانی
Time to Practice - The Basics
مراحل بعدی
The Next Steps
درک Shadow DOM Projection
Understanding Shadow DOM Projection
حالت دادن به محتوای «اسلات» خارج از Shadow DOM
Styling "slot" Content Outside of the Shadow DOM
حالت دادن به محتوای «اسلات» در داخل Shadow DOM
Styling "slot" Content Inside of the Shadow DOM
استایل دادن به مؤلفه میزبان
Styling the Host Component
یک ظاهر طراحی میزبان شرطی
Conditional Host Styling
طراحی با در نظر گرفتن محتوای میزبان
Styling with the Host Content in Mind
استایل پویا هوشمند با متغیرهای CSS
Smart Dynamic Styling with CSS Variables
تمیز کردن یک ظاهر طراحی کلی
Cleaning Up the Overall Styling
مشاهده تغییرات صفت
Observing Attribute Changes
تنظیم رفتار مؤلفه بر اساس تغییرات ویژگی
Adjusting the Component Behavior Upon Attribute Changes
استفاده از "disconnectedCallback"
Using "disconnectedCallback"
افزودن یک متد render().
Adding a render() Method
تنظیم نهایی
Final Adjustment
مراحل بعدی
The Next Steps
ایجاد مؤلفه اساسی مدال
Creating the Basic Modal Component
افزودن ظرف مدال
Adding the Modal Container
سبک دادن به عناصر مدال
Styling the Modal Elements
اضافه کردن برخی از منطق برنامه عمومی
Adding Some General App Logic
باز کردن Modal از طریق CSS
Opening the Modal via CSS
روشها و ویژگیهای عمومی
Public Methods & Properties
آشنایی با اسلات های نامگذاری شده
Understanding Named Slots
گوش دادن به تغییرات محتوای اسلات
Listening to Slot Content Changes
بستن Modal
Closing the Modal
ارسال رویدادهای سفارشی
Dispatching Custom Events
پیکربندی رویدادهای سفارشی
Configuring Custom Events
تمومش کردن!
Finishing it up!
منابع و لینک های مفید
Useful Resources & Links
جمع بندی و مراحل بعدی
Roundup & Next Steps
خلاصه دوره
Course Roundup
جایزه! (مرحله اجمالی مراحل بعدی/موضوعات دیگر)
Bonus! (Next Steps Overview / Other Topics)
جمع بندی و مراحل بعدی
Roundup & Next Steps
خلاصه دوره
Course Roundup
جایزه! (مرحله اجمالی مراحل بعدی/موضوعات دیگر)
Bonus! (Next Steps Overview / Other Topics)
نمایش نظرات