🔺هر کی گفت فرانتاند راحته این ویدئو رو بهش نشون بدین:
https://www.youtube.com/watch?v=Uo3cL4nrGOk
#javascript
https://www.youtube.com/watch?v=Uo3cL4nrGOk
#javascript
YouTube
Interview with Senior JS Developer
👔 Merch drop 2023: https://posix.store
Javascript programming language
Interview with a Javascript developer with Jack Borrough - aired on © The Javascript.
Find more Javascript opinions under:
https://hackernoon.com/how-it-feels-to-learn-javascript-in…
Javascript programming language
Interview with a Javascript developer with Jack Borrough - aired on © The Javascript.
Find more Javascript opinions under:
https://hackernoon.com/how-it-feels-to-learn-javascript-in…
😁13👏2👍1
Media is too big
VIEW IN TELEGRAM
🔺ـ Function Expression توی جاوااسکریپت چیه و چه کاربردهای منحصر به فردی داره؟ 🤔
- نسخه متنی:
https://ditty.ir/p/JmDWX
#javascript
- نسخه متنی:
https://ditty.ir/p/JmDWX
#javascript
👏25👍9❤2🤩1
🔺تیم توسعهٔ مایکروسافت در حال آمادهسازی و معرفی یک طرح پیشنهادی برای پشتیبانی مرورگرها از #تایپاسکریپت هستن:
https://devblogs.microsoft.com/typescript/a-proposal-for-type-syntax-in-javascript
- موافقین یا مخالف؟ با ایموجیهای 👍 و 👎 رای بدین
#javascript
https://devblogs.microsoft.com/typescript/a-proposal-for-type-syntax-in-javascript
- موافقین یا مخالف؟ با ایموجیهای 👍 و 👎 رای بدین
#javascript
Microsoft News
A Proposal For Type Syntax in JavaScript
Today we’re excited to announce our support and collaboration on a new Stage 0 proposal to bring optional and erasable type syntax to JavaScript. Because this new syntax wouldn’t change how surrounding code runs, it would effectively act as comments. We think…
👍170👎43🤔4
🔺۲ متد جدید قراره به جاوااسکریپت اضافه بشه به اسمهای
- اطلاعات بیشتر:
github.com/tc39/proposal-array-find-from-last
#javascript
findLast و findLastIndex که مشابه متدهای find و findIndex هستن، اما از انتهای آرایه شروع به جستجو میکنن- اطلاعات بیشتر:
github.com/tc39/proposal-array-find-from-last
#javascript
👍26🔥19
🔺این کد رو یکی از دوستان منتشر کرد و گفته بود این سوالی بود که توی مصاحبه ازش پرسیدن
- توی این کد باید بدونیم که حلقهٔ
- دلیل این اتفاق رو میدونین؟ توی کامنتها بگین 👇👏
#javascript
- توی این کد باید بدونیم که حلقهٔ
while هیچوقت به پایان نمیرسه. به این دلیل که هیچوقت نوبت به اجرای setTimeout نمیرسه که x رو false کنه- دلیل این اتفاق رو میدونین؟ توی کامنتها بگین 👇👏
#javascript
👍44🤔4❤1🎉1
🔺الگوی Event Delegation توی جاوااسکریپت چیه؟ 🤔
- از این الگو هنگام کار با DOM و مدیریت کردن رویدادها استفاده میکنیم و با اون میتونیم کدهایی تمیزتر و با قابلیت توسعهٔ بیشتری داشته باشیم
- برای مثال چندین المنت مشابه داریم و میخوایم onclick همهٔ این المنتها رو مدیریت کنیم. این الگو کمک میکنه این کار رو با نوشتن کدهای کمتر و خواناتر انجام بدیم 👌
- با این الگو اینجا آشنا بشین:
https://ditty.ir/492
#javascript
- از این الگو هنگام کار با DOM و مدیریت کردن رویدادها استفاده میکنیم و با اون میتونیم کدهایی تمیزتر و با قابلیت توسعهٔ بیشتری داشته باشیم
- برای مثال چندین المنت مشابه داریم و میخوایم onclick همهٔ این المنتها رو مدیریت کنیم. این الگو کمک میکنه این کار رو با نوشتن کدهای کمتر و خواناتر انجام بدیم 👌
- با این الگو اینجا آشنا بشین:
https://ditty.ir/492
#javascript
دیتی | Ditty.ir
الگوی Event Delegation چیه؟
از این الگو هنگام کار با DOM و رویدادها استفاده میکنیم و با اون میتونیم کدهایی تمیزتر و با قابلیت توسعهٔ بیشتری داشته باشیم
👍15🔥8👎1😁1
🔺اگه یک ورودی از نوع
- همچنین اگه نوع ورودی
#html #javascript
number داریم، میتونیم هنگام خوندن مقدار اون، از valueAsNumber استفاده کنیم تا چیزی که تحویل میگیریم از نوع number باشه (اگه از value. استفاده کنیم، خروجی همیشه string هست)- همچنین اگه نوع ورودی
date هست، میتونیم از valueAsDate استفاده کنیم تا چیزی که تحویل میگیریم نوعی از آبجکت Date باشه#html #javascript
👍79🔥18🤩5
🔺چرا از
- یکی از هدفهای async/await پیادهسازی قابلیت پردازش موازی و مدیریت کردن عملیات ناهمگام هست
- وقتی توی هر پیمایشِ حلقه از
- توی این شرایط، عملیات موازی نیست. بلکه متوالی هست. چونکه پیمایش بعدی باید صبر کنه تا عملیات ناهمگام فعلی تموم بشه. پس بهتره کاری کنیم که عملیات ناهمگام بصورت موازی اجرا بشن
- بهتره توی حقله منتظر نتیجهٔ عملیات ناهمگام نباشیم. تک تک این عملیات رو توی یک آرایه قرار بدیم و نهایتاً بیرون از حلقه از
ویرایش: منظور از پردازش موازی، اجرای موازی عملیات ناهمگام هست
- منبع ۱
- منبع ۲
#javascript
await توی حلقهها استفاده نکنیم؟ 🤔- یکی از هدفهای async/await پیادهسازی قابلیت پردازش موازی و مدیریت کردن عملیات ناهمگام هست
- وقتی توی هر پیمایشِ حلقه از
await استفاده میکنیم، یه جورایی مزیتهای پردازش موازی رو نادیده گرفتیم- توی این شرایط، عملیات موازی نیست. بلکه متوالی هست. چونکه پیمایش بعدی باید صبر کنه تا عملیات ناهمگام فعلی تموم بشه. پس بهتره کاری کنیم که عملیات ناهمگام بصورت موازی اجرا بشن
- بهتره توی حقله منتظر نتیجهٔ عملیات ناهمگام نباشیم. تک تک این عملیات رو توی یک آرایه قرار بدیم و نهایتاً بیرون از حلقه از
()Promise.all استفاده کنیم تا از مزیت پردازشهای موازی استفاده کرده باشیم (مثل عکس)ویرایش: منظور از پردازش موازی، اجرای موازی عملیات ناهمگام هست
- منبع ۱
- منبع ۲
#javascript
🔥33👍21❤6
🔺چطوری میتونیم یک ماژول جاوااسکریپتی رو تحت شرایط خاصی Import کنیم؟ 🤔
- توی جاوااسکریپت قابلیتی وجود داره به اسم Dynamic Imports که اجازه میده با انعطاف و اختیارات بیشتری یک ماژول رو لود و استفاده کنیم 💯
- توی جدیدترین پست دیتی با این ویژگی بیشتر آشنا بشین:
ditty.ir/498
#javascript
- توی جاوااسکریپت قابلیتی وجود داره به اسم Dynamic Imports که اجازه میده با انعطاف و اختیارات بیشتری یک ماژول رو لود و استفاده کنیم 💯
- توی جدیدترین پست دیتی با این ویژگی بیشتر آشنا بشین:
ditty.ir/498
#javascript
دیتی | Ditty.ir
همه چیز از Dynamic Import جاوااسکریپت
با قابلیتی آشنا میشیم اجازه میده یک ماژول جاوااسکریپتی رو تحت شرایط دلخواه Import و استفاده کنیم
👍24🔥7🥰1
🔺متد
- تا به حال جایی مجبور شدین از
- برای آشنایی با متد
https://ditty.ir/p/XolQJ
پ.ن: زحمت کد توی عکس رو تماماً GitHub Copilot کشیده 😁
#javascript
reduceRight کاملاً مشابه reduce عمل میکنه با این تفاوت که از راست به چپ پیمایش انجام میده- تا به حال جایی مجبور شدین از
reduceRight استفاده کنین؟- برای آشنایی با متد
reduce این پست رو بخونین:https://ditty.ir/p/XolQJ
پ.ن: زحمت کد توی عکس رو تماماً GitHub Copilot کشیده 😁
#javascript
👍24❤3👏3
Ditty | دیتی
🔺توابع Debounce و Throttle چه فرقی با هم دارن؟ 🤔 - هر دو تابع شباهتهای زیادی دارن و برای به تاخیر انداختن اجرای یک قطعه کد به کار میرن. به قول معروف برای Rate Limiting - تابع Throttle مشخص میکنه که کدهای ما توی یک بازه زمانی مشخص فقط یک بار اجرا بشه -…
🔺پیادهسازی توابع Throttle و Debounce توی جاوااسکریپت با جزییات فراوان:
https://ditty.ir/499
#javascript
https://ditty.ir/499
#javascript
دیتی | Ditty.ir
پیادهسازی توابع Throttle و Debounce در جاوااسکریپت
با دو تابع آشنا میشیم که کمک میکنن برنامهٔ بهینهتر و سریعتر و کاربرد پذیرتر داشته باشیم
🔥14👍8🎉1
🔺آقای مارتین فاولر میگه: یک برنامهنویس بد کدی مینویسه که فقط یک کامپیوتر بتونه اون رو درک کنه. اما یک برنامهنویس خوب کدی مینویسه که یک انسان بتونه اون رو متوجه بشه!
- توی Code Review هایی که انجام میدم و رزومههایی که بررسی میکنم، معمولاً اولین و مهمترین معیار برای قبولی کد، تمیزی و خوانایی اون هست. و کار کردن کد اولویت دوم
- میخوایم با چند مقاله آشنا بشیم که کمک میکنن کدهای تمیزتر و خواناتری داشته باشیم:
• Clean Code Explained – A Practi...
• Clean Code concepts adapted for...
• Clean Code Practice: How to write...
• JavaScript Clean Coding Best P...
• Function parameters in JavaScript
• Keeping your code clean
• Best Practices for Using Modern...
• Best practices for cross node/w...
• Writing Clean Code
• Writing Clean Code and The Pra...
• Clean code, dirty code, human...
• Practical Ways to Write Better...
• The Must-Know Clean Code Princ...
منبع
#javascript
- توی Code Review هایی که انجام میدم و رزومههایی که بررسی میکنم، معمولاً اولین و مهمترین معیار برای قبولی کد، تمیزی و خوانایی اون هست. و کار کردن کد اولویت دوم
- میخوایم با چند مقاله آشنا بشیم که کمک میکنن کدهای تمیزتر و خواناتری داشته باشیم:
• Clean Code Explained – A Practi...
• Clean Code concepts adapted for...
• Clean Code Practice: How to write...
• JavaScript Clean Coding Best P...
• Function parameters in JavaScript
• Keeping your code clean
• Best Practices for Using Modern...
• Best practices for cross node/w...
• Writing Clean Code
• Writing Clean Code and The Pra...
• Clean code, dirty code, human...
• Practical Ways to Write Better...
• The Must-Know Clean Code Princ...
منبع
#javascript
freeCodeCamp.org
Clean Code Explained – A Practical Introduction to Clean Coding for Beginners
By Yiğit Kemal Erinç "Any fool can write code that a computer can understand. Good programmers write code that humans can understand."
🔥37👍20❤9
🔺اگه توی جاوااسکریپت تازه کار هستین، پیشنهاد میکنم یکی از پرطرفدارترین قسمتهای «جاوااسکریپت برای مبتدیان» توی دیتی که ساختن SPA با Vanilla JS (جاوااسکریپت خام) هست رو ببینین و بررسی کنین:
» Demo
» Source Code
» Video
#javascript
» Demo
» Source Code
» Video
#javascript
GitHub
alin11.github.io/playground/vanillajs-single-page-application at master · AliN11/alin11.github.io
Contribute to AliN11/alin11.github.io development by creating an account on GitHub.
🔥18👍6❤2
🔺به جاوااسکریپت یک متد جدید اضافه شده به اسم hasOwn که کارایی اون خیلی شبیه به hasOwnProperty هست و به زودی قراره به عنوان جایگزین این متد معرفی بشه
- این متد از آبجکتِ Object در دسترس هست و بررسی میکنه که آیا یک پراپرتی توی یک آبجکت وجود داره یا نه
- توی این پست به صورت اختصاصی با این متد و تفاوتهای اون با hasOwnProperty آشنا بشین:
ditty.ir/503 💯
#javascript
- این متد از آبجکتِ Object در دسترس هست و بررسی میکنه که آیا یک پراپرتی توی یک آبجکت وجود داره یا نه
- توی این پست به صورت اختصاصی با این متد و تفاوتهای اون با hasOwnProperty آشنا بشین:
ditty.ir/503 💯
#javascript
دیتی | Ditty.ir
همه چیز از متد hasOwn جاوااسکریپت
با یک متد جدید توی جاوااسکریپت آشنا میشیم که کارایی مشابه hasOwnProperty داره و قراره جایگزین این متد بشه
🔥21👍6👏2
🔺از sendBeacon جاوااسکریپت چی میدونیم؟
- اگه توی یک صفحه وب، قصد داریم اطلاعات کوچیک که بیشتر جنبهٔ آماری دارن رو به سرور ارسال کنیم، بهتره
- متد
ditty.ir/506
#javascript
- اگه توی یک صفحه وب، قصد داریم اطلاعات کوچیک که بیشتر جنبهٔ آماری دارن رو به سرور ارسال کنیم، بهتره
sendBeacon رو به Ajax ترجیح بدیم. چون توی بعضی شرایط Ajax محدودیتهایی داره و قابل اطمینان نیست- متد
sendBeacon که یک Web API هست، شباهتهایی به ایجکس داره و اطلاعات رو بصورت Async به سرور میفرسته. اما ویژگیها و کاربرد منحصر به فردی داره که توی پست زیر میتونید با اون آشنا بشید:ditty.ir/506
#javascript
دیتی | Ditty.ir
از sendBeacon جاوااسکریپت چی میدونیم؟
اگه قصد داریم اطلاعات جزئی و غیرضروری رو به سرور بفرستیم بهتره بجای AJAX از یک API به اسم sendBeacon استفاده کنیم که توی این قسمت با اون آشنا میشیم
👎179👍40❤8💔1
🔺۳ ترفند برای اینکه Import های قشنگتری توی #جاوااسکریپت داشته باشیم:
https://antoine-mesnil.medium.com/3-tips-to-tidy-up-your-es6-imports
#javascript
https://antoine-mesnil.medium.com/3-tips-to-tidy-up-your-es6-imports
#javascript
Medium
3 Tips to clean your ES6 imports
Introduction
👍15
🔺توی جاوااسکریپت آبجکتهای Map و WeakMap چی هستن و چرا معرفی شدن؟🤔
- آبجکتهای Map و WeakMap توی شرایطی معرفی شدن که با آبجکتهای معمولی میتونستیم تقریباً هر کاری انجام بدیم! اما توی برنامههای مدرن، توی بعضی از شرایط خاص استفاده از آبجکتهای معمولی باعث کاهش #سرعت و توسعهپذیری برنامه میشد که به همین علت Data Structure های مختلفی مثل Map و WeakMap معرفی شدن
- توی جدیدترین پست دیتی با مجموعههای Map و WeakMap آشنا میشیم و تفاوتشون رو با آبجکتهای معمولی مقایسه میکنیم:
ditty.ir/513
#javascript
- آبجکتهای Map و WeakMap توی شرایطی معرفی شدن که با آبجکتهای معمولی میتونستیم تقریباً هر کاری انجام بدیم! اما توی برنامههای مدرن، توی بعضی از شرایط خاص استفاده از آبجکتهای معمولی باعث کاهش #سرعت و توسعهپذیری برنامه میشد که به همین علت Data Structure های مختلفی مثل Map و WeakMap معرفی شدن
- توی جدیدترین پست دیتی با مجموعههای Map و WeakMap آشنا میشیم و تفاوتشون رو با آبجکتهای معمولی مقایسه میکنیم:
ditty.ir/513
#javascript
دیتی | Ditty.ir
همه چیز از آبجکتهای Map و WeakMap توی جاوااسکریپت
جاوااسکریپت برای مدیریت کردن اطلاعات برنامه علاوهبر آبجکتهای معمولی، Data Structure های کاربردی دیگهای هم داره که توی این پست میخوایم با ۲ از اونها آشنا بشیم
❤24👍8🎉4👌2
🔺چطوری AbortController #جاوااسکریپت به وبسایتمون کمک میکنه عملکرد و UX بهتری داشته باشه؟ 🤔
- این پست جدید دیتی رو ببینین:
ditty.ir/515
#javascript
- این پست جدید دیتی رو ببینین:
ditty.ir/515
#javascript
دیتی | Ditty.ir
همه چیز از AbortController جاوااسکریپت
AbortController یک قابلیت کاربردی توی جاوااسکریپت هست که با اون خیلی راحت میتونیم یک یا چند عملیات Async رو در زمان لزوم متوقف کنیم
👍15🔥4💯2🙏1🕊1