استایل‌ دادن به خروجی‌های جاوااسکریپت در کنسول

زیبا جلوه‌ دادن یک متن به اثربخشی آن کمک بسیاری می‌کند اما دولوپرها گاهی اوقات نیاز دارند تا متونی را صرفاً جهت اطلاع خود در جایی چاپ کنند که یکی از آن‌ها کنسول مرورگر است که باز هم زیباسازی آن خالی از لطف نیست که در همین راستا در ادامه به ارائهٔ ترفندی می‌‌پردازیم که کمک می‌کند خروجی کدهای جاوااسکریپت را در کنسول مرورگر استایل دهیم.

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

console.log("%c%s",
            "color: red; background: yellow; font-size: 24px;",
            "WARNING!");

اولین آرگومان ورودی (یعنی %c%s) استایل متن را مشخص می‌کند، دومین آرگومان رنگ را تعیین کرده که در کد بالا red (قرمز) می‌باشد، سومین آرگومان بک‌گراند را مشخص می‌کند که در کد بالا yellow (زرد) است و آرگمان بعدی نیز سایز نوشته و آخرین آرگومان خودِ خروجی را نشان می‌دهد که در کد بالا !WARNING است. اگر این کد را در کنسول جاوااسکریپت اجرا کنید، کلمۀ !WARNING را به‌ رنگ قرمز، با بک‌گراند زرد و فونت نسبتاً بزرگی خواهید دید.