ProGraphs

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

412 views04:28

ProGraphs

This media is not supported in your browser

VIEW IN TELEGRAM

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

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

456 views05:01

ProGraphs

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

instagram.com/prographs

489 views05:01

ProGraphs

🔺Color scale generator 🌈

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

#link #color #generator

@ProGraphs

594 views13:45

ProGraphs

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

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

#interviewquestion #js

@ProGraphs

536 views13:45

ProGraphs

تفاوت == و === در جاوااسکریپت چیست؟ (اونقدر که به نظر میرسه جواب واضح نیست 😅) #interviewquestion #js @ProGraphs

جواب:

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

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

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

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

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

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

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

565 views13:46

ProGraphs

This media is not supported in your browser

VIEW IN TELEGRAM

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

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

#link #github #graph

@ProGraphs

566 views14:15

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

808 viewsedited 14:16

ProGraphs

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

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

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

1.07K viewsedited 14:24

ProGraphs

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

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

#link #html #head

@ProGraphs

GitHub

GitHub - joshbuchea/HEAD: A simple guide to HTML <head> elements

A simple guide to HTML <head> elements. Contribute to joshbuchea/HEAD development by creating an account on GitHub.

630 views13:45

ProGraphs

اگر هردوی این rulesetها به یک عنصر اعمال شوند، متن این عنصر چه رنگی خواهد بود؟

#interviewquestion #css

@ProGraphs

537 viewsedited 13:45

green – 42 orange – 10

ProGraphs

اگر هردوی این rulesetها به یک عنصر اعمال شوند، متن این عنصر چه رنگی خواهد بود؟ #interviewquestion #css @ProGraphs

جواب: green

برای تعیین رنگ عنصر،‌ابتدا specificity دو انتخابگر را تعیین می‌کنیم:
اگر 10 امتیاز برای هر کلاس، و 100 امتیاز برای هر id اضافه کنیم، امتیاز دو انتخابگر به این ترتیب تعیین می‌شود:

انتخابگر اول: 100
انتخابگر دوم: 110

همانطور که می‌بینید امتیاز انتخابگر دوم بیشتر است! اما چرا ruleset اول اعمال شد؟
مشکل اینجاست که امتیاز انتخابگرها به صورت دهدهی محاسبه نمی‌شود و اولویت انتخابگر id بالاتر از کلاس است. در نتیجه هیچ تعدادی از کلاس‌ها نمی‌توانند یک id را override کنند!
پس بهتر است امتیاز انتخابگرها را به این شکل تعیین کنیم:

انتخابگر اول: 0, 0, 1, 0
انتخابگر دوم: 0, 11, 0, 0
چون تعداد idها در انتخابگر اول بیشتر است، پس قطعا ruleset اول اعمال می‌شود و رنگ متن عنصر green خواهد بود.

492 views14:20

ProGraphs

Node.js security best practices

https://medium.com/@nodepractices/were-under-attack-23-node-js-security-best-practices-e33c146cb87d

#link #article #node #security

@ProGraphs

Medium

We’re under attack! 23+ Node.js security best practices

A curated list of 23 node security best practices with code examples and quotes from the top ranked blogs

591 views14:21

ProGraphs

🔺با سایت زیر تصاویر خود را بدون کاهش کیفیت فشرده کنید. ✌🏻

https://squoosh.app

#link #imagecompressor

@ProGraphs

700 views13:45

ProGraphs

آیا در این کد می‌توانیم در خط 6 به متغیر گلوبال دسترسی پیدا کنیم؟

#interviewquestion #js

@ProGraphs

525 views13:45

ProGraphs

آیا در این کد می‌توانیم در خط 6 به متغیر گلوبال دسترسی پیدا کنیم؟ #interviewquestion #js @ProGraphs

جواب: خیر!

با توجه به نحوه‌ی عملکرد lexical scope، همیشه ابتدا داخل خود تابع دنبال یک متغیر می‌گردیم. بنابراین همیشه متغیر proGraphs داخل تابع پیدا می‌شود و به متغیر گلوبال دسترسی پیدا نمی‌کنیم.
این شرایط با عنوان variable shadowing شناخته می‌شود.

از طرفی متغیرهایی که با let تعریف می‌شوند، به آبجکت global اضافه نمی‌شوند. یعنی window.proGraphs وجود نخوهد داشت و از راه غیر lexical هم به متغیر گلوبال دسترسی نداریم!

https://en.wikipedia.org/wiki/Variable_shadowing

Wikipedia

Variable shadowing

a variable in an inner scope hiding an identically named variable in an outer scope

511 viewsedited 13:45

ProGraphs

🔺ایجاد افکت‌هایی این چنینی بر روی عکس با سایت زیر ✨👇🏻

https://duotone.shapefactory.co/

#link #duotone

@ProGraphs

734 views13:45

ProGraphs

🔺 Typeform

- نظرسنجی و فرم‌ساز آنلاین ✌🏻🥳

https://www.typeform.com

#link #survey #form #builder

@ProGraphs

Typeform

Typeform: People-Friendly Forms and Surveys

Build beautiful, interactive forms — get more responses. No coding needed. Templates for quizzes, research, feedback, lead generation, and more. Sign up FREE.

510 views13:45

ProGraphs

This media is not supported in your browser

VIEW IN TELEGRAM

Simple & light weight vanilla javascript plugin to create smooth & beautiful animations when you scroll! 😎✌🏻

https://github.com/alexfoxy/laxxx

#link #js #plugin #scroll

@ProGraphs

462 views13:45

ProGraphs

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

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

حالا می‌خواهیم نحوه‌ی تبدیل آبجکت‌ها به primitive را دقیق‌تر بررسی کنیم (نه فقط string):

❗️وقتی سعی می‌کنیم یک آبجکت را به یک نوع داده مثل number, string تبدیل کنیم (که نوع داده‌های primitive هستند)، باید ابتدا آبجکت به primitive تبدیل شود. اما چطور؟

1- اگر متدی به نام valueOf در آبجکت وجود داشته باشد و خروجی این متد از نوع primitive باشد، همین متد صدا می‌شود:

var obj = {
    valueOf() {
        return 2;
    }
};
obj -> 2

2- اگر از مرحله‌ی قبلی مقدار primitive تعیین نشود، متد toString صدا می‌شود:

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

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

❗️نکات تکمیلی:
- همانطور که در مطلب قبلی هم دیدیم، متدهای valueOf و toString در Object.prototype تعریف شده‌اند. بنابراین اگر خودمان این متدها را داخل یک آبجکت تعریف نکنیم، متدهای داخل Object.prototype برای تبدیل به primitive صدا می‌شوند (به مطالبی که راجع به prototype chain منتشر کردیم مراجعه کنید).

- گاهی ترتیب صدا شدن دو متد valueOf و toString برعکس چیزی است که در این مطلب دیدیم. دلیل این موضوع را در مطالب بعدی بررسی می‌کنیم. اما فعلا اهمیتی ندارد 😅

#quicktip #js

@ProGraphs

651 viewsedited 13:46

ProGraphs

حالا که دانشمون از تبدیل آبجکت به primitive کامل‌تر شده، دوباره به مطلب قبلی برگردید:
https://t.iss.one/ProGraphs/434

تو قانون دوم گفتیم که برای تبدیل به string، متد toString صدا می‌شه. حالا مراحل کامل‌تر (valueOf و toString) و دلیل صدا شدن این متد رو بهتر درک می‌کنیم!

ProGraphs

469 views13:50

About

Blog

Apps

Platform