برنامه نویسی

فقط در جاوا اسکریپت فقط یاد بگیرید: نقشه راه من از صفر تا پیشرفته

سلام devs! 👋
من اخیراً رفتم همه در مورد یادگیری JavaScript – از اصول مطلق تا مفاهیم موجود در نحوه عملکرد JS در زیر کاپوت. اما این پیچش است:

❌ من “همه چیز” را یاد نگرفتم.
✅ من یاد گرفتم فقط آنچه واقعاً مهم است برای ساخت پروژه های دنیای واقعی و مصاحبه های ترک.

بگذارید آنچه را که روی آن تمرکز کردم به اشتراک بگذارم


1⃣ varبا letبا const: تفاوت واقعی چیست؟

var x = 10;
let y = 20;
const z = 30;

x = 100; // ✅ allowed
y = 200; // ✅ allowed
z = 300; // ❌ Error: Assignment to constant variable
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

  • var عملکردی است ، در حالی که let واد const بلوک های بلوک هستند.
  • const نمی توان مجدداً منصوب شد.
  • استفاده کردن let وت const – فراموش کن var در JS مدرن.

2 ⃣ بلند کردن 🏗

console.log(a); // undefined
var a = 10;

sayHi(); // "Hi!"
function sayHi() {
  console.log("Hi!");
}
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

  • var بلند می شود تعریف نشده
  • توابع کاملاً بلند می شوند

3⃣ انواع داده ها

// Primitives
let num = 5;
let str = "Hello";

// Reference
let obj = { name: "Dev" };
let arr = [1, 2, 3];
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

  • یاد بگیرید تفاوت بین انواع بدوی و مرجع
  • انواع مرجع در حافظه پشته ذخیره می شوند

4⃣ شرط بندی و حلقه ها

if (true) {
  console.log("Runs!");
}

for (let i = 0; i < 3; i++) {
  console.log(i); // 0, 1, 2
}
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

  • ارباب ifبا elseبا switchبا forبا whileبا do while

5⃣ توابع = قدرت

function greet(name) {
  return `Hello, ${name}`;
}

const greetArrow = (name) => `Hello, ${name}`;
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

  • شهروندان درجه یک
  • می توانید آنها را منتقل کنید ، آنها را برگردانید ، آنها را اختصاص دهید
  • درک کردن callbackبا arrowبا pureبا higher-orderبا IIFE

6⃣ آرایه ها و اشیاء

let nums = [1, 2, 3];
nums.push(4); // [1, 2, 3, 4]

let user = { name: "Dev", age: 22 };
user.city = "Pune";
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

  • روشهای باید دانستن: pushبا popبا shiftبا unshiftبا mapبا filterبا reduce
  • تخریب دسترسی را ساده می کند
const { name } = user;
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید


7⃣ زمینه و دامنه اجرای

function outer() {
  let a = 10;

  function inner() {
    console.log(a); // 10
  }

  inner();
}
outer();
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

  • دامنه و بسته های واژگانی
  • درک پشته ، پشته و تخصیص حافظه را درک کنید

8 thisبا callبا applyبا bind 🤯

const obj = {
  name: "Dev",
  greet: function () {
    console.log(`Hello, ${this.name}`);
  },
};

obj.greet(); // Hello, Dev
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

  • بدانید چگونه this در زمینه های مختلف رفتار می کند
  • استفاده کردن .call()با .apply()با .bind() کنترل this

9⃣ دستکاری DOM 📱

const btn = document.getElementById("clickMe");
btn.addEventListener("click", () => {
  document.body.style.background = "lightblue";
});
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

  • عناصر HTML را انتخاب ، ویرایش و سبک انتخاب ، ویرایش و سبک کنید
  • تعامل را در جلوی خود ایجاد کنید

🔟 ES6+ ویژگی ها

function greet(name = "Guest") {
  console.log(`Hello, ${name}`);
}

const user = { name: "Dev", age: 22 };
const { name, age } = user;
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

  • پارامترهای پیش فرض
  • تخریب
  • اپراتورهای پخش/استراحت

🔄 جاوا اسکریپت ناهمزمان

setTimeout(() => {
  console.log("Runs after 2s");
}, 2000);

// Promises
const fetchData = () =>
  new Promise((resolve, reject) => {
    resolve("Data fetched!");
  });

fetchData().then(console.log);
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

  • یاد گرفتن setTimeoutبا Promisesبا async/await
  • حلقه رویداد ، API های وب و بازگشت به تماس را درک کنید

👷 نمونه اولیه و OOP در JS

function Person(name) {
  this.name = name;
}

Person.prototype.sayHello = function () {
  console.log(`Hi, I'm ${this.name}`);
};

const user = new Person("Dev");
user.sayHello(); // Hi, I'm Dev
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

  • توابع سازنده
  • نمونه ها و وراثت
  • new کلمه کلیدی و نحوه ایجاد اشیاء

📁 جایزه: کد تمرین من

من تمام نمونه های خود را برای دسترسی آسان در یک repo github قرار داده ام:
🔗 https://github.com/mahendra11111111/javascript_practiceset


👋 کلمات نهایی

JavaScript می تواند احساس غرق شدن کند – اما اگر به آن پایبند باشید واقعاً مهم است، شما سریع تولید می کنید.

نوشته های مشابه

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

دکمه بازگشت به بالا