🔺تصاویر سوررئال رایگان برای Landing pages ✨

https://absurd.design/

#link #illustration #landingpage

@ProGraphs

​وقتی در یک صفحه اشتباها وارد حلقه بی‌نهایت می‌شویم، تب مرورگر کاملا freeze می‌شود و گاهی حتی بسته هم نمی‌شود!

در این شرایط، در chrome devtools، با ترفندی که در تصویر می‌بینید می‌توانیم صفحه را از حالت freeze خارج کنیم.

#quicktip #devtools

@ProGraphs

🔺یه سایت خوب برای تست و مشاهده‌ی Responsive بودن وب‌سایت شما ✌🏻

https://responsiv.eu/

#link #responsive

@ProGraphs

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

#interviewquestion #js

@ProGraphs

🔺 Origami Studio

- اپلیکیشنی برای ساخت Prototype
- محصول شرکت Facebook
- کاملا رایگان
- برای کسانی که از Mac OS استفاده می‌کنند.

https://origami.design/

#tool #design #prototyping

@ProGraphs

جواب: 4

در مطالب قبلی pass by reference/value را بررسی کردیم و دیدیم که در جاوااسکریپت، آبجکت‌ها با reference به تابع پاس داده می‌شوند و مقادیر primitive، با value.

اما wrapper objectها چطور؟ آیا با استفاده از wrapper objectها می‌توانیم کاری کنیم که مقادیر primitive هم با reference به تابع ارسال شوند؟

به کد سوال دقت کنید:
در خط 5 یک wrapper object می‌سازیم که مقدار عددی 4 داخل آن قرار دارد. و با توجه به اینکه wrapper objectها از نوع آبجکت هستند، پس با reference به تابع پاس داده می‌شوند.
اما مشکل اینجاست که وقتی داخل تابع (خط 2) object wrapper را با یک عدد جمع می‌کنیم، جاوااسکریپت به صورت خودکار wrapper object را به یک عدد معمولی تبدیل می‌کند تا بتواند عملیات را روی آن انجام دهد (اصطلاحا مقدار primitive را unbox/unwrap می‌کند).
به این ترتیب دوباره یک مقدار primitive داریم که تغییرات آن در بیرون تابع تاثیر نمی‌گذارد!

پس حتی با این ترفند هم نمی‌توانیم مقادیر primitive را با reference به تابع ارسال کنیم.

در کل تنها راه برای اینکه تغییرات روی مقادیر primitive، در بیرون تابع هم قابل مشاهده باشد این است که مقدار primitive را به صورت یک پراپرتی معمولی داخل یک آبجکت تعریف کنیم:

function proGraphs(x) {
    x.num = x.num + 1;
}
var obj = { num: 4 };
proGraphs(obj);
obj.num; // 5

این سوال خیلی نکته جدیدی نداشت و بیشتر ترکیبی بود از دو مفهوم خیلی مهم reference/value و wrapper objectها.

که البته این دو مفهوم رو قبلا با هم بررسی کردیم:

1- pass by reference/value:
https://t.iss.one/ProGraphs/315

2- wrapper objects:
https://t.iss.one/ProGraphs/376
https://t.iss.one/ProGraphs/229

🔺رزومه خود را با resume builder سایت Canva بسازید. 👌🏻

https://www.canva.com/templates/resumes/

#link #resume #template

@ProGraphs

​در مطالب قبلی دیدیم که متدهای آرایه‌ها (مثل map و ...) در جاوااسکریپت، داخل آبجکتی به نام Array.prototype تعریف شده‌اند.

بنابراین به راحتی می‌توانیم از بعضی از این توابع، برای کار با نوع داده‌های دیگر مثل stringها استفاده کنیم! (به کد داخل تصویر دقت کنید)

#quicktip #js

@ProGraphs

A Visual Studio Code extension that discourages you while you work 😈

https://github.com/sepehr500/vscode-discourage

#link #vscode #plugin #fun

@ProGraphs

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

#interviewquestion #js

@ProGraphs

آموزش‌های مفید و ساده برای تکنولوژی‌ها و ابزارهای حوزه‌ی وب 👌

https://www.youtube.com/channel/UCW5YeuERMmlnqo4oq8vwUpg

#link #tutorial #youtube

@ProGraphs

🔺Dukto

- ابزاری برای انتقال فایل‌ها بین کامپیوتر و گوشی
- انتقال فایل‌ها بین لینوکس، مک و ویندوز
- جایگزینی برای SHAREit

https://sourceforge.net/projects/dukto/

#tool #filetransfer

@ProGraphs

جواب: 2

یکی از عملگرهای کم‌تر شناخته شده در جاوااسکریپت، عملگر "," (یا comma operator)‌ است.
❗️وقتی این عملگر را بر روی چند expression اعمال می‌کنیم، همه‌ی expressionها را اجرا می‌کند و مقدار آخرین expression را return می‌کند:

(x = 1, y = 2, x += y, 10) // 10
در این کد همه‌ی expressionها از چپ به راست اجرا می‌شوند (به مطلبی که راجع به Associativity منتشر کردیم مراجعه کنید) و در نهایت مقدار 10، return می‌شود.

حالا به کد سوال دقت کنید:
در خط 4، ابتدا عبارت ++x اجرا می‌شود و مقدار متغیر x به 2 تغییر می‌کند. سپس مقدار متغیر x از تابع return می‌شود.
به این ترتیب عدد 2 در کنسول چاپ می‌شود!

❗️اما این عملگر در عمل (!)‌ چه کاربردی دارد؟
بیش‌ترین کاربرد این عملگر زمانی است که می‌خواهیم چندین expression را در جایگاه یک expression استفاده کنیم.
- این کد را در نظر بگیرید:
for (let i = 0; i < 10; i++, j++) {}
در قسمت سوم حلقه فقط مجاز به استفاده از یک expression هستیم. اما با استفاده از عملگر ","، مقدار دو متغیر را تغییر دادیم.

یه نمونه کاربرد دیگه از comma operator که ابزارهای minifier می‌تونن استفاده کنند.

🔺 موزه طراحی وب ✨

- عکس بالا از سایت توییتر در سال 2007 میلادی است.

https://www.webdesignmuseum.org/

#link #web #design #webdesign

@ProGraphs

​با استفاده از تب Code Coverage در گوگل کروم می‌توانیم بررسی کنیم که چند درصد و چه قسمت‌هایی از کدها در یک صفحه اجرا می‌شوند و چه قسمت‌هایی اجرا نمی‌شوند.

همچنین از نسخه‌ی 73 که به زودی منتشر خواهد شد، امکان ذخیره‌ی نتایج Code Coverage در یک فایل json اضافه می‌شود. (به این ترتیب می‌توانیم اطلاعات ذخیره شده را به عنوان ورودی برای ابزارهایی که کد را modify می‌کنند استفاده کنیم)

#quicktip #devtools

@ProGraphs

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

#interviewquestion #js

@ProGraphs

​یه مجموعه پادکست جالب با موضوع جاوااسکریپت 👌

https://devchat.tv/js-jabber/

#link #podcast #js

@ProGraphs

🔺Free Open Source Illustrations 🎉

https://lukaszadam.com/illustrations

#illustration

@ProGraphs