نوشته های یک برنامه نویس

الگوهای طراحی (Design patterns) جاوا اسکریپت در ۳ دقیقه

یک برنامه نویس — Mon, 30 Jan 2023 15:37:55 +0330

جاوا اسکریپت به یکی از محبوب ترین زبان های برنامه نویسی در جهان تبدیل شده است که توسط توسعه دهندگان برای ایجاد وب سایت ها و برنامه های کاربردی وب پویا و تعاملی استفاده می شود. همانطور که توسعه وب تکامل یافته است، الگوهای طراحی نیز برای ایجاد کدهای کارآمدتر، مقیاس پذیر و قابل نگهداری استفاده می شوند. در این مقاله، برخی از متداول‌ترین الگوهای طراحی در جاوا اسکریپت و اینکه چگونه می‌توانند به شما در نوشتن کد بهتر و قابل استفاده‌تر کمک کنند را بررسی می‌کنیم.الگوی ماژول: این الگو به شما امکان می دهد کد خود را در ماژول های قابل استفاده مجدد بسازید و سازماندهی کنید و راهی تمیز و محصور شده برای ایجاد و مدیریت عملکردهای پیچیده ارائه دهید.الگوی Factory: این الگو به شما امکان می دهد چندین نمونه از یک شی را ایجاد کنید که هر کدام ویژگی ها و روش های منحصر به فرد خود را دارند، بدون اینکه نیازی به بازنویسی دوباره و مکرر همان کد باشد. الگوی Observer: این الگو به شما اجازه می دهد تا رابطه ای بین اشیا ایجاد کنید تا یک شی بتواند دیگران را از تغییرات مطلع کند. این می تواند برای ایجاد برنامه های رویداد محور و اطمینان از اینکه اشیاء مناسب به روز رسانی ها را در زمان مناسب دریافت می کنند مفید باشد. الگوی Singleton: این الگو تضمین می‌کند که تنها یک نمونه از یک شی معین ایجاد می‌شود و مدیریت و حفظ یک حالت مشترک در برنامه شما را آسان‌تر می‌کند.الگوی Prototype: این الگو به شما اجازه می دهد تا اشیاء جدیدی را بر اساس یک شی موجود ایجاد کنید، ویژگی ها و روش های آن را به ارث برده و ایجاد اشیاء جدید با عملکرد مشابه را آسان تر می کند.الگوی Command: این الگو به شما امکان می دهد ساختاری برای مدیریت دستورات و اقدامات ایجاد کنید، مدیریت تعاملات پیچیده کاربر را آسان تر می کند و به شما امکان می دهد کد خود را از اجرای واقعی دستورات جدا کنید.الگوی Decorator: این الگو به شما امکان می دهد بدون نیاز به تغییر کد اصلی آن، عملکرد جدیدی را به یک شی موجود اضافه کنید، و گسترش و اصلاح کد موجود را بدون شکستن عملکرد موجود آسان تر می کند.در نتیجه، الگوهای طراحی بخشی ضروری از ابزارهای توسعه دهندگان جاوا اسکریپت هستند که راه حل های اثبات شده ای را برای مشکلات رایج توسعه ارائه می دهند و نوشتن کدهای کارآمد، مقیاس پذیر و قابل نگهداری را آسان تر می کنند. چه یک توسعه‌دهنده باتجربه باشید و چه تازه شروع به کار کرده‌اید، درک این الگوها می‌تواند به شما کمک کند کدهای بهتر و مؤثرتری بنویسید و مهارت‌های توسعه وب خود را به سطح بعدی ارتقا دهید. نظر خودتون رو درباره design pattern ها بگید؟ اگر دوست داشتید برای مقالات بیشتر من رو دنبال کنید!

هوش مصنوعی ChatGPT: هوش مصنوعی که شما را درک می کند

یک برنامه نویس — Sat, 21 Jan 2023 23:36:00 +0330

سلام!می‌خواستم چیزی واقعاً هیجان‌انگیز را که اخیراً با آن برخورد کردم به اشتراک بگذارم - ChatGPT توسط OpenAI. همانطور که ممکن است بدونید، OpenAI یک شرکت فناوری پیشرفته است که در هوش مصنوعی و یادگیری ماشین تخصص دارد کخ به دلیل کار پیشرفته خود در زمینه پردازش زبان طبیعی و یادگیری عمیق،پیشرو صنعت فناوری بوده اند.یکی از جدیدترین پیشرفت های آنها ChatGPT است، یک مدل زبان که به طور خاص برای درک و پاسخ به زبان طبیعی طراحی شده است. یعنی این که می تواند با انسان به گونه ای صحبت کند که طبیعی و عادی باشه. می تواند به سوالات پاسخ دهد، ایمیل بنویسد و …توی این مدتی که با ChatGPT کار کردم باید بگویم که واقعاً تحت تأثیر قرار گرفته‌ام. سطح درک و دقت آن واقعا شگفت انگیز است. می‌تواند زمینه را درک کند و پاسخ‌هایی شبیه به انسان ایجاد کند، که آن را به ابزاری ایده‌آل برای کسب‌وکارهایی تبدیل می‌کند که به دنبال بهبود خدمات مشتری، تعاملات چت‌بات و حتی تولید محتوا هستند. به عنوان مثال، اگر یک وب سایت فروشگاهی دارید و می خواهید توضیحات محصول ایجاد کنید، ChatGPT می تواند توضیحاتی را بنویسد که جذاب و بسیار کامل باشد.من واقعا هیجان زده هستم که ببینم چگونه این فناوری به تکامل خود ادامه می دهد و نحوه تعامل ما با ماشین ها را تغییر می دهد. با پیشرفت های سریع در هوش مصنوعی و یادگیری ماشینی، فکر کردن در مورد امکاناتی که می توان در آینده به آن دست یافت، هیجان انگیز است.نکته مهم در مورد ChatGPT این است که OpenAI از طریق OpenAI API که به توسعه دهندگان اجازه می دهد مدل را در برنامه های خود ادغام کنند، آن را برای استفاده همه در دسترس قرار داده است. این بدان معناست که کسب و کارها در هر اندازه می توانند از این فناوری قدرتمند استفاده کنند و این واقعاً هیجان انگیز است.اگر علاقه مند به کسب اطلاعات بیشتر در مورد ChatGPT و OpenAI هستید، به شدت توصیه می کنم وب سایت آنها را ببینید. در آنجا اطلاعات زیادی در مورد مدل و قابلیت‌های آن و … برای شروع کار پیدا خواهید کرد.به طور کلی، من فکر می کنم ChatGPT یک فناوری واقعاً نوآورانه است که پتانسیل تغییر نحوه تعامل ما با ماشین ها را دارد. دیدن آینده برای هوش مصنوعی و NLP هیجان‌انگیز است و من نمی‌توانم منتظر بمانم تا ببینم OpenAI در آینده چه پیشرفت‌های دیگری خواهد داشت.نظر شما در مورد این فناوری چیست؟ آیا فرصتی برای بازی با ChatGPT داشته اید؟ من دوست دارم نظرات شما را در نظرات بشنوم!

بررسی سه تابع مهم Map، Filter و Reduce در جاواسکریپت

یک برنامه نویس — Tue, 08 Feb 2022 08:33:53 +0330

در این مقاله می خواهیم به سه تا متد مهم Map، Filter و Reduce جاوا اسکریپت در ارایه ها بپردازیم.متد فیلترمتد فیلتر یک تابع callback را به عنوان ورودی می گیرد و یک ارایه جدید بر می گرداند.نکات مهم:متد filter یک آرایه جدید پر از عناصری ایجاد می کند که تست ارائه شده توسط یک تابع را رد می کنند.متد filter تابع را برای عناصر خالی اجرا نمی کند.متد filter آرایه اصلی را تغییر نمی دهد.به طور خلاصه، اگر بخواهیم یک ارایه را فیلتر کنیم، می توانیم از تابع filter استفاده کنیم.نحو استفاده:array.filter((element) => { /* ... */ } )‍‍‍‍‍‍‍‍مثال:let array = [ {id: 1}, {id: 2}, {id: 3}, {id: 4}, {id: 5}, {id: 6}, {id: 7}, {id: 8}, {id: 9}, {id: 10}, {id: 11}, {id: 12}, {id: 13}, {id: 14}, {id: 15}, // ... ]; let result = array.filter(item => item.id>5); console.log(result);در این نمونه ما می خواهیم همه عناصر با id بالاتر از ۵ را بگیریمتابع فیلتر را می نویسیم و آن را به متغیر با نام result اختصاص می دهیم. این متغیر را روی صفحه چاپ می کنیمو ما با موفقیت عناصر با id بالاتر از ۵ را فیلتر کردیم.متد مپما از تابع map برای بازسازی یک آرایه در قالبی که می خواهیم استفاده می کنیم.متد map یک آرایه جدید از فراخوانی یک تابع برای هر عنصر آرایه ایجاد می کند.متد map یک تابع را یکبار برای هر عنصر در یک آرایه فراخوانی می کند. متد map تابع را برای عناصر خالی اجرا نمی کند.متد map آرایه اصلی را تغییر نمی دهد.متد map یک آرایه جدید ایجاد می کند که با نتایج فراخوانی یک تابع ارائه شده در هر عنصر در آرایه فراخوان پر شده است.نحو استفاده:array.map((element) => { /* ... */ })مثال:let array = [ {id: 1, name: 'John'}, {id: 2, name: 'Doe'}, {id: 3, name: 'Smith'}, {id: 4, name: "Bob"}, {id: 5, name: "Adam"}, // ... ]; let mapResult = array.filter(item => item.id<5).map(item => { return { mapId: item.id, mapName: item.name } }); console.log(mapResult);من می خواستم اطلاعات با id کوچکتر از ۵ را بگیرم و id را در mapId قرار دهم و name را در mapName.تابع filter و map را می نویسیم سپس ارایه جدید را در متغیر mapResult قرار می دهیم و مقدار متغیر را چاپ می کنیم. و ما عناصر با شناسه کوچکتر از ۵ را با موفقیت filter و map کردیم.متد Reduceهدف تابع Reduce این است که تمام عناصر آرایه اصلی را با مقدار اولیه یا مقدار شی به واحد تبدیل کند.متد Reduce یک تابع reducer را برای عنصر آرایه اجرا می کند.متد Reduce یک مقدار واحد را برمی گرداند: نتیجه جمع اوری شده تابع.متد Reduce تابع را برای عناصر آرایه خالی اجرا نمی کند.متد Reduce آرایه اصلی را تغییر نمی دهد.متد reducer تابع فراخوانی «reducer» ارائه شده توسط کاربر را بر روی هر عنصر آرایه به ترتیب ارسال مقدار بازگشتی از محاسبه روی عنصر قبلی اجرا می کند. نتیجه نهایی اجرای reducer در تمام عناصر آرایه یک مقدار واحد است.نحو استفاده:array.reduce((previousValue, currentValue) => { /* ... */ } )مثال:let array = [ {id: 1}, {id: 2}, {id: 3}, {id: 4}, {id: 5}, {id: 6}, {id: 7}, {id: 8}, {id: 9}, {id: 10}, {id: 11}, {id: 12}, {id: 13}, {id: 14}, {id: 15}, // ... ]; let sumId = array.reduce((sum, item) => sum + item.id, 0); console.log(sumId);من می خواهم جمع id های موجود در ارایه را بگیرم.تابع reduce را می نویسیم سپس مقدار جدید را در متغیر sumId ذخیره می کنم. سپس متغیر را چاپ می کنیم.ما با موفقیت id عناصر را جمع کردیم.نتیجه گیریما توابع filter، map و reduce را به شکل ساده بررسی کردیم. آنها در صورت استفاده صحیح عملیات ما را بسیار ساده تر می کنند.نظر شما چیست کدام تابع کاربردی تر هست؟ یا اصلا تا حالا از این ۳ تابع استفاده کردید؟ ایا قبلا نحوه استفاده انها را می دانستید؟ لطفا نظرات خودتون رو به اشتراک بگذاریدمنابع:https://ocokyilmaz.medium.com/how-to-use-filter-map-and-reduce-a60fce1e6957https://developer.mozilla.org/https://www.w3schools.com/

دیجی کالا و React

یک برنامه نویس — Mon, 07 Feb 2022 15:19:17 +0330

در این مقاله، به بررسی تغییر زبان برنامه نویسی دیجی کالا می پردازیم.اگر در چند روز اخیر وارد سایت دیجی کالا شده باشید احتمالا خواهید دید که تغییرات کوچکی در ظاهر سایت به وجود اومده. دیجی کالا پس از چند سال استفاده از jQuery در قالب سایت حالا تکنولوژی های خودش را تغییر داده و به React.js و Next.js سوئیچ کرده.دیجی کالا در اقدام قبلی اپلیکیشن موبایل خود را از kotlin و java تغییر داد و به سمت ریکت نیتیو ( نسخه android و ios فریمورک react که توسط خود facebook نوشته شده ) رفت. حالا تکنولوژی های سایت را هم تغییر داده و به سمت React رفته.قالب قبلی سایت دیجی کالا با کتابخانه JQuery نوشته شده بود ولی حالا ورژن جدید قالب با React و next.js نوشته شده. اگر تب نتورک در قسمت Developer tools ( یا همان inspect ) را باز کنید می بینید که به ادرس مربوط به api دیجی کالا یا https://api.digikala.com/ درخواست فرستاده میشه. به احتمال زیاد دیجی کالا هنوز از php به عنوان زبان بک اند استفاده می کند و دیتابیس هم هنوز یک دیتابیس sql هست ( احتمالا mysql ) ولی این بار سایت اصلی با react و nextjs نوشته شده که با استفاده از nodejs سایت به شکل ssr در امده هست و به همین دلیل هست که در بار اول درخواست ها در سمت سرور فرستاده میشود ولی هنگام استفاده از سایت ( به شکل spa ) درخواست هایی به سرور میرود. دلیل استفاده از ssr این هست که سایت برای seo اماده باشد همین طور اگر کسی از مرورگر های قدیمی یا مرورگری که javascript روی آن غیر فعال است بالا بیاید. اگر دقت کرده باشید تغییرات جزیی در ui سایت به وجود امده مثلا تغییر سایز فونت و رنگ قسمتی از سایت ولی به طور کلی قالب سایت با ورژن قبلی برابر هست.اگر به قسمت مسابقات Quera رفته باشید دیجی کالا مسابقه جدیدی با نام دیجی کالا سوپر کاپ برگزار می کند که انتظار می رود منظور از Front-end در اینجا ریکت و nextjs باشد.حالا سایت های دیگر شرکت دیجی کالا روی React رفته ولی هنوز سایت دیجی استایل روی jQuery هست.دیجی کالا به عنوان یک کسب و کار بزرگ اینترنتی باید سایت خوبی داشته حالا با اضافه شدن React قوی ترین فریمورک جاواسکریپتی قالب سایت خیلی بهینه تر و سریع تر شده است.