🔺نیازی به توضیح نیست، خودتون ببینید! 😅

https://www.pandacolors.com/

#link #color

@ProGraphs

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

#interviewquestion #js

@ProGraphs

🔺2019 Design Trends Guide 🥳

https://kutt.it/3WylKt

#link #design #trend #guide

@ProGraphs

جواب: true

در چند مطلب اخیر، قسمتی از مفاهیم coercion در جاوااسکریپت را بررسی کردیم. حالا نتیجه‌ی این کد را با استفاده از این مفاهیم بررسی می‌کنیم:

* در خط 9 یک آبجکت را با یک عدد مقایسه می‌کنیم. اگر از عملگر === استفاده شده بود، قطعا نتیجه‌ی شرط false بود!
اما چون از عملگر == استفاده شده، آبجکت proGraphs به عدد تبدیل می‌شود تا مقایسه انجام شود.

**‌حالا باید آبجکت را به عدد تبدیل کنیم. اما قبل از تبدیل آبجکت به عدد، باید آبجکت به primitive تبدیل شود!
برای تبدیل آبجکت به primitive، متد valueOf داخل آبجکت صدا می‌شود. خروجی این متد عدد 20 است پس در نهایت آبجکت proGraphs به عدد 20 تبدیل شد و نتیجه‌ی شرط true است!

نتیجه‌ی این کد رو در 2 مرحله بررسی کردیم. اگر این 2 مرحله رو متوجه نشدید اصلا نگران نباشید 😁
هردوی این مراحل رو در مطالب قبلی عمیقا بررسی کردیم:

* https://t.iss.one/ProGraphs/432

** https://t.iss.one/ProGraphs/446

🔺Tastemaking: 2019 Design Trends ✨🎉

https://kutt.it/0i2RSE

#link #design #trend

@ProGraphs

تفاوت function و method و constructor در جاوااسکریپت چیست؟

#interviewquestion #js

@ProGraphs

🔺StickPNG - Free Transparent PNGs, Stickers, Clipart & more! 👌🏻

https://www.stickpng.com/

#link #transparent #png

@ProGraphs

بزرگترین مجموعه از تصاویر transparent png clipart رایگان

https://flyclipart.com/

#link #transparent #png

@ProGraphs

جواب:

در جاوااسکریپت، متدها مثل پراپرتی‌های معمولی هستند با این تفاوت که مقدار داخل آن‌ها یک تابع است. بنابراین متدها متفاوت از تابع‌های معمولی جاوااسکریپت نیستند. به همین دلیل به راحتی می‌توانیم این تابع را داخل یک متغیر بریزیم و ... :

let obj = {
  func() {}
};
let f = obj.func;

این موضوع برای constructorها هم صادق است. یعنی constructorهای Date, Error, Number, ... همگی توابع معمولی هستند.
در واقع تقریبا همه‌ی توابع جاوااسکریپت را می‌توانیم با کلمه کلیدی new صدا کنیم. در این صورت، تابع مورد نظر علاوه بر کدی که داخلش تعریف شده:
1- یک آبجکت جدید می‌سازد.
2- آبجکت جدید را به عنوان مقدار this تعیین می‌کند.
3- آبجکت جدید را به آبجکت func.prototype لینک می‌کند (این موضوع رو در مطالب مربوط به prototype بیشتر بررسی کردیم)
4- و در نهایت آبجکت تازه ساخته شده را return می‌کند.

function ProGraphs() {}
let a = new ProGraphs();
typeof a; // object

سایتی پر از تصاویر SVG زیبا که می‌توانید کاملاً رایگان آن‌ها را دانلود کنید.

https://gallery.manypixels.co/

#link #svg #illustration

@ProGraphs

Front-end Developer Handbook 2019 ✌️

https://frontendmasters.com/books/front-end-handbook/2019/

#link #guide #handbook

@ProGraphs

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

در مطلب قبلی نحوه‌ی تبدیل آبجکت‌ها به primitive را بررسی کردیم و دیدیم که هرگاه می‌خواهیم یک آبجکت را به یک نوع داده‌ی primitive مثل number و string تبدیل کنیم، باید ابتدا آبجکت به primitive تبدیل شود.

حالا می‌خواهیم بر پایه‌ی همین موضوع، نحوه‌ی تبدیل نوع داده‌های مختلف به Number را بررسی کنیم:
❗️تقریبا برای همه‌ی مقادیر primitive، حالت عددی از پیش تعیین شده است:
true -> 1
false -> 0
null -> 0
undefined -> NaN

❗️اگر مقدار داخل یک string غیر قابل تبدیل به عدد باشد، نتیجه NaN است:
"123" -> 123
"123AB" -> NaN

❗️برای تبدیل آبجکت‌ها (و subtypeهای آن مثل آرایه‌ها) ابتدا آبجکت به primitive تبدیل می‌شود.
سپس مقدار primitive با توجه به نکاتی که در بالا بررسی کردیم به عدد تبدیل می‌شود (کد داخل تصویر)

حالا در هر شرایط، و به هر روشی که یک مقدار را به عدد تبدیل کنیم، از این قوانین تبعیت می‌شود:
Number(false) -> 0
+false -> 0
false * 1 -> 0

#quicktip #js #coercion

@ProGraphs

برای درک درست این مطلب، باید نحوه‌ی تبدیل آبجکت‌ها به primitive رو بلد باشیم. که در مطلب قبلی بررسی کردیم.

تو این مقاله هم میتونید خیلی کامل‌تر راجع به این موضوع بخونید:

https://www.adequatelygood.com/Object-to-Primitive-Conversions-in-JavaScript.html

🔺 ابزار جستجوی فایل و فولدر‌ها با سرعتی بسیار بالا برای ویندوز

https://www.voidtools.com/

#tool #searchutility

@ProGraphs

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

#interviewquestion #js

@ProGraphs

جواب: true

نتیجه‌ی کد را در 3 مرحله بررسی می‌کنیم:

❗️مرحله اول: در خط 3 یک آرایه (که subtype آبجکت است) با یک عدد مقایسه می‌شود. اگر از عملگر === استفاده شده بود، نتیجه‌ی شرط false می‌شد.
اما چون از عملگر == استفاده شده، ابتدا آرایه به عدد تبدیل می‌شود تا مقایسه انجام شود.

❗️مرحله دوم: حالا باید آرایه proGraphs را به عدد تبدیل کنیم. اما برای این کار، باید ابتدا آرایه به primitive تبدیل شود:
- برای تبدیل آرایه به primitive ابتدا متد valueOf را صدا می‌کنیم (این متد داخل خود آرایه وجود ندارد، ولی داخل Array.prototype از پیش تعریف شده است)
اما متد valueOf که داخل Array.prototype تعریف شده است، فقط خود آرایه را return می‌کند که مشخصا یک مقدار primitive نیست!

- با توجه به این که متد valueOf نتوانست یک مقدار primitive تولید کند، متد toString را صدا می‌کنیم. این متد هم داخل Array.prototype تعریف شده است و یک لیست از تمام آیتم‌های داخل آرایه را به صورت string برمی‌گرداند:
[1, 2, 3].toString(); // "1,2,3"

پس با توجه به اینکه آرایه proGraphs فقط یک آیتم دارد، به "20" تبدیل می‌شود.

❗️مرحله سوم: از مرحله‌ی قبل آرایه به مقدار "20" تبدیل شد که یک مقدار primitive است. اما عدد نیست.
پس با توجه به قوانین تبدیل به Number، این مقدار هم به راحتی به عدد 20 تبدیل می‌شود. و در نهایت نتیجه‌ی شرط true است.

هر 3 مرحله‌ی بالا رو در مطالب قبلی به صورت کامل بررسی کردیم:

1: https://t.iss.one/ProGraphs/432

2: https://t.iss.one/ProGraphs/446

3: https://t.iss.one/ProGraphs/460

همونطور که می‌بینید درک درست این کد، دانش عمیقی از مکانیزم‌های پایه‌ای جاوااسکریپت مثل coercion و prototype می‌طلبه و برای خیلی از دولوپرها گیج کننده است. پس استفاده از همچین عبارت‌هایی در پروژه‌های واقعی توصیه نمی‌شه!

100% Open Source Version of Microsoft VS Code

https://vscodium.com

#editor #vscode #opensource

@ProGraphs

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

#interviewquestion #js

@ProGraphs