Javascript

|

اموزش ارایه در جاوا اسکریپت

در این مقاله میخواهیم در مورد ارایه ها و object ها در زبان جاوا اسکریپت صحبت کنیم.

زمانی که شما با داده های بسیار زیاد و مشابه هم سرو کار دارید باید اون ها رو در یک ساختاری ذخیره کنید.ارایه ها و object ها چنین ساختاری رو به ما میدن .

مثلا فرض کنید میخواهید نام و سن صدها کاربر در برنامه داشته باشید به جای اینکه از صدها متغییر برای دخیره این مقادیر استفاده منید از یک متغییر ارایه ای استفاده میکنید.

جاوا اسکریپت زبانی است که بر مبنای زبان های object oriented ها بنا شده . در این زبان ها با قسمت های مختلف برنامه نویسی میتونید به عنوان object یا شی برخورد کنید. میتونید شی جدیدی رو تعریف کنید که ما اینجا از شی همون object هست. هر object از چندین property و یا متد تشکیل میشه منظور از property ویژگی هایی هستند که یک مقدار میتونه داشته باشه. مثلا اگر شما برای یک انسان objecti رو تعریف کنید ویژگی های اون میشن سن ، جنسیت و غیره.

در متد ها هم اعمالی هستند که اون object میتونه انجام بده یا در روی اون object میشه اعمال بشه. مثلا برای همون object انسان میشه متد های راه رفتن ، غذا خوردن و متدهایی از این قبیل رو تعریف کرد.

به طور مثال ما در اینجا متد txt داریم که از نوع object استرینگ هست و مقدار hello word رو در خودش ذخیره کرده. ما میتونیم با قرار دادن یک دات به ویژگی آن دسترسی داشته باشیم. به طور مثال ما در اینجا txt.length طول متغییر چه قدر هست که در اینجا hello word از ۱۲ کاراکتر تشکیل شده و با متد document.write این عدد ۱۲ را چاپ میکنیم.

Var txt=”hello word!” ;

Document.write(txt.length);

خروجی : 12

برای دسترسی به متد های یک object هم به همون شکل عمل مینیم یعنی با اوردن یک دات بعد از object نام متد تعریف شده را میاریم.

به طور مثال ما در اینجا در متغییر string در نوع object کلمه ی hello word را ذخیره کردیم و با متد toUpeperCase میخواهیم همه کاراکترهای اون رو به حروف بزرگ تبدیل کنیم.

Var str=”hello word!” ;

Document.write(str.toUpperCase() );

خروجی : HELLO WORD

ارایه ها

همون طور که گفتیم ارایه ها میتونن مقادیر مختلفی رو در یک متغییردخیره کنند. اگر نخواهیم از ارایه ها استفاده کنیم باید اون ها رو در متغییرهای مختلفی ذخیره کنیم.

مثلا در name1 نام کاربر اول در name2 نام کاربر دوم و الی اخر

Var name1=”jalal”;

Var name2=”asghar”;

Var name3=”hooshang”;

در صورتی که با استفاده از ارایه ها ما یک متغییر کلی به نام names تعریف میکنیم و همه اون ها رو به این متغییر نسبت میدیم.

Var names=new array ();

Names[0]=”jalal”;

Names[1]=”asghar”;

Names[2]=”hooshang”;

برای اینکه ارایه را بسازیم میتونیم از ۳ روش استفاده کنیم.

روش اول:

با استفاده از کلید new array متغییر names رو یک متغییر در نظر میگیریم و مانند مثال بالا که مشاهده میکنید عمل میکنیم.

روش دوم:

شما new array رو تعریف می کنید و درون متد array مقادیری که اون ارایه میتونن داشته باشند رو وارد می کنید.

Var myCars=new Array(“jalal” , “asghar” , “hooshang”);

روش سوم:

مستقیما مقادیر رو درون یک اکولاد باز و بسته میاریم.

Var myCars=[“jalal” , “asghar” , “hooshang”];

برای اینکه به اعضای درونی یک ارایه دستریسی داشته باشید همون طور که در بالا هم دیدید ایندکس اون عضو رو در جلوی نام ارایه قرار میدیم.

مثلا ما میخوایم در انیجا myName عنصر اولی رو که 0 هست چاپ کنیم .

Document.write(myNames[0]);

خروجی : jalal

و اگر بخواهید مقدارجدیدی رو برای یکی از اعضای ارایه ست کنید به این شکل می شود.

myNames[0]=”jamshid’;

document.write(myNames[0]);

خروجی: hooshang

برای ارایه ها به طور پیش فرض ویژگی های مختلفی تعریف شده که در زیر ما مقداری از آنها را اورده ایم.

اموزش جاوا اسکریپت

ادامه پیش فرض ها را میتوانید در سایت w3schools.com مشاهده نمایید.

مثال:

میخواهیم یک ارایه را تعریف کنیم و اعضای آن را هم تنظیم کنیم و بعد از اون همه ی اعضای ارایه رو در یک حلقه ی for چاپ کنیم.

در مقاله ی گذشته در مورد حلقه ها اموزش دادیم.

ما در اینجا یک ارایه colors تعریف کردیم که شامل ۵ رنگ مختلف هست .

Colors=[“red” , “green” , “blue” , “yellow” , “orange”];

For(i=0 ; i<=colors.length; i++) {

Document.write(colors[i] + ‘<br>’ ) ;

}

خروجی:

Red

Green

Blue

Yellow

Orange

حال میخواهیم نام هر رنگ رو با رنگ خودش در صفحه چاپ کنه.

Colors=[“red” , “green” , “blue” , “yellow” , “orange”];

For(i=0 ; i<=colors.length; i++) {

Document.write(‘<span style=’color: +colors[i]+’ “ > ‘ );

Document.write(colors[i] + ‘<br>’ ) ;

Document.write(‘</span>’);

}

در اینجا ویژگی های css رو با جاوا اسکریپت همراه کردیم.

خروجی:

Red

Green

Blue

Yellow

Orange

دریافت آخرین مطالب وبلاگ در کانال داتینه

بهاره شهسواری

بهاره شهسواری ، کارشناس نرم افزار هستم .
از سال 91 مشغول به یادگیری زبان های css ,html , javascript و jquery شدم
و از سال 93 به صورت اختصاصی به فعالیت در حوزه css و html پرداختم. علاوه بر کد نویسی به گرافیک هم علاقه مند هستم.

نظرات
نظر بدهید