برنامه نویسی

عبور از کد: یک کاوش سرگرم کننده در مورد اشتباهات مبتدی جاوا اسکریپت

آیا فقط انگشتان پای خود را در اقیانوس جاوا اسکریپت فرو می‌کنید؟ خود را برای سفرهای غیرمنتظره بر فریبنده ترین سنگریزه ها آماده کنید.

بازی پنهان و جستجوی “این”

“این” جاوا اسکریپت کمی آفتاب پرست است که اغلب به عنوان “دکتر جکیل و آقای هاید” جاوا اسکریپت شناخته می شود. هنگامی که “this” خارج از یک شی استفاده می شود، به شی جهانی اشاره دارد. اما در یک متد، “this” به شیئی اشاره دارد که متد را فراخوانی می کند. اگر مراقب نباشید، می توانید خود را در حال انجام یک بازی بی پایان مخفی کاری با “این” بیابید.

راه اشتباه:

function car() {
    this.speed = 100;
    setTimeout(function() { 
        console.log(this.speed); // Output: undefined 
    }, 1000);
}
new car();
وارد حالت تمام صفحه شوید

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

راه راست: از تابع پیکان استفاده کنید.

function car() {
    this.speed = 100;
    setTimeout(() => { 
        console.log(this.speed); // Output: 100 
    }, 1000);
}
new car();
وارد حالت تمام صفحه شوید

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

بحران وجودی: تعریف نشده در مقابل صفر

آه، بحث قدیمی. آیا شما غایب هستید (تهی) یا فقط تعریف نشده است؟ در حالی که null یک مقدار اختصاص داده شده است که به معنای “بدون مقدار یا بدون شی” است، undefined به این معنی است که یک متغیر اعلام شده است اما هنوز مقداری به آن اختصاص داده نشده است. می توان گفت تهی در مورد پوچی آن فلسفی است، در حالی که تعریف نشده به طرز سعادتمندانه ای نادان است.

let emptyFridge = null; // You know it's empty
let myFridge; // Where did it go?
وارد حالت تمام صفحه شوید

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

ساعت شلوغی: بارگیری اسکریپت ها قبل از شروع مهمانی DOM

آن مردی نباشید که قبل از میزبان در مهمانی حاضر می شود. بارگذاری اسکریپت ها قبل از بارگیری DOM مانند رفتن روی صحنه بدون اسکریپت است. بازیگران (عناصر HTML) هنوز برای شما آماده نیستند!

راه اشتباه:

<script src="myscript.js"></script>
<body>
<!-- Here be dragons...or maybe just HTML -->
</body>
وارد حالت تمام صفحه شوید

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

بلاقاصله:

<body>
<!-- Here be dragons...or maybe just HTML -->
<script src="myscript.js"></script>
</body>
وارد حالت تمام صفحه شوید

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

نام گذاری متغیرها: یک تراژیکمدی

جاده جهنم برنامه نویسی با متغیرهای بد نام هموار شده است. به خاطر داشته باشید: ‘x’، ‘temp’، ‘stuff’ نام های واقعی نیستند، آنها خط خطی های یک کدنویس آشفته هستند.

راه اشتباه:

let x = 10; // What does 'x' even mean?
وارد حالت تمام صفحه شوید

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

بلاقاصله:

let numberOfApples = 10; // Oh, now it makes sense!
وارد حالت تمام صفحه شوید

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

قسمت اضافی چمدان: بیانیه های اضافی دیگر

همیشه وسوسه انگیز است که آن جفت جوراب اضافی را “فقط در مورد” بسته بندی کنید. اما با عبارات دیگر، بیشتر همیشه خوشایندتر نیست. کدنویسی نباشید که وقتی یک روز آفتابی است، کولاک را جمع کنید.

راه اشتباه:

if (condition) {
  return x;
} else {
  return y;
}
وارد حالت تمام صفحه شوید

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

بلاقاصله:

if (condition) {
  return x;
}
return y;
وارد حالت تمام صفحه شوید

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

دوقلوهای فریبنده: اپراتورهای واگذاری و برابری

عملگر تخصیص (=) فرزند مطیع است که مقداری را برای یک متغیر تعیین می کند. عملگر برابری (==) یک عملگر کنجکاوی است که بررسی می کند آیا دو مقدار برابر هستند یا خیر. اما مراقب دوقلوی شیطانی آنها (===) باشید که برابری و نوع داده را بررسی می کند! فریب شباهت خانوادگی آنها را نخورید.

let x = 10; // Assigns the value 10 to x

console.log(x == "10"); // Returns true
console.log(x === "10"); // Returns false, different datatypes
وارد حالت تمام صفحه شوید

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

از سفر خود با جاوا اسکریپت لذت ببرید. و به یاد داشته باشید، همه ما روی همین سنگ ها لگد زده ایم!

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

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

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

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