با متد های console در جاوا اسکریپت بیشتر آشنا بشید
توی این مقاله قصد دارم از متد های زیر مجموعه دستور console صحبت کنم.محال ممکن برنامه نویس باشید و از دستور console.log استفاده نکرده باشید.هرجای برنامه نویسی توی جاوا اسکریپت که به مشکل می خورید بدون شک یا سراغ alert میرید یا console.log. اما این دستور متدهای دیگه هم داره که بد نیست باهم یه مروری سر همشون داشته باشیم.
تو قدم اول بیاید با هم این موضوع بررسی کنیم که چرا از console object استفاده می کنیم؟
تو جواب این سوال باید بگم که این object دسترسی به کنسول اشکال زدایی مرورگر را فراهم می کنه، جایی که می توانید مقادیر متغیرهایی را که در کد خودتون استفاده کردید، یا خروجی api هاتون ، یا ورودی متدهاتون و ... چاپ کنید. من کاملا مطمئن هستم که بیشتر ما توسعه دهندگان از console.log () برای چاپ مقادیر در کنسول مرورگر خود استفاده می کنیم. log تنها یک متد از شی کنسول هستش. چندین متد دیگه وجود داره که بسیار مفیدن.
1. console.log()
این متد عمدتا برای چاپ مقادیر منتقل شده به کنسول استفاده می شه. از هر نوع می توان در داخل log استفاده کرد ، رشته ، آرایه ، object ، بولین و غیره.
console.log('JavaScript');
console.log(7);
console.log(true);
console.log(null);
console.log(undefined);
console.log([1, 2, 3]);
console.log({a: 1, b: 2, c: 3});
2. console.error()
این متد هنگام تست کد مفید هستش. برای ورود خطاها به کنسول مرورگر استفاده می شه. به طور پیش فرض ، پیام خطا با رنگ قرمز برجسته نشون داده میشه.
console.error('Error found');
3. console.warn()
معمولاً برای اعلام هشدارها به کنسول کمک می کنه. به طور پیش فرض ، پیام هشدار با رنگ زرد برجسته نمایش داده میشه.این متد برای تست کد هم استفاده می شه.
console.warn('Warning!');
4. console.clear()
این متد برای پاک کردن کنسول استفاده می شه. در صورت گرفتگی کنسول با پیام / خطا / هشدار، اغلب از این استفاده می شه. کنسول پاک می شه و پیامی که پاک شد در کنسول پیغام Console was cleared نمایش داده میشه.
console.clear()
5. console.time() و console.timeEnd()
هر دو این متدها کنار همدیگه استفاده می شن. هر زمان که بخواهیم از زمان صرف شده توسط یک بلوک یا یک تابع بدونیم ، می تونیم از روش های time () و timeEnd () استفاده کنیم. هر دو این توابع یک رشته را به عنوان یک پارامتر در نظر می گیرن. برای اندازه گیری زمان اطمینان حاصل کنید که از رشته یکسانی برای هر دو عملکرد استفاده کرده اید.
console.time('timer');
const hello = function(){
console.log('Hello Console!');
}
const bye = function(){
console.log('Bye Console!');
}
hello(); // calling hello();
bye(); // calling bye();
console.timeEnd('timer');
6. console.table()
این متد برای خوانایی بهتر ، یک جدول درون کنسول ایجاد می کنه. یک جدول به طور خودکار برای یک آرایه یا یک شی تولید می شه.
console.table({a: 1, b: 2, c: 3});
7. console.count()
این را می توان در داخل یک حلقه استفاده کنیم تا بررسی کند که یک مقدار خاص چند بار اجرا شده.
for(let i=0; i<3; i++){
console.count(i);
}
8. console.group() و console.groupEnd()
این متد group () و groupEnd () به ما اجازه می دن تا محتویات در یک بلوک جداگانه گروه بندی کنیم ، که تورفتگی خواهد داشت. دقیقاً مانند time () و timeEnd ()نوشته میشه و متدها و بلوک داخل این دو متد میادش.
console.group('group1');
console.warn('warning');
console.error('error');
console.log('I belong to a group');
console.groupEnd('group1');
console.log('I dont belong to any group');
استایل دادن به دستورات log
همچنین می تونید Styling را به مقادیر نمایشی توی یه کنسول اضافه کنید تا این مقادیر قشنگ بشن. خیلی ساده است شما فقط باید یک استایل CSS را به عنوان پارامتر دوم به عملکرد log () اضافه کنید ، در حالی که اولین پارامتر را با٪ c شروع می کنید. سبک ها جایگزین٪ c در log اعلام میشن.
const spacing = '10px';
const styles = `padding: ${spacing}; background-color: white; color: red; font-style: italic; border: 1px solid black; font-size: 2em;`;
console.log('%cI am a styled log', styles);
خب به پایان این مقاله رسیدیم ، امیدوارم که نهایت استفاده توی این مقاله برده باشید و تونسته باشم اطلاعات خوبی بهتون منتقل کرده باشم.
ممنون از توجهتون :)
مطلبی دیگر از این انتشارات
اچ تی ام ال چیست؟ چگونگی کار با اچ تی ام ال
مطلبی دیگر از این انتشارات
معرفی ، تفاوت ها و شباهت های localStorage و sessionStorage در جاوا اسکریپت
مطلبی دیگر از این انتشارات
ng-content