وجود خطا در کد کاملا طبیعی است. شما در آینده برنامه نویسی با جاوا اسکریپت اغلب با خطاهایی در کد خود مواجه می شوید، حتی برنامه نویسان حرفه ای نیز زمان زیادی را صرف عیب یابی و رفع کدهای خود می کنند. اما در مرورگر، کاربران به طور پیش فرض خطاهای جاوا اسکریپت را نمی بینند. بنابراین اگر مشکلی در کد ما وجود داشته باشد، هنگام اجرای آن در مرورگر متوجه خطا نمی شویم.
برای مشاهده خطاها و دریافت بسیاری از اطلاعات مفید دیگر در مورد اسکریپت ها، می توانید به «ابزارهای توسعه دهندهمرورگرها، استفاده از این ابزار مجموعه ای از چندین ابزار مفید توسعه دهنده است که اطلاعات و امکانات مفید زیادی را برای شما به عنوان یک برنامه نویس و توسعه دهنده فراهم می کند.
ابزارهای کنسول توسعه دهنده بسیار مفید هستند و ویژگی های زیادی دارند. برای شروع، نحوه باز کردن آنها، بررسی خطاها و اجرای دستورات جاوا اسکریپت را یاد خواهیم گرفت. بنابراین با من نبودم همراه باشید
کنسول برنامه نویس کروم
برای درک بهتر مشکل، فایل bug.html را باز کنید.
شما می توانید محتوای صفحه را بدون مشکل مشاهده کنید اما در واقع یک خطای جاوا اسکریپت در این صفحه وجود دارد که به دلیل سیاست های مرورگر از چشم بازدیدکننده پنهان می ماند. برای مشاهده این خطا و جزئیات بیشتر، باید کنسول توسعه دهنده مرورگر را باز کنیم.
کلید باز کردن کنسول توسعه دهنده F12 در ویندوز یا Cmd+Opt+J در مک، روی ضربه بزنید تا پنجره برنامه‌نویس باز شود.
کنسول توسعه دهنده تقریبا در همه مرورگرها ساختاری مشابه تصویر بالا، چندین تب مختلف دارد که هر کدام برای فعالیت خاصی طراحی شده اند. در تصویر بالا و بررسی خطا باید به دو نکته توجه کرد.
در خط بعدی کنسول و بعد از علامت > می توانید دستورات جاوا اسکریپت را وارد کرده و کلید را فشار دهید وارد آنها را اجرا کنید. در آینده به طور واضح در مورد اشکال زدایی و کار با کنسول توسعه دهنده در قسمت های مختلف توضیح خواهیم داد.
برای نوشتن چند خط و سپس اجرا، باید خطوط را با آن بپیچید Shift+Enter هایلایت کرده و در خط آخر Enter را فشار دهید
کنسول توسعه دهنده در فایرفاکس، اج
در موزیلا و فایرفاکس و تقریبا اکثر مرورگرها از کلید F12 برای دسترسی به کنسول توسعه دهنده استفاده می شود. اگر کار با یکی از آنها را یاد بگیرید، می توانید تقریباً با کنسول همه مرورگرها به خوبی کار کنید.
کنسول توسعه دهنده در سافاری
مرورگر سافاری که مرورگر پیش فرض سیستم عامل اپل است کمی با سایر مرورگرها متفاوت است، در این مرورگر کنسول توسعه به صورت پیش فرض غیرفعال است و قبل از استفاده باید آن را فعال کنید. برای فعال سازی مراحل زیر را دنبال کنید:
خلاصه درس:
خطاهای جاوا اسکریپت مانند سایر زبان های برنامه نویسی به کاربر نمایش داده نمی شود و کاربر را از نمایش صفحه وب باز نمی دارد. چیزی که در این آموزش به آن پرداختیم، کنسول توسعه دهنده در مرورگرهای مختلف، نحوه باز کردن و فعال کردن آن و تست یک خطای ساده جاوا اسکریپت بود. در آموزش های آینده هر بخش از کنسول توسعه دهنده را با جزئیات بیشتری پوشش خواهیم داد.
برای یادگیری بیشتر ورزش کنید:
تست درس:
اگر مطالب بالا را به خوبی درک کرده اید و برای درس بعدی آماده هستید، بهتر است قبل از رفتن به درس بعدی خود را با تست ساده زیر محک بزنید.
تست آموزشی کنسول برنامه‌نویس Google Forms
