😇راهنمایی کد بالا

❗️به طور کلی کد بالا وظیفه اینو داره که بیاد index های زوج ایتم های ارایه numbers  رو با هم جمع کنه

توضیح reduce : تابع reduce در جاوااسکریپت برای کاهش یک آرایه به یک مقدار واحد استفاده می‌شود.

استفاده های رایج :

جمع مقادیر: محاسبه مجموع یا میانگین مقادیر.
ساخت شیء: تبدیل آرایه به یک شیء.
ترکیب آرایه‌ها: ساخت آرایه‌های جدید یا ترکیب داده‌ها

sum = میاد دونه به دونه مقادیر داخل ارایه رو داخل کد  میزاره
num = مقدار اولیه و ذخیره شده
index = جایگاه یا همون ایندکس خونه ای که sum برمیگردونه

#javanoscript #challenge


𝗖𝗵𝗮𝗻𝗻𝗲𝗹 • @Programers_Cafe

𝗚𝗿𝗼𝘂𝗽 • @IRdeveloperchat

فرق HTML با HTML5 چیه؟

#programming #frontend #Html #Css

𝗖𝗵𝗮𝗻𝗻𝗲𝗹 • @Programers_Cafe

𝗚𝗿𝗼𝘂𝗽 • @IRdeveloperchat

🔥توی این پست می‌خوام دوازده تا از پرکاربرد ترین تابع های css رو بگم🔥


1⃣var():
🔹برای استفاده از متغیرهای CSS تعریف شده با -- به کار می‌رود.
- مثال:

          --main-color: #3498db;
     color: var(--main-color);

2⃣rgb():
🔹 برای تعریف رنگ‌ها با مقادیر قرمز، سبز و آبی.
-مثال:

          background-color: rgb(255, 0, 0); /* قرمز */

3⃣rgba():
🔹مشابه rgb() است، اما شامل شفافیت (آلفا) نیز می‌باشد.
- مثال:

          background-color: rgba(255, 0, 0, 0.5); /* قرمز با شفافیت ۵۰% */

4⃣hsl():
🔹رنگ‌ها را با استفاده از Hue (زاویه رنگ)، Saturation (اشباع) و Lightness (روشنی) تعریف می‌کند.
- مثال:

          color: hsl(120, 100%, 50%); /* سبز */
     

5⃣hsla():
🔹مشابه hsl() است، اما شامل شفافیت (آلفا) نیز می‌باشد.
- مثال:

          color: hsla(120, 100%, 50%, 0.5); /* سبز با شفافیت ۵۰% */
   

6⃣translate():
🔹 برای جابجایی عنصر در فضای دو بعدی استفاده می‌شود.
- مثال:

          transform: translate(50px, 100px);
 

7⃣rotate():
🔹برای چرخاندن عنصر حول محور خود استفاده می‌شود.
- مثال:

          transform: rotate(45deg);
  `

8⃣scale():
🔹برای تغییر اندازه عنصر استفاده می‌شود.
- مثال:

          transform: scale(1.5); /* افزایش اندازه به ۱۵۰% */
     

9⃣ clamp():
🔹مقدار را بین حداقل و حداکثر محدود می‌کند.
- مثال:

            font-size: clamp(1rem, 2vw + 1rem, 3rem); /* اندازه مت بین ۱ و ۳ ریم */
 

1⃣0⃣conic-gradient():
🔹برای ایجاد گرادیان‌های مخروطی استفاده می‌شود.
- مثال:

 background: conic-gradient(red, yellow, green, blue);

1⃣1⃣ linear-gradient():
🔹برای ایجاد گرادیان خطی بین دو یا چند رنگ استفاده می‌شود.
- مثال:

            background: linear-gradient(to right, red, blue);
  

1⃣2⃣radial-gradient():
🔹 برای ایجاد گرادیان شعاعی از یک نقطه مرکزی به سمت بیرون استفاده می‌شود.
- مثال:

            background: radial-gradient(circle, red, blue);

#css #function #html

#Ah_sear


𝗖𝗵𝗮𝗻𝗻𝗲𝗹 • @Programers_Cafe

𝗚𝗿𝗼𝘂𝗽 • @IRdeveloperchat

✨ امروز 31 شهریور ، سالگرد آغاز جنگ ایران و عراقه ؛

جنگی که ایرانی‌ها نه تسلیم شدن و نه به کشور ديگه ای پناهنده شدن! اونا موندن و 300 هزارتا شهید دادن ولی حتی اجازه ندادن یک سانتی متر از این کشور به دست کثیف عراقی جماعت آلوده بشه.

𝗖𝗵𝗮𝗻𝗻𝗲𝗹 • @Programers_Cafe

𝗚𝗿𝗼𝘂𝗽 • @IRdeveloperchat

دید که وقتی توی یه سایتی روی متنی کلیک میکنید متنه تو کلیپ برورد شما کپی میشه کدش اینه 👇👇👇

<span class="sadowpaswordFile" onclick="copyToClipboard()">کپی رمز</span>

function copyToClipboard() { 
  const textToCopy = 'متن شما اینجا'; 
  navigator.clipboard.writeText(textToCopy).then(() => { 
      alert('متن کپی شد!'); 
  }).catch(err => { 
      console.error('خطا در کپی:', err); 
  }); 
}

#javanoscript #html


𝗖𝗵𝗮𝗻𝗻𝗲𝗹 • @Programers_Cafe

𝗚𝗿𝗼𝘂𝗽 • @IRdeveloperchat

به جای اینکه از  alert  خشک بی روح جاوا اسکریپت استفاده کنی🤮
بیا از کتابخانه sweetAler2 استفاده کن🤩

♻️توضیح استفاده ازش رو هم تو خوده سایتش داده لازم نیست نگرانش باشید

#javanoscript #programming


𝗖𝗵𝗮𝗻𝗻𝗲𝗹 • @Programers_Cafe

𝗚𝗿𝗼𝘂𝗽 • @IRdeveloperchat‌
‌

خروجی کد زیر چیست؟؟

const weakMap = new WeakMap();
const array = [1, 2, 3];
const obj = {};

weakMap.set(obj, array);

const result = weakMap.get(obj).reduce((acc, val) => acc + val);

console.log(result);

🔥این بار جواب رو تو کامنت ها بگید بعدا در مورد جوابش توضیح میدم

#javanoscript #challenge

#Ah_sear

Channel • @Programers_Cafe
Group • @IRdeveloperchat

🔥توی این پست می‌خوام switch statement رو در JavaScript کامل تشریح دهم

🌀اswitch یه ساختار کنترلیه که بهت این امکان رو می‌ده که بر اساس مقدار یک متغیر، چندین حالت مختلف رو بررسی کنی. این خیلی به درد می‌خوره وقتی که بخوایم چندین شرط رو چک کنیم و هر کدوم یه نتیجه متفاوت داشته باشه.

▎ساختار کلی:

switch (expression) {
    case value1:
        // کدی که باید اجرا بشه اگر expression برابر با value1 باشه
        break;
    case value2:
        // کدی که باید اجرا بشه اگر expression برابر با value2 باشه
        break;
    // می‌تونی بیشتر از این هم داشته باشی
    default:
        // کدی که باید اجرا بشه اگر هیچکدوم از موارد بالا درست نبود
}

▎توضیحات:

1⃣expression:
این همون متغیریه که می‌خوایم بررسی کنیم.
2⃣case:
هر case یه مقدار ممکن رو بررسی می‌کنه. اگر expression با یکی از این مقادیر برابر بود، کدهای اون case اجرا می‌شن.
3⃣break:
بعد از هر case معمولاً از break استفاده می‌کنیم تا از ادامه اجرای بقیه caseها جلوگیری کنیم. اگر break نباشه، جاوااسکریپت به اجرای بقیه caseها ادامه می‌ده تا به یه break یا default برسه.
4⃣default:
این بخش اختیاریه و زمانی استفاده میشه که هیچکدوم از caseها درست نباشن.

▎مثال:

فرض کن می‌خوایم روز هفته رو بررسی کنیم:

let day = 3;

switch (day) {
    case 1:
        console.log("شنبه");
        break;
    case 2:
        console.log("یکشنبه");
        break;
    case 3:
        console.log("دوشنبه");
        break;
    case 4:
        console.log("سه‌شنبه");
        break;
    default:
        console.log("روز نامشخص");
}

در این مثال، چون day برابر با ۳ هست، خروجی میشه "دوشنبه".

🔰اSwitch معمولاً برای مقادیر ثابت مثل عدد یا رشته استفاده میشه و به خاطر خوانایی بیشترش نسبت به چندین if-else، خیلی محبوبه.

#javanoscript #switch #statement

Channel • @Programers_Cafe
Group •@IRdeveloperchat

✅ یکی از ویژگی‌های قدرتمند جاوااسکریپت، Closures است. Closure زمانی رخ می‌دهد که یک تابع به متغیرهای موجود در اسکوپ والد خود دسترسی دارد، حتی پس از اینکه تابع والد اجرا شده باشد.

function outerFunction() {
  let outerVariable = 'I am outside!';

  function innerFunction() {
    console.log(outerVariable);
  }

  return innerFunction;
}

const myClosure = outerFunction();
myClosure(); // خروجی: I am outside!

در این مثال، innerFunction به متغیر outerVariable دسترسی دارد، حتی پس از اینکه outerFunction اجرا شده و به پایان رسیده است.

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




#programming #Js #Closure

𝗖𝗵𝗮𝗻𝗻𝗲𝗹 • @Programers_Cafe

𝗚𝗿𝗼𝘂𝗽 • @IRdeveloperchat

خروجی کد زیر چیست؟؟

let funcs = [];

for (var i = 0; i < 3; i++) {
  funcs.push(() => i);
}

console.log(funcs[0]());
console.log(funcs[1]());
console.log(funcs[2]());

#javanoscript #challenge

Channel • @Programers_Cafe
Group • @IRdeveloperchat

💠 ویژگی های فریلنسری:

فریلنسری بصورت پروژه‌ای کار میکنه و هیچ قرارداد ثابتی برای حضورت در شرکت و یا سازمان ندارد

● تو سفر و تعطیلات هم میشه کار کرد

● ساعت کاریتون کاملا دست خود فریلنسره

● شامل بیمه و پاداش نمیشود

● با هر لباسی میشه رو پروژه تمرکز داشته باشی

● رهایی از رفت و آمد های تکراری و نموندن در پشت چراغ قرمز و ترافیک

#programming

Channel • @Programers_Cafe

Group • @IRdeveloperchat

خروجی کد زیر چیست ؟

const animal = {
  sound: "Generic sound",
  makeSound() {
    return this.sound;
  }
};

const dog = Object.freeze(Object.create(animal));
dog.sound = "Bark";

const result = dog.makeSound();

console.log(result);

#javanoscript #challenge

Channel • @Programers_Cafe
Group • @IRdeveloperchat

سرعت زبان های برنامه نویسی👨‍💻

❗️دوستان وقتی میگیم یه زبان سطح پایینه منظور این نیست که زبان ضعیفی هست

#programming #javanoscript  #Python

𝗖𝗵𝗮𝗻𝗻𝗲𝗹 • @Programers_Cafe

𝗚𝗿𝗼𝘂𝗽 • @IRdeveloperchat

⚡️تکنیک برای ریسپانسیو سازی⚡️

#CSS #Html #Front_end

𝗖𝗵𝗮𝗻𝗻𝗲𝗹 • @Programers_Cafe

𝗚𝗿𝗼𝘂𝗽 • @IRdeveloperchat

وقتی رمز حسابت رو فراموش کردی😂

#fun
#Ah_sear

Channel • @Programers_Cafe
Group• @IRdeveloperchat

🔰 امروز سالگرد تاج‌گذاری داریوش بزرگ هخامنشی هست .

خداوند این کشور را از دشمن، از خشکسالی و دروغ محفوظ دارد.

𝗖𝗵𝗮𝗻𝗻𝗲𝗹 • @Programers_Cafe

𝗚𝗿𝗼𝘂𝗽 • @IRdeveloperchat

کدوم حوزه رو انتخاب میکنید ؟🧑‍💻


#programming #javanoscript  #Python

𝗖𝗵𝗮𝗻𝗻𝗲𝗹 • @Programers_Cafe

𝗚𝗿𝗼𝘂𝗽 • @IRdeveloperchat

☑️ موضوعات پرطرفدار از دید سایت daily.dev 👀♻️

1. وب‌اسمبلی (WebAssembly) 🌐🚀

🔧 آیا تا به حال فکر کرده‌اید که زبان‌هایی مثل C++ یا Rust را در مرورگر اجرا کنید؟ وب‌اسمبلی این امکان را فراهم کرده! 💡 با این تکنولوژی، اپلیکیشن‌های پیچیده و سنگین را با کارایی بالا در وب اجرا کنید.

به دنیای جدید وب‌اپلیکیشن‌ها خوش آمدید! 🚀🌍

2. فریم‌ورک‌های مدرن جاوااسکریپت 💻✨

🔥 دنیای جاوااسکریپت همچنان در حال تحول است! از قابلیت‌های جدید Next.js 13 مثل کامپوننت‌های سروری گرفته تا فریم‌ورک‌هایی مثل Solid.js و Qwik که سرعت و کارایی فوق‌العاده‌ای ارائه می‌دهند.

3. میکرو-فرانت‌اندها 🧩🔗

💡 آیا تا به حال به این فکر کرده‌اید که وب‌اپلیکیشن‌هایتان را به بخش‌های کوچک‌تر و مستقل تقسیم کنید؟ با معماری میکرو-فرانت‌اند، هر بخش از اپلیکیشن به صورت جداگانه توسعه و مستقر می‌شود.

این انعطاف‌پذیری و مقیاس‌پذیری بالا را از دست ندهید! 🚀🔧

4. تحول در CSS-in-JS 🎨💻

🎨 CSS-in-JS همچنان در حال تکامل است! با ابزارهایی مثل Vanilla Extract و Stitches، هم اکنون نیز می‌توانید CSS را با سادگی و کارایی بالا در پروژه‌های خود بکار بگیرید.

با این ابزارهای جدید، تجربه توسعه خود را به سطح بعدی ببرید! 🚀✨

5. سیستم‌های طراحی و کتابخانه‌های کامپوننت 📦🎨

🔧 سیستم‌های طراحی و کتابخانه‌های کامپوننت، توسعه وب را ساده‌تر و یکپارچه‌تر کرده‌اند! ابزارهایی مثل Storybook و کتابخانه‌های جدیدی مثل Chakra UI به شما این امکان را می‌دهند که کامپوننت‌های قابل استفاده مجدد و زیبا ایجاد کنید.

یکپارچگی و سرعت توسعه را با این ابزارها تجربه کنید! 🚀💻

6. کامپیوتینگ در لبه و JAMstack 🌍⚡

⚡ با ظهور JAMstack و کامپیوتینگ در لبه، تجربه وب به مرحله‌ای جدید وارد شده است! پلتفرم‌هایی مثل Vercel و Netlify امکان اجرای منطق سروری نزدیک به کاربر را فراهم کرده‌اند، که منجر به بهبود سرعت و کاهش تأخیر می‌شود.

آینده وب در لبه است! 🌐🚀

7. هوش مصنوعی و اتوماسیون در توسعه 🤖💡

🤖 با ابزارهای هوش مصنوعی مثل GitHub Copilot، کدنویسی به سطح جدیدی از هوشمندی رسیده است! پیشنهادات کد و تکمیل خودکار، سرعت و دقت شما را در توسعه افزایش می‌دهد.

وقت آن رسیده که با این ابزارهای جدید، نوآوری کنید! 🚀💻

8. اپلیکیشن‌های وب پیش‌رونده (PWA) 📱✨

📱 اپلیکیشن‌های وب پیش‌رونده (PWA) همچنان رو به جلو هستند! با قابلیت‌های آفلاین و نوتیفیکیشن‌های پیشرفته، تجربه‌ای شبیه به اپلیکیشن‌های بومی را برای کاربران فراهم کنید.

وب‌اپلیکیشن‌های آینده را امروز بسازید✨

🔰 به‌روز باشید و آینده وب را با این ابزارهای جدید بسازید! 🚀

𝗖𝗵𝗮𝗻𝗻𝗲𝗹 • @Programers_Cafe

𝗚𝗿𝗼𝘂𝗽 • @IRdeveloperchat