تفاوت == و === در جاوااسکریپت و دلیل پرهیز از تساوی سست
آموزش

تفاوت == و === در جاوااسکریپت و دلیل پرهیز از تساوی سست

مقایسه مقادیر در جاوااسکریپت با عملگرهای دو مساوی و سه مساوی رفتار کاملاً متفاوتی در تبدیل نوع داده ایجاد می‌کند.

تحریریه‌ی دینا کد
نویسنده
۶ دقیقه مطالعه۰ بازدید
اشتراک گذاری۰
فهرست مطالب
  1. ۱قاعده رسمی تساوی اکید و سست بر پایه مستندات استاندارد
  2. ۲نمونه کد و خروجی رفتاری در موتور جاوااسکریپت
  3. ۳خطاهای متداول در تبدیل خودکار مقادیر
  4. ۴مقایسه مراجع در اشیاء و آرایه‌ها
  5. ۵قدم بعدی برای درک عمیق رفتار موتور جاوااسکریپت

وقتی در جاوااسکریپت دو مقدار را مقایسه می‌کنید، شرطی که انتظار دارید برقرار باشد گاهی به نتیجه‌ای کاملاً غیرمنتظره منجر می‌شود. برای نمونه عبارت ۰ == '' مقدار درستی برمی‌گرداند، اما ۰ === '' نادرست ارزیابی می‌شود. این تفاوت رفتاری یکی از سرچشمه‌های اصلی باگ‌های پنهان در برنامه‌های تحت وب است.

عملگر == تساوی سست یا Loose Equality نام دارد و پیش از سنجش دو مقدار، در صورت ناهمسان بودن نوع آن‌ها، تلاش می‌کند یکی را به نوع دیگری تبدیل کند. در مقابل، عملگر === تساوی اکید یا Strict Equality نامیده می‌شود و اگر نوع دو طرف برابر نباشد، بلافاصله نتیجه نادرست را برمی‌گرداند.

قاعده رسمی تساوی اکید و سست بر پایه مستندات استاندارد

طبق استاندارد جاوااسکریپت در شبکه توسعه‌دهندگان موزیلا (MDN)، رفتار دو عملگر به این شیوه تعریف شده است:

عملگر === هیچ نوع تبدیل مقداری انجام نمی‌دهد. تنها زمانی دو داده با این عملگر برابرند که نوع یکسان و مقدار برابر داشته باشند. دو استثنای عددی مهم در این زمینه وجود دارد؛ اول اینکه NaN با هیچ مقداری حتی خودش برابر نیست و عبارت NaN === NaN خروجی نادرست می‌دهد. دوم اینکه عدد منفی صفر و مثبت صفر با وجود علامت متفاوت، با === برابر شناخته می‌شوند.

عملگر == تقارن دارد، اما در صورت ناهمخوانی نوع دو طرف، فرایند تبدیل نوع اجباری (Type Coercion) را به راه می‌اندازد. قواعد این تبدیل به شرح زیر است:

اگر یک سمت بولی باشد، ابتدا به عدد تبدیل می‌شود؛ مقدار true به عدد ۱ و مقدار false به عدد ۰ بدل خواهد شد. اگر مقایسه میان یک رشته و یک عدد باشد، جاوااسکریپت رشته را به عدد تبدیل می‌کند. همچنین دو مقدار null و undefined در مقایسه سست با یکدیگر برابرند و با هیچ مقدار دیگری در زبان برابر دانسته نمی‌شوند.

نمونه کد و خروجی رفتاری در موتور جاوااسکریپت

رفتار این دو عملگر را در سناریوهای رایج کدنویسی مشاهده کنید:

javascript// مقایسه با تساوی سست
console.log(۴۲ == '۴۲'); // خروجی: true (رشته به عدد تبدیل شد)
console.log(۰ == false); // خروجی: true (مقدار بولی به عدد ۰ تبدیل شد)
console.log('' == ۰); // خروجی: true (رشته خالی به عدد ۰ تبدیل شد)
console.log(null == undefined); // خروجی: true (قاعده استثنای دوگانه)

// مقایسه با تساوی اکید
console.log(۴۲ === '۴۲'); // خروجی: false (نوع داده‌ها یکسان نیست)
console.log(۰ === false); // خروجی: false (عدد با بولی مقایسه شد)
console.log('' === ۰); // خروجی: false (رشته با عدد تفاوت دارد)
console.log(null === undefined); // خروجی: false (دو نوع کاملاً مجزا)

در نمونه‌های بالا، عملگر سه مساوی بدون دستکاری مقدار ورودی، تصمیم دقیق‌تری گرفته است. از همین رو، قواعد کدنویسی مدرن توصیه می‌کنند همیشه از === استفاده کنید، مگر در شرایط خاصی که دلیل معینی برای تبدیل خودکار نوع وجود داشته باشد.

خطاهای متداول در تبدیل خودکار مقادیر

رفتار عملگر دو مساوی هنگام برخورد با آرایه‌ها و اشیاء ابهام بیشتری به وجود می‌آورد. وقتی یک آرایه با مقدار بولی مقایسه می‌شود، زنجیره‌ای از تبدیل‌ها اتفاق می‌افتد که پیش‌بینی آن برای برنامه‌نویس دشوار است:

javascript// بررسی تله‌های رایج مقایسه سست
console.log([] == false); // خروجی: true
console.log([] == ![]); // خروجی: true

دلیل خروجی سطر دوم این است که ابتدا عملگر نقیض روی آرایه خالی اجرا شده و آن را به false تبدیل می‌کند. سپس عبارت به [] == false ساده می‌شود. در این مرحله، آرایه خالی تبدیل به رشته خالی و در نهایت تبدیل به عدد ۰ می‌شود و با سمت راست که آن هم تبدیل به عدد ۰ شده، تطابق پیدا می‌کند. تساوی اکید تمام این فرایندهای پیچیده را مسدود می‌سازد و از ایجاد خطاهای منطقی نامحسوس جلوگیری می‌کند.

اشتباه متداول دیگر هنگام بررسی NaN رخ می‌دهد. برای سنجش اینکه یک مقدار عدد نامعتبر است یا خیر، نه دو مساوی پاسخ می‌دهد و نه سه مساوی:

javascriptconst invalidNumber = NaN;
console.log(invalidNumber === NaN); // خروجی: false
console.log(Number.isNaN(invalidNumber)); // خروجی: true

برای تشخیص مقدار NaN باید از متد اختصاصی Number.isNaN() استفاده شود و تساوی مستقیم پاسخی نمی‌دهد.

مقایسه مراجع در اشیاء و آرایه‌ها

نکته دیگری که اهمیت زیادی دارد، مقایسه مقادیر غیرپریمیتیو (Non-primitive) است. هر دو عملگر == و === در برخورد با دو شیء یا دو آرایه متمایز، آدرس حافظه آن‌ها را می‌سنجند نه ساختار درونی‌شان را:

javascriptconst firstUser = { id: ۱ };
const secondUser = { id: ۱ };

console.log(firstUser === secondUser); // خروجی: false
console.log(firstUser == secondUser); // خروجی: false

const referenceUser = firstUser;
console.log(firstUser === referenceUser); // خروجی: true

حتی اگر ویژگی‌ها و مقادیر دو شیء دقیقاً شبیه به یکدیگر باشند، چون در دو فضای حافظه جدا ساخته شده‌اند، هیچ‌یک از این دو عملگر آن‌ها را برابر ارزیابی نمی‌کنند. بررسی شباهت عمیق محتوای اشیاء نیازمند تابع مقایسه بازگشتی است.

قدم بعدی برای درک عمیق رفتار موتور جاوااسکریپت

تسلط بر تفاوت‌های ساختاری سیستم نوع‌ها و شیوه مدیریت داده‌ها در حافظه، مهارتی بنیادی برای هر توسعه‌دهنده فرانت‌اند و بک‌اند است. اگر می‌خواهید جریان داده، رویدادها، توابع ناهمگام و الگوهای پیشرفته زبان را از پایه‌ترین مفاهیم بیاموزید، می‌توانید سرفصل‌های دوره جاوااسکریپت از صفر تا برنامه‌نویس را بررسی کنید.

تحریریه‌ی دینا کد
نویسنده

نظرها

اولین نفری باشید که نظر می‌دهد
برای ثبت نظر وارد شوید

سؤالتان را بپرسید یا تجربه‌تان را بنویسید تا نویسنده‌ی مطلب پاسخ بدهد.

مطالب مرتبط

از همین دسته
دستور GROUP BY در SQL چطور کار می‌کند
آموزش

دستور GROUP BY در SQL چطور کار می‌کند

عملکرد دستور GROUP BY در SQL و نحوه گروه‌بندی سطرها به همراه توابع تجمیعی را با مثال‌های واقعی یاد بگیرید.

تحریریه‌ی دینا کد۵ دقیقه
کلید اصلی و کلید خارجی در SQL
آموزش

کلید اصلی و کلید خارجی در SQL

راهنمای تعریف کلید اصلی و کلید خارجی در SQL برای تضمین یکتایی سطرها و حفظ یکپارچگی ارجاعی داده‌ها.

تحریریه‌ی دینا کد۶ دقیقه