جواب:

تنها نکته‌ی مهم این کد این است که متغیر error identifier در بلاک catch، فقط داخل همان بلاک در دسترس است (block scope).

بنابراین زمانی که می‌خواهیم مقدار متغیر x را بیرون بلاک catch در کنسول چاپ کنیم، error دریافت می‌کنیم.

اما متغیر y را با کلمه کلیدی var تعریف کرده‌ایم. بنابراین متغیر y گلوبال خواهد بود و حتی بیرون از بلاک catch هم می‌توانیم مقدار آن را در کنسول چاپ کنیم.

به این ترتیب با اجرای این کد ابتدا مقدار متغیر y که عدد 20 است چاپ می‌شود و سپس error دریافت می‌کنیم.

🔺منبع راز طراحان | کاری از InVision ✨

https://muz.li/

#link #design #inspiration

@ProGraphs

​​ویژگی download برای تگ a در HTML.

زمانی که روی یک لینک با ویژگی download کلیک می‌کنیم،‌ مرورگر به جای navigate کردن به آدرس موردنظر، آن را دانلود می‌کند!

همچنین با تعیین یک مقدار برای ویژگی download می‌توانیم نام فایل دانلود شده را تغییر دهیم.

#quicktip #html

@ProGraphs

Pasteapp: Fast, collaborative presentations for creative teams.

Paste makes slides simple so you can focus on what’s important. Try it free :)

https://pasteapp.com/

#link #presentation

@ProGraphs

این قطعه کد برای چک کردن اینکه یک متغیر آبجکت است یا نه نوشته شده است.
آیا مشکلی در این کد می‌بینید؟ روش بهتری برای این کار می‌شناسید؟

#interviewquestion #js

@ProGraphs

🔺طرح‌های این مدلی رو از سایت زیر دانلود کنین. 🎊

https://www.drawkit.io/

#link #illustration

@ProGraphs

جواب:

عملگر typeof از قسمت‌هایی در جاوااسکریپت هست که خلاقیت فوق‌العاده‌ای در طراحی آن به کار رفته و سعی شده در شرایط مختلف ما را غافلگیر کند 😄.

کد این سوال می‌تواند در این شرایط برخلاف تصور ما عمل کند:

1- عملگر typeof مقدار null را به عنوان یک آبجکت تشخیص می‌دهد! در واقع این موضوع به عنوان یک باگ در جاوااسکریپت پذیرفته شده است.
typeof null; // "object"

2- آرایه‌ها در جاوااسکریپت نوعی از آبجکت‌ها هستند و درواقع subtype آبجکت محسوب می‌شوند. به همین دلیل عملگر typeof (به درستی) مقادیر از نوع آرایه را، به عنوان آبجکت شناسایی می‌کند.
typeof [1, 2]; // "object"

3- توابع هم مانند آرایه‌ها، نوع خاصی از آبجکت‌ها هستند و subtype آبجکت محسوب می‌شوند.اما عملگر typeof مقادیر از نوع function را برخلاف آرایه‌ها، به عنوان خود "function" شناسایی می‌کند (و نه "object").
typeof function(){}; // "function"

اما آیا روش بهتری برای چک کردن نوع مقادیر وجود دارد؟
بله، روش‌هایی زیادی برای این کار وجود دارد که 2 مورد از آن‌ها را در این مطلب بررسی می‌کنیم:

1- این کد برای مقادیر null و آرایه‌ها و توابع false برمی‌گرداند و فقط برای آبجکت‌ها (و نه subtype های آن) true برمی‌گرداند:
(proGraphs !== null) && (proGraphs.constructor === Object)

2- یکی دیگر از روش‌های مفید برای چک کردن نوع داده‌ها استفاده از متد toString است:
Object.prototype.toString.call({}); // [object Object]
Object.prototype.toString.call([]); // [object Array]

اینکه هر کدام از این روش‌ها دقیقا چطور کار می‌کنند و هرکدام در چه شرایطی مناسب‌تر هستند را در مطالب جداگانه بررسی می‌کنیم.

🔺تصاویر و طرح‌های این سبکی رو از لینک زیر دانلود کنید. 😎

https://icons8.com/ouch

#link #vector #illustration

@ProGraphs

🔺Whimsical | The Visual Workspace

https://whimsical.co/

#link #workspace

@ProGraphs

​​در مطالب قبلی با مفهوم Property Descriptor آشنا شدیم و فهمیدیم که مجموعه‌ای از ویژگی‌های یک پراپرتی هستند که رفتار آن پراپرتی را تعیین می‌کنند.

در این مطلب یکی از این ویژگی‌ها به نام writable را بررسی می‌کنیم.

اگر مقدار ویژگی writable برای یک پراپرتی false باشد، مقدار آن پراپرتی غیر قابل تغییر خواهد بود. یعنی اگر در حالت strict-mode سعی کنیم مقدار پراپرتی را تغییر دهیم با خطا مواجه می‌شویم. در حالت معمولی هم مقدار پراپرتی تغییر نخواهد کرد اما خطایی هم دریافت نمی‌کنیم.

به این ترتیب می‌توانیم پراپرتی‌هایی با مقادیر constant بسازیم (به کد داخل تصویر دقت کنید).

#quicktip #js

@ProGraphs

آیا شما function expressionها را نام گذاری می‌کنید؟
این کار چه فایده‌ای می‌تواند داشته باشد؟

#interviewquestion #js

@ProGraphs

🔺 ایمیل موقت ده دقیقه‌ای ⏳🔟

🔸 به درد سایت‌هایی می‌خوره که شاید فقط یه بار بخواین ازشون استفاده کنین ولی مجبورین توشون ثبت‌نام کنین.

https://10minutemail.com/

#link #email

@ProGraphs

🔺کد زدن با JS را در اپلیکیشن زیر، رایگان یاد بگیرید.👨🏻‍💻👩🏻‍💻

https://grasshopper.codes/

#link #app #application #learn #js

@ProGraphs

جواب:

نام گذاری function expressionها 2 فایده مهم می‌تواند داشته باشد:

1- زمانی که برای یک FE نام انتخاب می‌کنیم، این نام داخل خود تابع قابل استفاده است (و به صورت گلوبال تعریف نمی‌شود).
به این ترتیب داخل تابع می‌توانیم به خود آن دسترسی داشته باشیم و این موضوع می‌تواند برای recursion و ... مفید باشد.

2- زمانی که یک کد را در حالت debug در مرورگر اجرا می‌کنیم، نام تابع در حال اجرا در قسمت call stack قابل مشاهده است. اما برای توابع بدون نام، نام تابع به عنوان anonymous نوشته می‌شود. و این موضوع می‌تواند دیباگ کردن کد‌های پیچیده را سخت‌تر کند.

تابع با نام و بدون نام در حالت debug

🔺با لینک زیر به راحتی موکاپ موبایل بسازید. 📱

https://www.kapwing.com/mobile-mockup

#link #mockup

@ProGraphs

با استفاده از live expression ها در گوگل کروم،‌می‌توانیم مقدار هر expression جاوااسکریپت و تغییرات آن را ببینیم!

#quicktip #devtools #js

@ProGraphs

🔺یه چک لیست خوب برای Front-end ✨

👈 مناسب Front-End developerهای دقیق و وب سایت‌های مدرن

https://frontendchecklist.io/

#link #frontend #checklist

@ProGraphs

با اجرای این کد چه مقداری در کنسول چاپ می‌شود؟

#interviewquestion #js

@ProGraphs