https://virgool.io/feed/@devAmirHemmati امیررضا همتی هستم یک برنامه نویس، برنامه نویسی که برنامه نویسی شده دنیاش! fa 2026-06-18 11:08:21 https://files.virgool.io/upload/users/83056/avatar/edCNNy.png?height=120&width=120 https://virgool.io/@devAmirHemmati https://virgool.io/Rocket/%D9%85%D8%AA%D8%AF-%D9%87%D8%A7%DB%8C-push-pop-shift-unshift-%D8%AF%D8%B1-%D8%AC%D8%A7%D9%88%D8%A7-%D8%A7%D8%B3%DA%A9%D8%B1%DB%8C%D9%BE%D8%AA-oxfmvi9hlw2o سلامی دوباره ....اومدم با یک مقاله دیگه،‌ و باز هم درباره موضوع متد های مربوط به آرایه در جاوا اسکریپت.ماشاالله انقدر متد هاش زیاد هست که فکر کنم فعلا گیرشیم، اما تا تمام مواردش توضیح ندم، سراغ دیگر مطالب نمیرم :)خدا رو شکر خوبی این ۴ متد اینه که پس از انجام عملیات همون زمان تغییرات رو به آرایه مورد نظرمون اعمال میکنه دقیقا مثل متد splice.اگر که نمیدونید splice چیه حتما مقاله زیر رو مطالعه کنید https://vrgl.ir/ConHl خب من یک ارایه دارم که میخوام با استفاده از متد های زیر یکمی باهاشون بازی کنم و شما هم یاد بگیرید که کارشون چیه، خوبه؟خب initial array هم برابر با مقدار زیر هست و در ادامه با بازی هایی که روش انجام میدیم دچار تغییراتی میشه :)const numbers = [1 ,2, 3, 4, 5];متد pushکاربرد: به اخر آرایه یک value جدید اضافه میکند.من میخوام مقدار ۶ رو به ارایه خودم اضافه کنم، لطفا عکس رو یکبار مشاهده کنید!!!متوجه شدید که؟خب همونطور که مشاهده میکنید با استفاده از push به اخر آرایه یک value جدید اضافه کردیم.چند تا ترفند کوچولو هم در موردش بگم و تمام.نکته اول: به متد push میتونیم به تعداد دلخواه پارامتر اضافه کنیم، و به همون ترتیب به اخر ارایه ما اون مقادیر رو اضافه میکنه.انقدری ساده و خوانا هست که نیازی به توضیح بیشتر نیست :)نکته دوم: میتونیم مقادیر یک ارایه رو از طریق spreed به آرایمون اضافه کنیمالبته اگر با spreed آشنایی ندارید پیشنهاد میکنم دربارش کمی مطالعه کنید، تا بعدا برای اون هم مقاله بزارم :)یک تصحیح کوچولو داخل کامنت: همین ارایه رو میخواهیم به numbers اضافه کنیم البته میتونستیم خود newNumbers رو یکجا به numbers اضافه کنیم اما اینجا من میخواستم که مقادیر درون newNumbers رو به numbers اضافه کنم :) اگر میخواستیم کل ارایه رو به numbers اضافه کنیم باید مینوشتیمsnumbers.push(newNumbers); // result => [1 ,2 ,3 ,4 ,5 ,[6 ,7 ,8]]متد popکاربرد:از اخر آرایه به مقدار یک value را حذف میکند.دیگه آسون تر از متد pop , shift وجود نداره!!!.عکس رو ببینید خود به خود متوجه میشید :)میخوام از داخل آرایه مقدار ۵ رو حذف کنم.دیدید چقدر ساده بود.البته این زمانی کاربرد داره که صرفا بخواهیم یک value از اخر ارایه حذف کنیم بیشتر از این مقدار، راه بهترش استفاده از متد spliceمتد shiftکاربرد:از اول آرایه به مقدار یک value را حذف میکند.این بار میخوام از داخل آرایه value یک رو حذف کنم.متد unshiftکاربرد:به اول آرایه یک value جدید اضافه میکند.به ابتدای آرایه میخوام مقدار ۰ را اضافه کنم.نکات مربوط به متد push برای متد unshift هم صدق میکنه،‌ پس دیگه توضیح دوباره نمیدم :)نکته ای که وجود داره اگر ما هر کدوم از این عملیات هارو درون متغییر بگزاریم دقیقا میاد همون مقداری که اضافه یا حذف شده است رو درون متغیر ما قرار میده :)‌ مثلا ...کامنت ها رو مطالعه کنید و پایان یادگیری :)اگر مفید بود براتون ❤️️ رو حتما بزنید.از دنبال کننده های من هم بشید تا بیشتر مقاله بزارم ?ممنون که وقت گذاشتید ? امیر همتی امیر همتی Thu, 02 Jul 2020 14:13:47 +0430 https://virgool.io/Rocket/%D8%A2%D8%B4%D9%86%D8%A7%DB%8C%DB%8C-%D8%A8%D8%A7-%D9%85%D8%AA%D8%AF-%D9%87%D8%A7%DB%8C-find-%D9%88-filter-%D8%AF%D8%B1-%D8%AC%D8%A7%D9%88%D8%A7-%D8%A7%D8%B3%DA%A9%D8%B1%DB%8C%D9%BE%D8%AA-q7sw2oo2l56f سلامی مجدد ...Filter and Find in javascriptدر این مقاله قصد دارم شما رو با دو تا از متد های خفن مخصوص ارایه اشنا کنم که قطعا خیلی بدردتون میخوره.(تو پرانتز بگم بجز اینها یک متد خوب دیگه که مشابه این ها هستند با کمی تفاوت اساسی رو هم مطرح میکنم)findIndexهست اون یکیم!!!بنظر من متد های مربوط به ارایه در جاوااسکریپت(خلاصش میکنم به جی اس در دفعات بعد) ارایه ها در جی اس رو بسیار انعطاف پذیر کرده در مقاله اولم به متد splice پرداختم بصورت خیلی کامل بریم تو کار این دوتا https://vrgl.ir/ConHl اگر با splice اشنایی ندارید تو مقاله بالا بصورت خیلی کامل توضیح دادم !!!Findاین متد داخل ارایه میگرده و دقیقا اولین مقداری که داخل ارایه با مقدار مورد نظر ما برابر باشه رو بر میگردونه در یک مثال خفن توضیحش میدم:) نکته: تمام متد هایی که معرفی میکنم همه یک پارامتر دارند که این پارامتر مقدار تکی هر ارایه رو بر میگردونه مثلا در فاز اول (مقدار اندیس ۰ رو برمیگردونه :)نامشون رو هم دلخواه میتونیم بزاریم تو مثلا پایین نام پارامتر رو item قرار دادم.چون پارامتر داره بهمون یکی از مقادیر ارایه برمیگردونه بهتره نامی انتخاب نکنیم که جمع باشه، مثلا: items درست نیست,ولی item درستهالبته هیچ اجباری در این ماجرا نیست !!!مثال بالا از ساده هم ساده تر بود، اگر موافق هستید یک مقدار سخت ترش کنیم و به شکلی تبدیلش کنیم که شبیه به استفاده در پروژه عملی باشه (البته کامنت های بالا حذف میشن :) تو پروژه هم شاید ممکن باشه(ممکن نه!!! قطعا بدردتون میخوره) از این روش نیاز باشه استفاده کنید...یه نکته مهم بوجود میاد که اینم از قلم نندازیم خیلی خوبه...اگر که این متد نتونست مقدار مارو داخل ارایه پیدا کنه چی میشه؟؟؟ مقدار undefined برمیگرده برامونیک نکته کوچولو دیگه مونده که اون هم مطرح کنم میریم سراغ متد filter ?اگر داخل ارایه دوتا مقدار یک شکل پیدا شد اونوقت کدومش برمیگرده ؟؟؟داخل یک مثال خدمتتون مطرح میکنم:)کامنت رو مطالعه کنید حتما...اینجا ای دی ۲ برمیگرده چون از اندیس اول ارایه سرچ میکنه و تا اون مقدار مشابه پیدا کنه متد متوقف میشه و result میده بهمون اوکی؟Filterتقریبا نحوه کار این هم مثل متد find هست اما از اسمش معلومه تفاوت دارنراحتتون میکنم:متد find میاد صرفا دنبال یک مقدار میگرد و تا پیداش کرد متوقف میشه کاربردش برای پیدا کردن id و اینجور چیزاس.ولی فیلتر میاد تمام مقادیری که مساوی مقدار مشخص شده ما هستند رو در قالب array به ما برمیگردونه.داخل مثال حرفم بهتر متوجه میشید...اینجا چون دو نام مشابه مقدار مشخص شده ما بود هردوش رو برگردوندیک نکته مهم: حتی اگر مقدار یافت شده در فیلتر یک دونه باشه هم به ما در قالب ارایه برمیگردونهیک نکته مهم دیگه: حتی اگر هیچ مقداری مساوی مقدار مشخص شده ما یافت نشه باز هم ارایه بر میگرده و اینبار undefined نمیاد. البته یک ارایه خالی خالی یعنی این []بریم سراغ اخرین متد که میخوام مطرح کنم و پایان کار اسمش هست ?findIndexاین متد دقیقا مثل متد find هست عملکرد هاش با این تفاوت که بجای برگردوندن مقدار میاد اندیس مقدار، در ارایه رو به ما میده، بیشتر از این خستتون نمیکنم و با یک مثال توضیح میدم یعنی چی :)‌ :(همونطور که میبینید اندیس یک بهمون داد که داخل ارایه دانش اموزان این اسم در اندیس یک استدلیل اینکه داخل متد های دوم و سوم دربارشون کمتر توضیح دادم این بود که داخل متد اول ترفند های مهمش گفتم و اگر دوباره میخواستم تکرار کنم حوصله سر بر بود حتی برای خود من.یک نکته بگم حتما خودتون هم با این متد ها بازی کنید قطعا فنونی دارند که شاید بلد نیستم یا فراموش کردم توضیح بدم(سرچ هم بی تاثیر نیست!!!) اما مطالب مهمش رو گفتم خدمتتونلطفا اگر از مقاله راضی بودید، برای دوستانتون هم ارسال کنید تا از مقاله استفاده کنند.اگر مفید بود براتون لایک فراموش نکنید.از دنبال کننده های من هم بشید تا بیشتر مقاله بزارم :)ممنون که وقت گذاشتید. امیر همتی امیر همتی Wed, 01 Jul 2020 07:20:05 +0430 https://virgool.io/Rocket/redux-and-context-jwhlces2t42g تو این مقاله قصد دارم با لحنی خودمونی تجربه خودم از کار با redux و context رو بگم> این نظر بنده هست، و ممکنه تجربه دیگران در رابطه با این موضوع متفاوت باشه.من خودم اولش که ریکت رو در سطح بیسیک یاد گرفتم، رفتم سراغ ریداکس اما متاسفانه بومممممممبرای من کاملا گنگ بود مبحثش > Action , Reducer , Dispatch , Types for actionو چون این مباحث رو متوجه نمیشدم، با خودم تکرار میکردم که context تو بهترین و خفن ترینیتا اینکه داخل یک پروژه ازش استفاده کردم و یکمی پروژه بزرگ بود، متوجه شدم که درسته context خیلی خیلی راحت هست و خفن ....اما تو پروژه بزرگ یکمی مدیریتش سخت هست.اینجا بود که گفتم چیکار کنم چیکار نکنم، گفتم یک بار دیگه با قدرت و روحیه بیشتر شروع میکنم.> یک نکته مهم که متوجه شدم فهمیدم نباید همون اول مدرس با reactjs، ریداکس رو اموزش بده، ابتدا باید داخل vanilla js مبانی ریداکس رو مطرح کنه و بعد در کتابخانه ریکت اون رو اموزش بده.خلاصه این که ایندفعه با امید و سرسختی بیشتر اموزش رو شروع کردم و یادش گرفتم.بعدش فهمیدم ریداکس چقدر باحال و خفنه.چقدر مدیریت state هاتو راحت میکنه.خودمونیما ولی داخل context امکانات زیر نبودمثلاredux devToolsدسترسی به state ها به سادگی ریداکس، حداقل این موضوع برای من که یک موضوع اعصاب خورد کن بود که بعد تعریف هر context بیام داخل پروژه براش یک provider تعریف کنم، از قلم نندازیم قبل اومدن هوک ها دریافت استیت مورد نظر از ریداکس با استفاده از متد connect کار حضرت گوگل بوداااااا اما وقتی useSelector اومد، دیگه این کار شد مثل اب خوردن!!!!خداییش از redux saga هم نباید بگزریم که خیلی باحال و خفن هستش.داخل پروژه dev.app.panel.directیادی کنیم از ریداکس ساگا که خیلی مدیریت درخواست هام رو راحت کرده بود یکی از دلایلی که خیلی ریداکس دوست دارم همین ریداکس ساگا.اما خب تا اینجا این همه خوبی های ریداکس گفتیم بزارید یکمیم از context بگیمقبل ریداکس حداقل از نظر من حتما باید context بلد باشید تا بتونید ریداکس رو خوب درک کنید.چه بخواهید چه نخواهید پروژه هایی هستن که کارفرما میخواد با context بسازید، پس این همه تکنولوژی بلد باشیم و یک context رو بلد نباشیم حیفه..کانتکس هم خیلی global state management خفنی، من به شخصه دوستش دارم، اما خب حداقل من تو پروژه های بزرگ با ریداکس خیلی راحت تر بودم به دلیل وجود یک سری قابلیت ها.لطفا اگر از مقاله راضی بودید من رو دنبال کنید، ممنونم که مقاله رو مطالعه کردید :) امیر همتی امیر همتی Tue, 26 May 2020 03:16:24 +0430 https://virgool.io/Rocket/splice-in-js-go7tstn6kohx در این مقاله قرار هست که یک بار برای همیشه کاربرد متد splice رو متوجه بشیم. خودتون رو آماده کنید که قرار کلی ترفند ازش یادبگیرید :)خب دیگه دست از صحبت بردارم و وارد توضیح این متد بشم (برو که رفتیم ...) متد splice در آرایه کاربرد دارد و کارش این هست که یک مقداری رو از داخل آرایه حذف کنه و درصورت نیاز جای اون مقدار حذف شده مقدار جدید قرار بده، و اینکه می تواند هیچ مقداری حذف نکند داخل ارایه و فقط در اندیس دلخواه مقدار اضافه کنه. به کد پایین دقت کنید و کامنت ها رو مطالعه کنید حتما ....همونطور که میبینید return با همون مقادیر رو برمیگردونه دلیلش اینه که من در پارامتر دوم splice مقدار صفر را وارد کردم که همین باعث میشه هیچ مقداری حذف نکنه !!!خب حالا بریم که یک مقدار رو از داخل آرایه حذف کنیم :)در کد بالا همونجور که مشاهده میکنید از اندیس صفر به مقدار یک اندیس از داخل آرایه حذف کردیم که همون مقدار 1 این کار کرده :(حالا میخوام از از اندیس یک به بعد به مقدار یک اندیس حذف کنم...خب حالا اگر مشاهده کنید میبینید مقادیر صفر و سه و چهار باقی مانده، بخاطر این هست که گفتم از اندیس اول به بعد دو اندیس رو پاک کن (بازم میگم حتما کامنت ها مشاهده کنید... )الان میخوام از اندیس صفر به بعد هرچی هست رو حذف کنم، بهتر بگم میخوام هرچی داخل آرایه دارم رو پاک کنم...برای این کار کافیه پارامتر اول متد splice رو برابر صفر قرار بدهیم و پارامتر دوم رو هیچی ننویسیم که باعث میشه آرایه مقداری نداشته باشه و یه آرایه خالی باشهبرای این کار کافیه پارامتر اول متد splice رو برابر صفر قرار بدهیم و پارامتر دوم رو هیچی ننویسیم که باعث میشه آرایه مقداری نداشته باشه :)بریم که از اندیس دوم به بعد هرچی هست رو پاک کنیم :)دیگه خودتون استاد شدید:). این دفعه خودت حدس بزن چیکار کردم که این مقادیر return شده.حتما میدونی دیگه نمیدونی؟بخش دوم آموزش.از اینجا به بعد میخوام هرمقدار که حذف میکنم بجاش یه چیز دیگه بزارم و همینطور یک مقدار رو با splice به آرایه اضافه کنم در هر شماره اندیس که خودم دوست داشتم تو کد ببینید منظورم حتما بهتر متوجه میشید دوستان ...این کد شاید گیج بشید یکم ولی کد رو ترجمه میکنم متوجه میشید ...تا پارامتر دوم متد رو که میدونید حتما درسته ؟( در کل این رو بگم که ما بعد پارامتر دوم در متد splice هرچی مقدار بدیم یعنی باید به آرایه این مقادیر اضافه بشه)مثلا در قطعه کد بالا گفتم از اندیس صفرم شروع بشه و هیچ مقداری هم حذف نشه و همینطور قبل اندیس صفرم مقدار -1 اضافه بشه (گرفتی الان ؟)الان میخوام قبل اندیس صفرم بجای اینکه یک مقدار اضافه کنم سه مقدار اضافه کنم ( میخوام اینو بهتون بگم که بعد پارامتر دوم هرچی مقدار بدی به آرایه اضافه میشه دیگه ...)خب همونجور که مشاهده میکنید از پارامتر سوم به بعد هرچی مقدار بوده به آرایه اضافه شده. همچنین مقدار ها ترتیبی از پارامتر سوم شروع میکنه به اضافه شدن این خیلی مهم هستا!!! مقدار return رو مشاهده کنیم منظورم بهتر متوجه بشیدخب الان میخوام قبل آرایه دوم یک مقدار رو اضافه کنم ...خب اومدم پارامتر اول بجای اینکه مقدار صفر بدم مقدار دو رو دادم که مشاهده میکنید قبل اندیس دوم آرایه مقدار new اضافه میشوددر این بخش میخوام مقدار یک اندیس حذف کنم و بجاش مقادیری رو قرار بدماول بیایم اندیس صفرم رو حذف کنیم و بجای مقدار new رو قرار بدیمهمونجور که از کد ها پیداست برای این کار کافیه مقدار پارامتر دوم رو تغییر بدیم و به تعداد دلخواه از ارایه مقدار حذف کنیم و بعدش در پارامتر سوم به بعد مقداری که میخواهیم قبل پارامتر اول اضافه بشه رو بنویسیمحالا بیایم از اندیس صفرم به بعد دو آرایه حذف کنیم و بجاش new بزاریمکافیه که پارامتر دوم هرچند مقداری که میخواهیم حذف کنیم قرار بدیمبریم سراغ اخرین مثال این بخش: میخوام از اندیس دوم دو ارایه حذف کنم و بجاش سه مقدار قرار بدم.خب الان همینجور که میبینید اندیس 2و3 پاک شدند و بجای متن new قرار گرفتچطور مقداری که حذف میشوند رو بخوانیم ؟؟؟خب اگر دقت کرده باشید من در مثال های قبل متد splice رو داخل متغیر valueSplice قرار دادم این باعث میشه که هر مقداری که حذف بشه داخل این متغیر قرار بگیره خب تو این کد من valueSplice رو log زدم که مقادیر 2,3 که پاک شدند return شده(به این دلیل داخل متغیر قرارش میدیم !!!)یک مثال دیگه و پایان خب من با توجه به کد اومدم کل آرایه رو پاک کردم. که همینطور که میبینید آرایه خالی میشه، و valueSplice کل آرایه رو برمیگردونه!!!بنظر خودم هرچیزی که در مورد متد splice در آرایه ها نیاز بود رو گفتم، دوستان آرایه ها خیلی متد های مهمی دارند که یک فردی که میخواد جاوااسکریپت کار کنه باید اون ها رو خوب درک کنه، من سعیم رو کردم که هرچیزی درباره splice بود رو بگم حالا اینکه خوب یا بد هست با شما !!!.اگر مقاله خوبی بود حتما در نظرات بفرمایید چون اگر راضی بودید با همین روند بهتون در مقاله ها مطالب مهم جاوااسکریپت رو آموزش میدم...نقد و انتقادم فراموش نشهمورد اخر اینکه اگر از مقاله راضی بودید لایک فراموش نشهممنون که وقت گذاشتید : امیر همتی امیر همتی Wed, 01 Jan 2020 14:29:16 +0330