آموزش JavaScript
بستن دسته بندی
۲۵۲
تعداد کلیدهای این موضوع
لیست همه کلیدهای این موضوع
نمایش دسته بندی ها (۲۵۲ آموزش)
مباحث اولیه برای آشنایی با JavaScript
مباحث اولیه برای آشنایی با JavaScript
18
کنسول (Console)، در JavaScript
کنسول (Console)، در JavaScript
24
نمایش متن در خروجی صفحه، در JavaScript
نمایش متن در خروجی صفحه، در JavaScript
2
عملگرها (Operator)، در JavaScript
عملگرها (Operator)، در JavaScript
0
متغیرها (Variable)، در JavaScript
متغیرها (Variable)، در JavaScript
8
رشته ها (متن ها - String)، در JavaScript
رشته ها (متن ها - String)، در JavaScript
26
نمایش پیام، در JavaScript
نمایش پیام، در JavaScript
4
توابع (Function)، در JavaScript
توابع (Function)، در JavaScript
5
حلقه ها (Loop)، در JavaScript
حلقه ها (Loop)، در JavaScript
3
آرایه ها (Array)، در JavaScript
آرایه ها (Array)، در JavaScript
30
شیء ها (Object)، در JavaScript
شیء ها (Object)، در JavaScript
2
انتخاب عنصرهای صفحه (اشاره به عنصرهای صفحه)، در JavaScript
انتخاب عنصرهای صفحه (اشاره به عنصرهای صفحه)، در JavaScript
7
کلاس های (Class) عنصرها، در JavaScript
کلاس های (Class) عنصرها، در JavaScript
5
id عنصرها، در JavaScript
id عنصرها، در JavaScript
0
مشخصه های (Attribute) عنصرها، در JavaScript
مشخصه های (Attribute) عنصرها، در JavaScript
1
رویدادها (Event)، در JavaScript
رویدادها (Event)، در JavaScript
0
عملیات های ریاضی، در JavaScript
عملیات های ریاضی، در JavaScript
18
تاریخ و زمان، در JavaScript
تاریخ و زمان، در JavaScript
10
زمان بندی اجرای کدها، در JavaScript
زمان بندی اجرای کدها، در JavaScript
2
افزودن و یا حذف محتوا و کد، به صفحه، در JavaScript
افزودن و یا حذف محتوا و کد، به صفحه، در JavaScript
6
فرم ها (Form)، در JavaScript
فرم ها (Form)، در JavaScript
11
عکس ها (Image)، در JavaScript
عکس ها (Image)، در JavaScript
2
دکمه ها (Button)، در JavaScript
دکمه ها (Button)، در JavaScript
2
لینک ها (Link)، در JavaScript
لینک ها (Link)، در JavaScript
5
پنجره ها (Window)، در JavaScript
پنجره ها (Window)، در JavaScript
2
جدول ها (Table)، در JavaScript
جدول ها (Table)، در JavaScript
1
رنگ ها (Color) و تعیین رنگ، در JavaScript
رنگ ها (Color) و تعیین رنگ، در JavaScript
1
کلیک کردن (Click)، در JavaScript
کلیک کردن (Click)، در JavaScript
1
اسکرول (Scroll)، در JavaScript
اسکرول (Scroll)، در JavaScript
2
کار با کل صفحه، در JavaScript
کار با کل صفحه، در JavaScript
1
صفحه فعلی (Current Page)، در JavaScript
صفحه فعلی (Current Page)، در JavaScript
19
دریافت ورودی از کاربر، در JavaScript
دریافت ورودی از کاربر، در JavaScript
1
تمرکز (Focus)، در JavaScript
تمرکز (Focus)، در JavaScript
3
مرورگر اینترنت (Browser)، در JavaScript
مرورگر اینترنت (Browser)، در JavaScript
3
ذخیره اطلاعات در مرورگر اینترنت (Browser) کاربر، در JavaScript
ذخیره اطلاعات در مرورگر اینترنت (Browser) کاربر، در JavaScript
10
کار با کیبورد (Keyboard)، در JavaScript
کار با کیبورد (Keyboard)، در JavaScript
2
موس، در JavaScript
موس، در JavaScript
1
Iframe ها، در JavaScript
Iframe ها، در JavaScript
1
بارگذاری (دانلود) فایل، در JavaScript
بارگذاری (دانلود) فایل، در JavaScript
1
علامت ها (Sign)، در JavaScript
علامت ها (Sign)، در JavaScript
0
تکنیک Ajax ، در JavaScript
تکنیک Ajax ، در JavaScript
4
ساختار JSON ، در JavaScript
ساختار JSON ، در JavaScript
0
منسوخ شده ها (Deprecated و Obsolete)، در JavaScript
منسوخ شده ها (Deprecated و Obsolete)، در JavaScript
1
مباحث عمومی، در JavaScript
مباحث عمومی، در JavaScript
2

نویسنده علیرضا گلمکانی
شماره کلید 27635
گزینه ها

کلید VIP

برای مشاهده تمامی محتوای این کلید VIP ، می توانید از لینک زیر، عضویت خود را به VIP ارتقا دهید :

خرید عضویت VIP

فیلتر (Filter) کردن عنصرهای (Element) یک آرایه (Array)، با اجرای یک تابع (Function) بر روی تک تک عنصرهای (Element) آرایه (Array) و چک کردن یک شرط (Condition) توسط تابع (Function) و برگرداندن عنصرهایی (Element) که در شرط صدق می کنند به صورت یک آرایه (Array) جدید، با روش filter ، در JavaScript

با استفاده از روش filter در JavaScript ، می توانیم عنصرهای (Element) یک آرایه (Array) را فیلتر (Filter) کنیم، یعنی عنصرهایی (Element) از آرایه (Array) که در یک شرط (Condition) خاص صدق می کنند را به صورت یک آرایه (Array) جدید به دست می آوریم (فیلتر کردن).

روش filter ، یک تابع (Function) را در ورودی خود دریافت می کند و این تابع (Function) است که شرط (Condition) مورد نظرمان در آن تعریف شده است و هر عنصری (Element) را که شرط برای آن صادق باشد، تابع (Function) آن عنصر (Element) را با استفاده از return برمی گرداند.

نکته

اگر تابعی (Function) که به روش filter می دهیم، تنها یک ورودی (input) داشته باشد، آنگاه روش filter ، آن ورودی را به عنوان مقدار (Value) عنصر (Element) (یعنی خود عنصر) در نظر می گیرد (عنصر آرایه اصلی). یعنی به شکل کلی زیر :


ارتقا دهید VIP برای مشاهده کد، باید عضویت خود را به
خرید عضویت VIP

اگر تابعی (Function) که به روش filter می دهیم، دو ورودی (input) داشته باشد، آنگاه روش filter ، ورودی اول را به عنوان مقدار (Value) عنصر (Element) (یعنی خود عنصر) و ورودی دوم را به عنوان شماره متناظر با عنصر (ایندکس - index) در نظر می گیرد (عنصر آرایه اصلی و شماره متناظر با آن). یعنی به شکل کلی زیر :


ارتقا دهید VIP برای مشاهده کد، باید عضویت خود را به
خرید عضویت VIP

دقت شود که نام های تعیین شده برای ورودی های تابع (Function) در کدهای تعریف تابع (Function) مهم نیستند و هر چه باشند، روش filter آنها را مطابق آنچه گفته شد، در نظر می گیرد.

نکته

روش filter ، آرایه (Array) اصلی را تغییر نمی دهد.

به مثال زیر توجه کنید :

مثال

ارتقا دهید VIP برای مشاهده کد، باید عضویت خود را به
خرید عضویت VIP

نتیجه :

خطا - صفحه را دوباره بارگذاری کنید
نکته مهم

معمولا در وب سایت های مختلف، نحوه استفاده از روش filter را به این صورت شرح می دهند که در هنگام تعریف تابع (Function)، صرفا شرط (Condition) مورد نظر در جلوی return نوشته می شود (یک شرط تک خطی). مثل تابع (Function) زیر :


ارتقا دهید VIP برای مشاهده کد، باید عضویت خود را به
خرید عضویت VIP

اگرچه این مدل استاندارد تعریف تابع (Function) در هنگام استفاده از روش filter است، اما اگر شرط (Condition) در جلوی return نوشته نشود و فقط در تابع (Function) ذکر کنیم که اگر شرط (Condition) برقرار بود، آنگاه کد مربوط به return اجرا شود (حالا هر چه جلوی return نوشته شده باشد و هر چه را که برگرداند)، آنگاه باز هم روش filter به درستی عمل می کند (ما در تابع هر چه که تعیین کرده باشیم که توسط return برگردانده شود، روش filter صرفا خود مقدار (Value) عنصر (Element) را برمی گرداند و مشکلی در عملکرد آن وجود نخواهد داشت) :


ارتقا دهید VIP برای مشاهده کد، باید عضویت خود را به
خرید عضویت VIP

مثلا اگر در تابع (Function) بالا، در جلوی return ، فقط عدد ثابت 1 را بنویسیم، باز هم روش filter به درستی عمل می کند، زیرا خط مربوط به return زمانی اجرا می شود که قبلا شرط (Condition) مورد نظرمان برآورده شده باشد (روش filter مقدار (Value) عنصر (Element) را برمی گرداند، نه عدد ثابت 1 را) :


ارتقا دهید VIP برای مشاهده کد، باید عضویت خود را به
خرید عضویت VIP

به مثال زیر توجه کنید :

مثال

ارتقا دهید VIP برای مشاهده کد، باید عضویت خود را به
خرید عضویت VIP

نتیجه :

خطا - صفحه را دوباره بارگذاری کنید
مثال

ارتقا دهید VIP برای مشاهده کد، باید عضویت خود را به
خرید عضویت VIP

نتیجه :

خطا - صفحه را دوباره بارگذاری کنید
مثال

ارتقا دهید VIP برای مشاهده کد، باید عضویت خود را به
خرید عضویت VIP

نتیجه :

خطا - صفحه را دوباره بارگذاری کنید
مثال

روش filter ، خود مقدار (Value) عنصر (Element) از آرایه (Array) اصلی را برمی گرداند و ما حتی اگر در کدهای تابع (Function)، عملیاتی را بر روی عنصر (Element) انجام دهیم و نتیجه عملیات را در تابع (Function) در جلوی return بنویسیم، روش filter آن نتیجه را به ما نمی دهد، بلکه خود مقدار (Value) عنصر (Element) از آرایه (Array) اصلی را به ما می دهد :


ارتقا دهید VIP برای مشاهده کد، باید عضویت خود را به
خرید عضویت VIP

نتیجه :

مشاهده می کنید با وجودی که در تابع (Function)، مقدار (Value) عنصر (Element) را در 3 ضرب کرده ایم و نتیجه را در جلوی return نوشته ایم (تا تابع آن نتیجه را برگرداند)، ولی روش filter ، خود مقدار (Value) عنصر (Element) از آرایه (Array) اصلی را برای ما برگردانده است :

خطا - صفحه را دوباره بارگذاری کنید
مثال

ارتقا دهید VIP برای مشاهده کد، باید عضویت خود را به
خرید عضویت VIP

نتیجه :

خطا - صفحه را دوباره بارگذاری کنید
نکته

می توانیم تابع (Function) مورد نظرمان را در ورودی خود روش filter تعریف کنیم. برای این منظور، دقیقا همان کدهایی که برای تعریف تابع (Function) می نوشتیم را درون پرانتز روش filter می نویسیم.

به مثال زیر توجه کنید :

مثال

ارتقا دهید VIP برای مشاهده کد، باید عضویت خود را به
خرید عضویت VIP

اگر در کدهای JavaScript بالا دقت کنید، مشاهده می کنید که کد تعریف تابع (Function) زیر، درون پرانتز روش filter نوشته شده است :


ارتقا دهید VIP برای مشاهده کد، باید عضویت خود را به
خرید عضویت VIP

نتیجه :

خطا - صفحه را دوباره بارگذاری کنید

آرایه ای (Array) از شیء ها (Object) :

اگر آرایه (Array) مورد نظرمان، آرایه ای (Array) از شیء ها (Object) باشد، آنگاه می توانیم روش filter را برای اجرای یک تابع (Function) بر روی مشخصه های (Property) شیء های (Object) موجود در آن آرایه (Array) به کار ببریم، تا شرط (Condition) مورد نظرمان بر روی مشخصه های (Property) شیء ها (Object) بررسی شود و سپس عنصرهایی (Element) که در شرط (Condition) صدق کرده اند، به صورت یک آرایه (Array) برگردانده می شود.

به مثال زیر توجه کنید :

مثال

ارتقا دهید VIP برای مشاهده کد، باید عضویت خود را به
خرید عضویت VIP

از روش JSON.stringify برای تبدیل آرایه (Array) شامل شیء ها (Object) به یک رشته (String) استفاده کرده ایم تا بتوانیم آن را در خروجی صفحه نمایش دهیم.

نتیجه :

خطا - صفحه را دوباره بارگذاری کنید
مثال

ارتقا دهید VIP برای مشاهده کد، باید عضویت خود را به
خرید عضویت VIP

از روش JSON.stringify برای تبدیل آرایه (Array) شامل شیء ها (Object) به یک رشته (String) استفاده کرده ایم تا بتوانیم آن را در خروجی صفحه نمایش دهیم.

نتیجه :

خطا - صفحه را دوباره بارگذاری کنید
مثال

ارتقا دهید VIP برای مشاهده کد، باید عضویت خود را به
خرید عضویت VIP

نتیجه :

خطا - صفحه را دوباره بارگذاری کنید
مثال

ارتقا دهید VIP برای مشاهده کد، باید عضویت خود را به
خرید عضویت VIP

نتیجه :

خطا - صفحه را دوباره بارگذاری کنید
منابع و لینک های مفید

کپی برداری توسط سایر وب سایت ها، ممنوع بوده و پیگرد قانونی دارد. (بیشتر بدانید)

گزینه ها
به اشتراک گذاری (Share) در شبکه های اجتماعی
نظرات 1 0 1

ارسال نظر جدید (بدون نیاز به عضو بودن در وب سایت)

جستجو در کلیدستان، توسط گوگل

جستجو در عنوان کلیدها

دسترسی سریع

×

شماره کلید


کلید
×

شماره دسته کلید


دسته کلید
×

جستجو


جستجو
آموزش jQuery
بستن دسته بندی
۴۶
تعداد کلیدهای این موضوع
لیست همه کلیدهای این موضوع
مباحث اولیه برای آشنایی با jQuery
مباحث اولیه برای آشنایی با jQuery
10
انتخاب عنصرهای صفحه (اشاره به عنصرهای صفحه)، در jQuery
انتخاب عنصرهای صفحه (اشاره به عنصرهای صفحه)، در jQuery
2
کلاس های (Class) عنصرها، در jQuery
کلاس های (Class) عنصرها، در jQuery
1
id عنصرها، در jQuery
id عنصرها، در jQuery
0
رویدادها (Event)، در jQuery
رویدادها (Event)، در jQuery
6
چک کردن محتوای صفحه، در jQuery
چک کردن محتوای صفحه، در jQuery
0
تغییر محتوای صفحه، در jQuery
تغییر محتوای صفحه، در jQuery
8
بچه های (Child) عنصرها، در jQuery
بچه های (Child) عنصرها، در jQuery
1
رنگ ها (Color) و تعیین رنگ، در jQuery
رنگ ها (Color) و تعیین رنگ، در jQuery
1
فرم ها (Form)، در jQuery
فرم ها (Form)، در jQuery
3
دکمه ها (Button)، در jQuery
دکمه ها (Button)، در jQuery
1
اندازه عنصرها و بخش های صفحه، در jQuery
اندازه عنصرها و بخش های صفحه، در jQuery
6
کلیک کردن (Click)، در jQuery
کلیک کردن (Click)، در jQuery
0
اسکرول (Scroll)، در jQuery
اسکرول (Scroll)، در jQuery
2
کار با کل صفحه، در jQuery
کار با کل صفحه، در jQuery
1
تکنیک AJAX ، در jQuery
تکنیک AJAX ، در jQuery
2
مباحث عمومی، در jQuery
مباحث عمومی، در jQuery
2
آموزش JSON
بستن دسته بندی
۴
تعداد کلیدهای این موضوع
لیست همه کلیدهای این موضوع
دسترسی سریع به دسته کلیدها :

مباحث اولیه برای آشنایی با JSON
مباحث اولیه برای آشنایی با JSON
مباحث اولیه برای آشنایی با JSON
4
دسته کلیدهایی از موضوع های دیگر
ساختار JSON ، در PHP
ساختار JSON ، در PHP
2
آموزش HTML
بستن دسته بندی
۱۰۴
تعداد کلیدهای این موضوع
لیست همه کلیدهای این موضوع
مباحث اولیه برای آشنایی با HTML
مباحث اولیه برای آشنایی با HTML
24
نمایش متن (Text)، در HTML
نمایش متن (Text)، در HTML
16
نمایش عکس (Image)، در HTML
نمایش عکس (Image)، در HTML
6
لینک ها (Link)، در HTML
لینک ها (Link)، در HTML
2
فهرست ها (لیست ها - List)، در HTML
فهرست ها (لیست ها - List)، در HTML
1
جدول ها (Table)، در HTML
جدول ها (Table)، در HTML
7
فرم ها (Form)، در HTML
فرم ها (Form)، در HTML
21
کلاس های (Class) عنصرها، در HTML
کلاس های (Class) عنصرها، در HTML
1
id عنصرها، در HTML
id عنصرها، در HTML
0
چیدمان عنصرها (Element) در کنار هم، در HTML
چیدمان عنصرها (Element) در کنار هم، در HTML
2
تعیین مشخصات کلی صفحه (Page)، در HTML
تعیین مشخصات کلی صفحه (Page)، در HTML
7
ساختار کلی و بخش بندی صفحه (Page)، در HTML
ساختار کلی و بخش بندی صفحه (Page)، در HTML
2
نمایش یا عدم نمایش عنصرها (Element)، در HTML
نمایش یا عدم نمایش عنصرها (Element)، در HTML
1
عناصر گرافیکی، در HTML
عناصر گرافیکی، در HTML
1
رنگ ها (Color) و تعیین رنگ، در HTML
رنگ ها (Color) و تعیین رنگ، در HTML
1
دکمه ها (Button)، در HTML
دکمه ها (Button)، در HTML
2
پخش صدا (Audio)، در HTML
پخش صدا (Audio)، در HTML
1
کار با کیبورد (Keyboard)، در HTML
کار با کیبورد (Keyboard)، در HTML
2
اطلاعات و پردازش اطلاعات، در HTML
اطلاعات و پردازش اطلاعات، در HTML
1
مباحث عمومی، در HTML
مباحث عمومی، در HTML
6
ویدئوهای آموزشی JavaScript (ویدئوهای رایگان از سایت های انگلیسی زبان)
بستن دسته بندی
۱۹۰
تعداد کلیدهای این موضوع
لیست همه کلیدهای این موضوع
مجموعه ویدئوهای آموزشی JavaScript - مجموعه JavaScript Tutorials - از thenewboston.com
مجموعه ویدئوهای آموزشی JavaScript - مجموعه JavaScript Tutorials - از thenewboston.com
40
مجموعه ویدئوهای آموزشی AJAX - مجموعه AJAX Tutorials - از thenewboston.com
مجموعه ویدئوهای آموزشی AJAX - مجموعه AJAX Tutorials - از thenewboston.com
23
مجموعه ویدئوهای آموزشی JavaScript - مجموعه JavaScript Tutorial
مجموعه ویدئوهای آموزشی JavaScript - مجموعه JavaScript Tutorial
75
مجموعه ویدئوهای آموزشی JavaScript - مجموعه Learn JavaScript
مجموعه ویدئوهای آموزشی JavaScript - مجموعه Learn JavaScript
19
مجموعه ویدئوهای آموزشی JavaScript برای مبتدیان - مجموعه JavaScript beginner tutorials
مجموعه ویدئوهای آموزشی JavaScript برای مبتدیان - مجموعه JavaScript beginner tutorials
33