این آموزش در تاریخ ۱۴۰۱/۰۳/۱۹ آپدیت شده است.
کار با متدهای رشته در جاوااسکریپت
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش کار با متدهای رشته در جاوااسکریپت با من همراه باشید.
Free-Learn
آنچه در این جلسه میخوانید :
- 1 کار با متدهای رشته در جاوااسکریپت
- 2 ویژگی Length در جاوااسکریپت
- 3 متد ()CharAt در جاوااسکریپت
- 4 متد ()Concat در جاوااسکریپت
- 5 متد ()IndexOf و ()LastIndexOf در جاوااسکریپت
- 6 متد ()Replace در جاوااسکریپت
- 7 متد ()Slice در جاوااسکریپت
- 8 متد ()ToString در جاوااسکریپت
- 9 متد ()toLowerCase و ()toUpperCase در جاوااسکریپت
کار با متدهای رشته در جاوااسکریپت
خب دوستان در این جلسه میخوایم با برخی از مِتُدهای ( در لغت به فارسی یعنی روش ) رشته ها در زبان جاوااسکریپت آشنا بشیم، اصلا ببینیم چین و به چه درد میخورن!؟
بطور کلی بدونید با استفاده از متد یا Method میتونیم با رشته ها کار کنیم، مثلا میتونیم تو یه رشته جستجو کنیم ، میتونیم رشته ای رو درون رشته دیگر جایگزین کنیم و… که در ادامه با برخی از این متدها آشنا خواهید شد.
متدها تعدادشون زیاده به همین دلیل در این جلسه فقط با چنتا از پرکاربردترین متدها آشنا خواهیم شد.
توجه داشته باشید که متدها، فقط میتونن پردازش انجام بدن و در نهایت این پردازش میتونه یه خروجی جدید داشته باشه فقط همین، اینکه بگیم متدها میتونن خوده متغیرهارو تغییر بدن خیر نمیتونن.
Free-Learn
ویژگی Length در جاوااسکریپت
فک کنم اسمش براتون مشخص باشه ، کلمه Length به فارسی میشه طول ، حال ما با استفاده از این ویژگی میتونیم طول تعداد کاراکترهای یه رشته رو به راحتی بدست آوریم.
مثال شماره ۱ : محاسبه تعداد کل کاراکترهای متغیر myname و نمایش در خروجی
|
1 2 3 4 5 6 7 |
<script> var MyName = "Sadegh Asadi"; document.write("تعداد کاراکتر ها :" + MyName.length); // خروجی میشه 12 </script> |
مثال شماره ۲ : محاسبه تعداد کاراکترهای موجود در یک باکس متن ( Textarea ) ( وقتی شروع به تایپ کردن کنید اونم تعداد کاراکترهارو شمارش میکنه )
|
1 2 3 4 5 6 7 8 9 10 11 |
<script> function MyFunction(){ var MyText; var result; MyText = document.getElementById("mytext").value; result = document.getElementById("result"); result.innerHTML = MyText.length; } </script> |
Free-Learn
متد ()CharAt در جاوااسکریپت
بطور کلی این متد میتونه پوزیشن ( یا به انگلیسی Position ) یا خودمونی محل و جایگاه یه کاراکتر رو در یک رشته بدست بیاره.
محل یا جایگاه یه کاراکتر بر اساس شماره ایندکس ( index ) بدست میاد، در زبان جاوااسکریپت همیشه شماره ایندکس از ۰ شروع میشه و تا بی نهایت ( بی نهایت منظورم اینه که بستگی به طول رشته داره ).
بفرض مثال کلمه ( Free ) شماره ایندکس ۰ میشه F و ۱ میشه r و ۲ میشه e و ۳ هم میشه e ، حالا دیگه میخواد یه کلمه ۲ حرفی باشه یا ۱۰۰ حرفی ، در هر صورت ایندکس از ۰ شروع میشه.
مثال شماره ۱ : بدست آوردن جایگاه اولین کاراکتر در متن
|
1 2 3 4 5 6 |
<script> var mysite = "Free-Learn"; document.write(mysite.charAt(0)); </script> |
مثال شماره ۲ : بدست آوردن جایگاه آخرین کاراکتر در متن
برای بدست آوردن جایگاه یه کاراکتر از آخر باید length-1 و برای دومین کاراکتر از آخر length-2 و همینجور تا بی نهایت استفاده کرد.
|
1 2 3 4 5 6 7 |
<script> var mysite = "Free-Learn"; var Natije = mysite.charAt(mysite.length-1); document.write( Natije ); </script> |
Free-Learn
متد ()Concat در جاوااسکریپت
با استفاده از این متد Concat میتونیم یک یا چندین رشته رو بهمدیگه پیوند بزنیم. ( یا در واقع بچسبونیم )
|
1 2 3 4 5 6 7 8 |
<script> var MyName = "Sadegh Asadi"; var MySite = " - Free-Learn"; var Natije = MyName.concat(MySite); document.write( Natije ); </script> |
Free-Learn
متد ()IndexOf و ()LastIndexOf در جاوااسکریپت
با استفاده از متد IndexOf و LastIndexOf به ترتیب میتونیم از ابتدا و انتهای یک رشته اولین شماره ایندکس ( Index ) یا جایگاه یک رشته رو بدست بیاوریم.
lastIndexOf از آخر متن به ابتدا جستجو میزنه ولی شماره ایندکس رو از ابتدای رشته برمیگردونه.
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<script> var MyText_1 = "Free Learn Is My Site"; var MyText_2 = "Free Learn Is Free Learn"; var result_1 = document.getElementById("Result1"); var result_2 = document.getElementById("Result2"); result_1.innerHTML = MyText_1.indexOf("Learn"); result_2.innerHTML = MyText_2.lastIndexOf("Learn"); </script> |
Free-Learn
متد ()Replace در جاوااسکریپت
همونطور که از نام این متد Replace مشخصه ، با استفاده از آن میتوان یک رشته رو در درون یک رشته دیگه اول جستجو زد و بعدش جایگزین همون رشته ی جستجو شده کرد.
|
1 2 3 4 5 6 7 8 9 |
<script> function MyFunction(){ var MyText = "Salam Khobi? Man Reza Hastam."; var Result = document.getElementById("result"); Result.innerHTML = MyText.replace("Reza", "Sadegh"); } </script> |
Free-Learn
متد ()Slice در جاوااسکریپت
خب دوستان در ادامه ی آموزش کار با متدهای رشته در جاوااسکریپت میخوایم با متد Slice آشنا بشیم و ببینیم این متد چکار میکنه.
کلمه Slice در لغت معنیش میشه ( تکه یا بُرِش ) ، حال ما با استفاده از این متد میتونیم بخشی یا تکه ای از یک رشته رو بُرش بزنیم و در نهایت در خروجی به نمایش درآوریم.
ما باید شماره ایندکس یا جایگاه اون رشته ای که میخوایم بُرش بزنیم رو بهش بدیم، مثلا در مثال زیر گفتیم ۰ تا ۱۰ ، یعنی از ایندکس شماره ۰ تا ۱۰ رو بُرش میزنه.
|
1 2 3 4 5 6 7 |
<script> var MyText = "Free-Learn Is Free"; var Natije = MyText.slice(0, 10); document.write(Natije); </script> |
Free-Learn
متد ()ToString در جاوااسکریپت
با استفاده از این متد ToString میتونیم یک متغیر رو به نوع رشته ای یا String تبدیل نماییم، یا هم میتونیم مثلا ۲ تا نوع عددی رو به رشته ای تبدیل کنیم.
مثال شماره ۱ : تبدیل ۲ متغیر که از نوع عددی هستن به نوع رشته ای
|
1 2 3 4 5 6 7 8 |
<script> var Number_1 = 10; var Number_2 = 10; var Natije = Number_1.toString() + Number_2.toString(); document.write(Natije); </script> |
Free-Learn
متد ()toLowerCase و ()toUpperCase در جاوااسکریپت
فک کنم خیلی جاها این متد رو دیده باشید ، از اسم هاشون هم مشخصه که برای چه کاری ازشون استفاده میشه ، از toUpperCase برای تبدیل حروف کوچک انگلیسی به حروف بزرگ و toLowerCase هم برعکس همینکار ( یعنی تبدیل حروف بزرگ به کوچک )
|
1 2 3 4 5 6 7 8 9 10 11 |
<script> var MyText = "SaLaM KhoBI?"; var LC = MyText.toLowerCase(); var UC = MyText.toUpperCase(); document.write(LC); document.write("<br>"); document.write(UC); </script> |
