​در گوگل کروم می‌توانیم برای زمانی که attribute یک عنصر تغییر می‌کند، breakpoint تعریف کنیم.

به این ترتیب مثلا می‌توانیم بررسی کنیم که یک افکت، دقیقاً در چه قسمتی از کد و چطور پیاده‌سازی شده است!

#quicktip #devtools

@ProGraphs

تاریخچه‌ی کوتاهی از GraphQL از زبان یکی از سازنده‌هاش!

https://youtu.be/F-OizdRJh1U

#link #talk #graphql

@ProGraphs

🔺Figma Freebies - Free UI Kits & Figma Resources 🎉

https://www.figmafreebies.com/

#link #figma #freebie #resource

@ProGraphs

سال نو همگی مبارک 🌹

تو 2/3 روز آینده، خبرای خوبی داریم 😉

بالاخره بعد از یه وقفه‌ی نسبتا طولانی تغییراتی که قولش رو داده بودیم شروع کردیم 😉:

نسخه‌ی اولیه سایت از امروز آماده‌اس!

البته سایت رو با الهام از Brendan Eich تو 10 روز آماده کردیم😅
و حتما (فعلا) بدون ایراد و کامل نیست!

www.prographs.ir

فعلا دو قسمت آرشیو منابع مفید و سوالات مصاحبه تو سایت هست که به مرور کامل‌تر می‌شوند.

تو قسمت آرشیو منابع، شما می‌تونید لینک ابزارها و سایت‌های مفیدی که می‌شناسید رو برای ما بفرستید تا به مرور یه آرشیو ارزشمند از منابع تهیه بشه ✌️

میتونید وب سایت/اپلیکیشن ProGraphs رو روی دستگاهتون نصب کنید تا به بعضی قسمت‌ها به صورت آفلاین دسترسی داشته باشید.

(تو ویدیو نصب شدن سایت/اپلیکیشن روی mac, android, windows, ios رو می‌بینید)

به لطف Background Sync می‌تونید زمانی که به اینترنت متصل نیستید هم لینک‌هاتون رو تو سایت ثبت کنید تا هر وقت دوباره متصل شدید برای ما ارسال شوند.

بعد از نصب، می‌تونید یک لینک رو مستقیما از appهای نیتیو (مثل یوتیوب) با ما share کنید!

(فعلا فقط اندروید و گوگل کروم 71+)

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

instagram.com/prographs

🔺Color scale generator 🌈

https://hihayk.github.io/scale/

#link #color #generator

@ProGraphs

تفاوت == و === در جاوااسکریپت چیست؟

(اونقدر که به نظر میرسه جواب واضح نیست 😅)

#interviewquestion #js

@ProGraphs

جواب:

احتمالا جواب اکثر دولوپرها به این سوال، این جمله است:
عملگر == فقط مقدار را چک می‌کند. ولی عملگر === علاوه بر مقدار، نوع داده‌ را هم چک می‌کند.

اما این تعریف در جاوااسکریپت دقیق نیست!
❗️در واقع عملگر == هم نوع‌داده را چک می‌کند و اگر نوع داده‌ی دو مقدار یکسان نباشد، یک یا هردوی مقادیر را تغییر می‌دهد (coercion) تا بتواند مقدار آن‌ها را مقایسه کند.
در نتیجه برعکس چیزی که از تعریف اول به نظر می‌رسد، عملگر == کار بیشتری از عملگر === انجام می‌دهد!

اما دانستن تعریف دقیق‌تر چه کمکی به ما می‌کند؟
این عبارت را در نظر بگیرید:

let obj = {
  toString() {
    return "hi";
  }
};
"hi" == obj // true!

1- وقتی با تعریف اول این عبارت را بررسی می‌کنیم، کاملا غیرمنطقی و گیج کننده به نظر می‌رسد!

2- اما وقتی با تعریف دقیق‌تر این عبارت را بررسی می‌کنیم، می‌دانیم که دو مقدار از نوع‌داده‌ی یکسان نیستند، پس عملگر == سعی می‌کند obj را تبدیل به string کند تا بتواند دو مقدار را مقایسه کند (برای تبدیل obj به string، متد toString صدا می‌شود).

(اینکه چطور obj به string تبدیل شد، و در کل coerce شدن نوع داده‌های مختلف به یکدیگر را مطالب بعدی بررسی می‌کنیم)

تو این سایت می‌تونید تعداد starهای پروژه‌های مختلف github رو در طول زمان ببینید ⭐️

https://star-history.t9t.io/

#link #github #graph

@ProGraphs

تبدیل نوع داده‌ها (coercion) در جاوااسکریپت (قسمت اول):

چطور نوع داده‌های مختلف در جاوااسکریپت به string تبدیل می‌شوند؟
❗️1-تقریبا همه‌ی مقادیر primitive بدون تغییر خاصی به string تبدیل می‌شوند و حالت stringای آنها از پیش تعیین شده است:

true -> "true"
12 -> "12"
NaN -> "NaN"
null -> "null"
undefined -> "undefined"

اما اعداد خیلی بزرگ و خیلی کوچک به صورت نمایی نمایش داده می‌شوند:
10000000000000000000000 -> "1e+22"


❗️2- برای تبدیل آبجکت‌ها به string، متد toString داخل آن‌ها صدا می‌شود:

var obj = {
    toString() {
        return "proGraphs";
    }
}
obj -> "proGraphs"

همچنین داخل Object.prototype، متدی به نام toString تعریف شده است. بنابراین اگر خودمان متد toString را داخل یک آبجکت تعریف نکنیم، متد Object.toString برای تبدیل به string صدا می‌شود (به مطالبی که راجع به prototype chain منتشر کردیم مراجعه کنید).

همین! حالا مهم نیست که کجا، چطور و با کدام روش یک مقدار به string تبدیل می‌شود. در هر صورت از قوانینی که بررسی کردیم تبعیت می‌شود و خروجی coercion یکسان خواهد بود:
String(true); // "true"
true + ""; // "true
...

#quicktip #js #coercion

@ProGraphs

معمولا کسانی که با جاوااسکریپت میونه خوبی ندارند خیلی از قوانین coercion گله می‌کنند 😁

اگه از این افراد می‌شناسید، این مطلب رو براشون بفرستید!
از این به بعد هر هفته، تو یک مطلب، قوانین coercion برای یکی از نوع داده‌ها رو بررسی می‌کنیم.

🔺لیستی از هر آنچه می‌تواند در تگ <head> قرار بگیرد. 👌🏻

https://github.com/joshbuchea/HEAD#recommended-minimum

#link #html #head

@ProGraphs