آموزش ویژگی های ECMAScript 6 (جلسه 15) : آموزش مقدماتی کلاسها



visibility  
mode_comment   ۰

همونطور که اطلاع دارید در جلسه گذشته در مورد متدهای جدید is و assign که در ES6 به شئ سراسری Object اضافه شده اند، صحبت کردیم و شما رو با اونا آشنا کردیم. در این جلسه قصد داریم کار با Class ها و شئ گرایی در ES6 رو شروع کنیم و مقدماتی در مورد اونا رو بهتون بگیم. همونطور که میدونین بیشتر زبانهای برنامه نویسی معروف و پرطرفدار، شئ گرایی یا Object Oriented Programming رو درون خودشون دارن و میتونین از اون درونشون استفاده کنید و برنامه های خودتون رو به وجود بیارید. اما Javascript از روز اول با این دید ساخته و توسعه داده نشد و شئ گرایی رو درون خودش قرار نداد و کمبود اون خیلی در Javascript حس میشد. با گذشت زمان و به وجود آمدن prototype و constructor و ... میتوانستیم حالت شئ گرایی رو تا درصد زیادی شبیه سازی کنیم. در ES6 خیلی به این مبحث و شئ گرایی توجه شده است و تغییرات زیادی در Syntax و نحوه استفاده از اون به وجود اومده. در پس زمینه همون کارهایی انجام میشه که در گذشته نیز انجام میشده اما کدها و Syntax تقریبا شبیه به دیگر زبانهای برنامه نویسی شده اند و راحتتر میتونین کدنویسی کنید. Syntax جدید ارائه شده در ES6 تفاوتهایی نیز داره که میتونین اونا رو در اینجا مطالعه کنید. در ES5 و قبل از اون هیچ کلاسی وجود نداشت و توسعه دهندگان Javascript برای نوشتن کد بصورت شئ گرا باید ابتدا یک function constructor رو به وجود میاوردن و بعد از اون متدهای مورد نظرشون رو به prototype اون اضافه میکردن. پس کدها قبل از ES6 بصورت زیر خواهند بود:

میبینید که در ابتدا یک تابع سازنده یا function constructor بنام Person رو تعریف کردیم و ویژگی name رو مقداردهی کردیم. در خط 5 نیز متد getName رو به prototype این سازنده اضافه کردیم و کارش این هست که مقدار name رو در Console چاپ بکنه. در خط 9 با استفاده از عملگر new، یک نمونه جدید از کلاس Person به وجود آوردیم و اون رو به متغیر person نسبت دادیم. برای این نمونه مقدار name رو برابر با Mohammad در نظر گرفتیم. با اینکار زمانی که در خط 10 متد getName از شئ person رو فراخوانی میکنیم، مقدار Mohammad در Console چاپ خواهد شد. شما میتونین با استفاده از عملگر instanceof چک کنید که یک شئ نمونه ای از شئ دیگر هست یا خیر. برای مثال کدهای زیر رو در نظر بگیرید:

میبینید که در خط 1 بررسی شده که شئ person نمونه ای از سازنده Person هست یا خیر. چون ما person رو از روی Person به وجود آوردیم، پس جواب true خواهد بود. در خط بعد نیز بررسی شده که person نمونه ای از شئ سراسری Object هست یا خیر. همه اشیاء نمونه ای از شئ سراسری هستند و به همین دلیل جواب این مورد نیز true خواهد بود.

اگر بخوایم همین کار رو با استفاده از ES6 و Syntax جدیدی که برای کلاسها معرفی کرده است، بازنویسی کنیم، کدها بصورت زیر خواهند شد:

میبینید که کلاس بنام Person رو تعریف کردیم و ویژگی name رو درون constructor مقداردهی کردیم و یک متد بنام getName رو تعریف کردیم و ویژگی name رو در Console چاپ کردیم. میبینید که همون کارهای قبل انجام میشه ولی با Syntax و روش شبیه به زبانهای برنامه نویسی دیگر. با اینکار خروجی مانند حالت قبل خواهد بود:

اگر بخوایم بهتون ثابت کنیم که کلاس و متدهای استفاده شده در اون همانند مثال قبل، تابع هستند، میتونیم از عملگر typeof استفاده کنیم تا نوع اون رو متوجه بشیم. بصورت زیر:

اگر در خروجی نتیجه موارد بالا رو ببینیم، متوجه که نوع هر 2 اونا function است. نکته ای که باید در مورد Class ها در ذهنتون داشته باشید اینه که حتما اول class ها رو تعریف کرده و بعد از اونا استفاده کنید تا با مشکل مواجه نشید. در جلسه بعد بیشتر در مورد کلاسها براتون توضیح میدیم.

موفق و پیروز باشید.

یا علی

comment دیدگاه کاربران
ارسال نظرات

کاربر گرامی، امکان ارسال نظر و پشتیبانی برای دوره های مجازی فقط برای دانشجویان این دوره امکان پذیر می باشد.