آموزش JavaScript

مقدمه Introduction

• JavaScript: خاکی که وب مدرن از آن رشد می کند JavaScript: The soil from which the modern web grows

• نحوه استفاده از پرونده های تمرینی How to use the exercise files

1. جاوا اسکریپت: یک مقدمه مختصر 1. JavaScript: A Brief Introduction

• JavaScript: اولین تماس JavaScript: First contact

• پیمایش در چشم انداز JS Navigating the JS landscape

• ابزار کار با JavaScript Tools for working with JavaScript

• روکش و قالب بندی Linting and formatting

• کنسول مرورگر را بشناسید Get to know the browser console

• اصول زبان جاوا اسکریپت JavaScript language basics

• یادگیری جاوا اسکریپت به عقب Learning JavaScript backward

2. بالا و در حال اجرا با JS 2. Up and Running with JS

• جاوا اسکریپت در یک سند HTML JavaScript in an HTML document

• JavaScript به عنوان یک پرونده خارجی JavaScript as an external file

• بارگیری مدرن جاوا اسکریپت Modern JavaScript loading

• ماژول های JavaScript JavaScript modules

3. اشیا 3. Objects

• اشیا: یک مقدمه عملی Objects: A practical introduction

• اشیا Java جاوا اسکریپت: نسخه کد JavaScript objects: The code version

• ظروف شی Object containers

• خواص شی Object properties

• دسترسی به اشیا Accessing objects

• دسترسی به خصوصیات شی Accessing object properties

• تمرین: یک شی جدید بسازید Practice: Build a new object

• روش های شی Object methods

• تمرین: یک روش جدید بسازید Practice: Build a new method

• کلاسها: نقشه های اصلی اشیا Classes: Object blueprints

• سازندگان اشیا Object constructors

• تمرین: با سازنده یک شی جدید بسازید Practice: Build a new object with a constructor

• اشیا Global جهانی Global objects

• چالش: نوع جدیدی از شی را ایجاد کنید Challenge: Create a new object type

• راه حل: یک نوع شی جدید ایجاد کنید Solution: Create a new object type

4. نوار کناری: خروجی رشته 4. Sidebar: String Output

• متن و متغیرها را با اصطلاحات الگوی واقعی مخلوط کنید Mix text and variables with template literals

• خروجی رشته سنتی Traditional string output

5. DOM 5. DOM

• DOM: مدل شی Doc سند DOM: The Document Object Model

• با استفاده از متد querySelector به عناصر دسترسی پیدا کنید Access elements with querySelector methods

• با استفاده از روشهای قدیمی به عناصر دسترسی پیدا کنید Access elements using older methods

• تمرین: یک عنصر پیدا کنید Practice: Find an element

• اصلاح کلاسهای عنصر Modifying element classes

• ویژگی های Attributes

• سبک خطی Inline style

• تمرین: کلاسها و ویژگی ها و سبک ها را اصلاح کنید Practice: Modify classes and attributes, and styles

• عناصر DOM را اضافه کنید Add DOM elements

• چالش: عنصر جدیدی اضافه کنید Challenge: Add a new element

• راه حل: یک عنصر جدید اضافه کنید Solution: Add a new element

6. نوار کناری: متغیرها و انواع داده ها 6. Sidebar: Variables and Data Types

• متغیرها: ظروف برای همه چیز Variables: Containers for everything

• Var Var

• محدوده Scope

• اجازه دهید Let

• ساخت Const

• انواع داده ها Data types

• انتساب در مقابل مقایسه Assignment vs. comparison

• اپراتورهای ریاضی Math operators

7. آرایه ها 7. Arrays

• آرایه ها توضیح داد Arrays explained

• آرایه های کد شده Arrays in code

• روش های آرایه Array methods

• چالش: آرایه ای را بسازید و اصلاح کنید Challenge: Build and modify an array

• راه حل: آرایه ای را بسازید و اصلاح کنید Solution: Build and modify an array

8. توابع و روش ها 8. Functions and Methods

• عملکرد دنیای واقعی The real-world function

• توابع و روش ها Functions and methods

• یک عملکرد استاندارد A standard function

• عملکرد پیکان The arrow function

• توابع پیکان و "این" Arrow functions and "this"

• تمرین: ایجاد یک عملکرد Practice: Build a function

• داده ها را به یک تابع با پارامترها منتقل کنید Pass data to a function with parameters

• مقادیر را از یک تابع برگردانید Return values from a function

• تمرین: مقادیر بین توابع را عبور دهید Practice: Pass values between functions

• پاسخگویی Callbacks

• شرطی اگر بیانیه دیگری باشد Conditional if...else statement

• عملگرهای منطقی Logical operators

• بیانیه سوئیچ شرطی Conditional switch statement

• مرور مطالب Looping through content

• با استفاده از روش آرایه نقشه () Using the map() array method

• چالش: ایجاد یک عملکرد پیشرفته Challenge: Build an advanced function

• راه حل: یک عملکرد پیشرفته بسازید Solution: Build an advanced function

9. وقایع 9. Events

• وقایع DOM توضیح داده شده است DOM events explained

• رویدادهای معمولی DOM Typical DOM events

• شنوندگان رویداد Event listeners

• تمرین: با شنوندگان رویداد آزمایش کنید Practice: Experiment with event listeners

• شنوندگان رویداد پیشرفته و "این" Advanced event listeners and "this"

• بحث را از شنوندگان رویداد بگذرانید Pass arguments through event listeners

• چالش: یک شنونده رویداد ایجاد کنید Challenge: Create an event listener

• راه حل: یک شنونده رویداد ایجاد کنید Solution: Create an event listener

10. عیب یابی و اعتبار سنجی JS 10. Troubleshooting and Validating JS

• عیب یابی JavaScript در مرورگر Troubleshooting JavaScript in the browser

• ایجاد مفهوم React Making sense of a React component

نتیجه Conclusion

• گام های بعدی سفر یادگیری شما Next steps on your learning journey