جاوا اسکریپت کارا بیان‼
خروجی این کد جاوا اسکریپت کدوم گزینست؟🤔

const numbers = [33, 2, 8];
numbers.sort();
console.log(numbers[1])

A) 33
B) 2
C) 8
D) 1

#quiz #js
☕️Telegram | Website | Discord

🔸️قالب HTML تلینو یه انتخاب عالی برای تیم هاییه که روی ربات‌های تلگرام کار می‌کنن و دوست دارن یه سایت اختصاصی خوشگل و حرفه‌ای داشته باشن تا کارشون حسابی بدرخشه.تو این قالب همه‌چی هست، از صفحه‌ی اصلی گرفته تا صفحات فرعی، بلاگ، جستجو و کلی چیز دیگه که می‌تونه سایت‌تون رو کامل و تر و تمیز کنه.

GitHub: https://github.com/htaria/telegram-services-site

#html #theme #telegram #site #css #js #frontend
☕️Telegram | Website | Discord

میدونستین میتونین از لیست ها توی شرط در جاوااسکریپت استفاده کنین؟ 🔥

🔸️ مثلا میخوایم چک بکنیم یه مقداری برابر 1 یا one هستش یا نه(و میتونه این مقدار طولانی تر باشه،مثلا شامل 2,two,3,three هم باشه)

🔹️بجای اینکه بنویسین:

if(value == 1 || value == 'one'){
//کدی که میخواین
}

میتونید بنویسید:

if([1,'one'].includes(value)){
//کدی که میخواین
}

#javascript #js #trick
☕️Telegram | Website | Discord

برچسب گذاری شرط ها ( Labelled Statements ) در جاوااسکریپت ✅️

🔹️در جاوااسکریپت می‌تونید به هر statement یک برچسب (label) اختصاص بدید و بعد از اون برچسب برای کنترل جریان برنامه استفاده کنید. این ویژگی بیشتر برای کنترل جریان در حلقه‌ها (loops) به کار میره. این مثال رو ببینیم تا بهتر متوجه کاربردش بشیم:

outerLoop: for (let i = 0; i < 3; i++) {
    for (let j = 0; j < 3; j++) {
        if (i === 1 && j === 1) {
            break outerLoop;
        }
        console.log(`i = ${i}, j = ${j}`);
    }
}

🔸️در واقع خروجی به این شکله:

i = 0, j = 0
i = 0, j = 1
i = 0, j = 2
i = 1, j = 0

⚡️و وقتی که i و j هر دو برابر 1 میشن، لوپ بزرگتر ما break میشه و میره خونشون.
و برنامه میره ادامه کارش(یا مثل این مثال، تموم میشه)

#javascript #js #trick
☕️Telegram | Website | Discord

🚀 این سایت یه مرجع خفن برای دانلود قالب های پنل ادمین توسعه داده شده با Bootstrap و Tailwind هست.

💼 چه دنبال قالب رایگان باشی چه حرفه‌ای و پولی، توی این سایت کلی انتخاب جذاب داری برای شروع سریع پروژه‌هات.

🔗 لینک سایت

#frontend #bootstrap #panel #css #js #site
☕️Telegram | Website | Discord

چجوری توی جاوااسکریپت بفهمیم کاربر مقداری وارد کرده یا نه؟ ⚡️

🔸️ خب احتمالا در حالت عادی میرفتید با if طول دیتا رو بدست میاوردید و true یا false رو برمیگردوندید، اما نیازی به این کار نیست.

const v1 = "CodeExplore"
const v2 = ""
console.log(!!v1)
// true
console.log(!!v2)
// false

#javascript #js #trick
☕️Telegram | Website | Discord

‏Flat کردن array در جاوااسکریپت 🔥

🔹️دیدین بعضی وقتا آرایه رو میدن این شکلیه:

let array = [1, [2, 3], [4, [5, 6]]];

و شما میخواین به صورت 1,2,3,4,5,6 باشه!

🔸️اینجور وقتا به جای اینکه کفرتون در بیاد میتونین این کد رو بنویسید و به آرامش درونتون برگردید:

let array = [1, [2, 3], [4, [5, 6]]];
let flatArray = array.flat(2);  
// [1, 2, 3, 4, 5, 6]

✅️اینجور وقتا اصطلاحا یک آرایه پیچ در پیچ یا تو در تو رو، flat کردیم

#javascript #js #trick #flatArray
☕️Telegram | Website | Discord

تا حالا به فرق var، let و const فکر کردین؟

🔹‏var همه جا کار میکنه ولی یه سری دردسرا داره، مثلاً متغیر قبل از تعریف هم قابل استفاده هست (به خاطر hoisting)، که گاهی اوقات خیلی گمراه‌کننده میشه.
🔹‏let نسخه‌ پیشرفته تره؛ فقط توی همون بلاکی که تعریفش کردی در دسترسه، و می‌تونی بعداً مقدارش رو عوض کنی.
🔹‏const هم مثل let رفتار میکنه، فقط فرقش اینه که دیگه نمیتونی مقدارش رو عوض کنی! البته اگه یه آرایه یا آبجکت باشه، میتونی داخلش رو دستکاری کنی!

این مورد هایی که گفتیم، فرق های جزئی هستن، میتونید مقاله کامل راجب این موارد رو توی سایتمون بخونید:
🔗 تفاوت var و let و const در JavaScript

#javascript #js #const #let #var
☕️Telegram | Website | Discord

تو دنیای جاوااسکریپت برای مدیریت کدهای بزرگ و پیچیده، ماژول‌بندی حیاتی هست. دو سیستم معروف CommonJS و ESM هر کدوم ویژگی‌ها و کاربردهای خاص خودشون رو دارن. CommonJS که از Node.js اومده و از روش همزمان (sync) بارگذاری استفاده می‌کنه، تو محیط سرور حسابی جا افتاده، ولی تو مرورگر به‌صورت مستقیم کار نمی‌کنه و نیاز به ابزارهای bundler مثل Webpack داره. از طرف دیگه، ESM که استاندارد جدید ECMAScript هست، با بارگذاری غیرهمزمان (async) و قابلیت tree-shaking (حذف کدهای بلااستفاده) بهینه‌تره و هم تو مرورگر های مدرن و هم تو Node.js نسخه‌های جدید پشتیبانی میشه.

برای مطالعه دقیق راجب تفاوت CommonJS و ESM این مقاله رو میتونید بخونید:

🔗 تفاوت های CommonJs و ESM

#Javascript #JS #CommonJS #ESM
☕️Telegram | Website | Discord

خواندن متن کپی شده با جاوااسکریپت 👀

🔹️برای دریافت متنی که کاربر داخل کلیپ‌بورد خودش داره میتونید از navigator استفاده کنید.

text= navigator.clipboard.readText();
consloe.log(text);

🔸️چیزی که متد readText بهتون میده از جنس پرامیس هست و نکته مهم دیگه ای که هستش اینه که کاربرد باید حتما بهتون دسترسی بده وگرنه ارور دریافت میکنید.

#javascript #js #clipboard
☕️Telegram | Website | Discord

⚙️ یکی از اشتباهات رایج در جاوااسکریپت زمانی پیش میاد که بخوای متغیر خصوصی (Private Variable) رو با Prototype ترکیب کنی.

در متدهایی که داخل constructor تعریف میشن، متغیرهای خصوصی از طریق Closure در دسترس هستن.
اما وقتی متد رو روی prototype تعریف کنی، اون متد به scope خصوصی constructor دسترسی نداره و فقط می‌تونه از this استفاده کنه.

function MyConstructor() {
  var x = "ABC";
}
MyConstructor.prototype.getX = function() {
  return x;
};

اینجا getX روی prototype تعریف شده، اما به متغیر x که داخل constructor بوده دسترسی نداره؛ چون اون متغیر فقط داخل closure ساخته شده.

اما توی این مثال:

function MyConstructor() {
  var x = "ABC";
  this.getX = function() {
    return x; 
  };
}

اینجا متد getX داخل constructor تعریف شده و به x دسترسی داره چون در همون scope ساخته شده.

#js #prototype
☕️Telegram | Website | Discord

⏰ گاهی نیاز داریم دو بازه زمانی رو با هم مقایسه کنیم یا اختلافشون رو محاسبه کنیم. جاوااسکریپت Date داره ولی برای بازه‌ زمانی کافی نیست.

اینجا این روش رو استفاده میکنیم : ساختن یه TimeInterval با استفاده از همون Date ولی با اضافه کردن متدهای جدید💡

ایده اصلی اینه که به جای ارث‌ بری کلاس‌محور، یه تابع بنویسیم که:

- یه Date جدید میسازیم
- متدهای مورد نیازمون رو بهش اضافه میکنیم
- همون رو برمیگردونیم

var TimeInterval = function(){
    var obj = new Date(0);

if(arguments.length === 1){
        obj.setTime(arguments[0]);
    } else if(arguments.length > 1){
        var ms = (arguments[0] || 0) * 86400000 +
                 (arguments[1] || 0) * 3600000 +
                 (arguments[2] || 0) * 60000 +
                 (arguments[3] || 0) * 1000 +
                 (arguments[4] || 0);
        obj.setTime(ms);
    }
    
    obj.add = function(t){
        if(t.getTime){
            this.setTime(this.getTime() + t.getTime());
        }
    };
    
    obj.subtract = function(t){
        if(t.getTime){
            this.setTime(this.getTime() - t.getTime());
        }
    };
    
    obj.equals = function(t){
        return this.getTime() === t.getTime();
    };
    
    return obj;
}

function diff(t1, t2){
    return TimeInterval(t1.getTime() - t2.getTime());
}

ساخت با پارامترهای مختلف (بدون overloading):

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

TimeInterval(3600000)           // 1 ساعت به میلی‌ثانیه
TimeInterval(1,0,0)             // 1 ساعت (ساعت، دقیقه، ثانیه)
TimeInterval(1,2,0,0)           // 1 روز و 2 ساعت
TimeInterval(1,2,0,0,500)       // 1 روز و 2 ساعت و 500 میلی‌ثانیه

با چک کردن arguments.length می‌فهمیم کاربر چه چیزی داده.

اینو هم برای نمایش خروجی (override کردن toString) به تابع TimeIntervalاضافه میکنیم:

obj.toString = function(){
    var days = Math.floor(this.getTime() / 86400000);
    return days + " Day(s) " + 
           this.getUTCHours() + ":" +
           this.getUTCMinutes() + ":" +
           this.getUTCSeconds();
}

مثال از استفاده:

var interval1 = TimeInterval(1, 2, 30, 0, 500); // 1 روز, 2 ساعت, 30 دقیقه, 500 میلی‌ثانیه

var interval2 = TimeInterval(3600000 * 25);   // 25 ساعت (معادل 1 روز و 1 ساعت)

interval1.add(interval2);

var difference = diff(interval1, interval2); // 1 Day(s) 2:30:0

توی این روش TimeInterval از Date ارث بری نکرده. اومدیم یه Date ساختیم، بعد متدهای جدید روش ریختیم. این روش رو توی جاوااسکریپت بهش میگن Object Augmentation و خیلی تمیز کار میکنه.

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


#js #timeinterval
☕️ Telegram | Website | Discord